Skip to content
πŸ“ A devtool for measuring pixel dimensions on your React Native screens
Branch: master
Clone or download
Latest commit 349ed67 Jun 5, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
src x and y axis toggleable May 24, 2019
.eslintrc.js split out components Jan 12, 2019
.gitignore x and y axis toggleable May 24, 2019
.prettierrc.js
LICENSE measureX working Jan 30, 2019
README.md Update README.md Jun 5, 2019
demo.gif update gif May 24, 2019
package.json x and y axis toggleable May 24, 2019
yarn.lock split out components Jan 12, 2019

README.md

react-native-ruler

npm version

πŸ“ A devtool for measuring pixel dimensions on your React Native screens

iOS Example

This is a proof of concept I threw together on a flight. Eventual plans are to integrate within the devtools menu, support rotating the device, allow the bars to be on any of the 4 sides of the device, etc..

Happy to take PRs or suggestions.

Getting Started

Installing

npm install react-native-ruler

Usage

// first, import the component
import { RNRuler } from 'react-native-ruler';

// then drop it on any screen in your app (or in the root)
<RNRuler />;
  • Tap the bottom right corner of the ruler (or two-finger tap the bar) to swap between axis

License

react-native-ruler is MIT licensed

You can’t perform that action at this time.