首页 > 解决方案 > Making ListView Clickable React Native

问题描述

I am trying to make my ListView clickable so that whenever the user clicks anywhere on the screen. An item is added to the list. Now the problem I am facing is that the listview is not scrolling.

So to solve this issue I wrapped my ListView with TouchableWithoutFeedback to make the screen clickable but unfortunately it cant be scrolled.

So to solve the scrolling issue I wrapped the whole thing under ScrollView. But the problem now I am facing is that since during the start only 1 item is there in the listview so the whole screen isn't clickable only that small portion is that the 1 item takes on the screen is clickable.

Is there a solution to this problem?

 <ScrollView>
        <Screen
          onStartShouldSetResponder={() => true}
          style={{
            flex: 1
          }}
        >
          <TouchableOpacity
            style={{ flex: 1 }}
            onPress={() => this.addMessage()}
          >
            <ListView
              data={this.state.readMessages}
              renderRow={this.renderRow}
              scrollEnabled={true}
            />
          </TouchableOpacity>
        </Screen>
      </ScrollView>

This is what I ended up in the end.

标签: androidioslistviewreact-nativeshoutem

解决方案


您可以在使用 ListView 时删除 scrollView。

      <TouchableOpacity
        style={{ flex: 1 }}
        onPress={() => this.addMessage()}
      >
<ScrollView>
    <Screen
      onStartShouldSetResponder={() => true}
      style={{
        flex: 1
      }}
    >
        <ListView
          data={this.state.readMessages}
          renderRow={this.renderRow}
          scrollEnabled={true}
        />
    </Screen>
</ScrollView>
      </TouchableOpacity>

你可以试试上面的代码。还有一件事,ListView已被弃用。您可以使用FlatList


推荐阅读