How to measure a list view row location in a page

Question

I am using the react native Listview component.

How can I measure the coordinates of a row? I need to know these coordinates for an animation I am doing in a more complex view.

I have found the method measure from NativeMethodsMixin but I cannot get it to work. I get the following error : measure is not a function

How can I use the measure function to get the coordinates of a row when needed?

Minimal starting point :

class MyComponent extends Component { 
   constructor() { 
     super(); 
     const ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2}); 
     this.rows = []
     this.state = { dataSource: ds.cloneWithRows(['row 1', 'row 2'])}; 
   } 
   render() { 
    return ( 
       <ListView dataSource={this.state.dataSource} renderRow={
            (rowData) => 
                 <TouchableWithoutFeedback
                    ref={(row) => {
                       this.rows[rowData] = row
                    }}
                    onPress={(event) => {
                       this.rows[rowData].measure(
                          (x, y, width, height, pageX, pageY) => {})
                    }}>
                    <Text>{rowData}</Text>
                 </TouchableWithoutFeedback>
       } /> 
    ); 
  } 
}

Answer 1

I think a TouchableWithoutFeedback cannot be measured. Is this an issue? I am not sure if this is the expected behavior.

I got it working by wrapping the TouchableWithoutFeedback inside a View and measuring the view instead!