How do you get the size of the frame in ReactNative?

Question

In Swift or Objective-C, you could do self.frame.size.width, but what would the equivalent be in ReactNative?

Answer 1

You should run "measure" method on the view you would like to get width (amongst others) of (you can run it for any component, even the whole view):

this.refs.myRef.measure((a, b, width, height, px,py ) =>
   this.setState({ myWidth: width })
);

Note that there are some possible issues you might fall into some traps with this (undefined reference right after component is mounted) which can be solved by an ugly hack with timeout: React-Native : measure a View

Answer 2

I found a handy library react-native-device. You would call Device.width()

https://github.com/GertjanReynaert/react-native-device

(edited)

Actually, that library ended up breaking my application. A much easier way is requiring Dimensions.js which is built into react

var Dimensions = require('Dimensions'); Dimensions.get('window').width);