V
V
Vasily Norman2016-11-13 00:42:19
Android
Vasily Norman, 2016-11-13 00:42:19

How to implement navigation through ListView items in react-native using hardware keyboard?

Actually the question is in the title. I can't even highlight the selected item when clicked... So far, the component code is like this:

class DrawerMenu extends Component {
  constructor() {
    super()
    const ds = new ListView.DataSource({
      rowHasChanged: (r1, r2) => r1 !== r2
    });
    this.state = {
      dataSource: ds.cloneWithRows(menu)
    }
  }

  renderRow(item) {
    return (
      <TouchableHighlight
        underlayColor='#aaa'
        style={{
        flex: 1
      }}
        color='white'>
        <View
          style={{
          height: 42,
          flexDirection: 'row',
          alignItems: 'center',
          paddingLeft: 10
        }}>
          <Icon name={item.icon} size={30} color={colors.white}/>
          <Text
            style={{
            fontSize: 12,
            color: colors.white,
            marginLeft: 10
          }}>{item.title}</Text>
        </View>
      </TouchableHighlight>
    )
  }

  render() {
    return (
      <ScrollView style={{
        flex: 1
      }}>
        <View
          style={{
          height: 80,
          backgroundColor: colors.teal
        }}></View>
        <ListView
          dataSource={this.state.dataSource}
          renderRow={this.renderRow}
          renderSeparator={(sectionId, rowId) => <View key={rowId} style={styles.separator}/>}/>
      </ScrollView>
    )
  }
}

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question