Question

我有一个FlatList，其中包含使用PanResponder进行的一系列可拖动元素。元素拖动得很好，除了将它们“锁定”到FlatList所在的区域外，没有任何问题。 FlatList仅约占屏幕宽度的三分之一，我希望它们能够将这些元素从这三分之一拖到另外三分之二，但我似乎无法与它们一起超出FlatList。如果我删除了FlatList，那么除了可以滚动浏览各项以外，其他一切都可以按我的要求进行。

我不确定是因为它们被锁定在FlatList中还是缺少某种东西，或者是否有其他更好的方法。关于如何允许将这些元素拖到FlatList之外的任何想法，将不胜感激。

主渲染

    <View style={{padding: 10, display: "flex", justifyContent: "center"}}>
       <FlatList 
            numColumns={2}
            data={this.props.fixtures}
            keyExtractor={this.keyExtractor}
            renderItem={(item) =>this.renderFixture(item)}
        />
    </View>

renderItem函数

    renderFixture = (item) => {
        let i = item.item;
        return <View style={{padding: 5, marginBottom: 10}}>
                    <DragDropSidebar onDrop={this.props.onDrop} fixtureName={i.key} imgUrl={i.url} height={i.height} width={i.width}>
                        <FastImage style={{borderRadius: 5}} source={{uri: i.url}} style={{width: 150, height: 150}}/>
                    </DragDropSidebar>
                <Text style={{color: "white", padding: 5}}>{i.name}</Text>
        </View>
    }

Answer 1

我找到的解决问题的方法实际上非常简单。我没有意识到默认的溢出值在FlatList上发生了变化。将我的溢出值设置为在FlatList上可见可以解决我的问题。

FlatList将PanResponder项锁定在其中

1 个答案: