React Native - How to measure content size in ScrollView?

Question

I want to measure the size of the content in a ScrollView .

Therefore, I use measure from NativeMethodsMixin :

 import NativeMethodsMixin from 'NativeMethodsMixin' 

I'm not quite sure where to go from here; most of the SO posts related to this issue seem outdated.

I understand that I need to create a ref for my ScrollView (which I did and called _scrollView , I can access it using this.refs._scrollView ).

The problem is that I cannot just pass this.refs._scrollView to measure like this:

 NativeMethodsMixin.measure(this.refs._scrollView, (data) => { console.log('measure: ', data) }) 

I get the following error:

 ExceptionsManager.js:61 findNodeHandle(...): Argument is not a component (type: object, keys: measure,measureInWindow,measureLayout,setNativeProps,focus,blur,componentWillMount,componentWillReceiveProps) 

Then I tried to retrieve the actual node descriptor using findNodeHandle and pass it to measure , as discussed in this github issue

 const handle = React.findNodeHandle(this.refs._scrollView) NativeMethodsMixin.measure(handle, (data) => { console.log('measure: ', data) }) 

But this leads to the same error. Any ideas?

Answer 1

 NativeMethodsMixin.measure.call(elementToMeasure, (x, y, width, height) => { ... }); 

Answer 2

ScrollView defines a link called onContentSizeChange :

 <ScrollView onContentSizeChange={(width, height) => { console.log(width, height); }}> {content} </ScrollView>