Question

当TextInput处于焦点状态并且用户滚动直到输入离开可见帧时，输入变得模糊并且键盘消失。我该如何解决？

我正在Android模拟器中运行代码。在iOS上不会发生此问题。如果尝试点击FlatList底部的TextInput，则键盘会立即关闭，这可能是因为一旦打开，Input就会在Keyboard下方。任何线索将不胜感激

这是要复制的代码

    var dotNumber = 0;
    var myVar = setInterval(() => {
        var dot = document.querySelectorAll('.dot');
        dot[dotNumber].style.backgroundColor = 'blue';

        dotNumber +=1; 

        if (dotNumber >= dot.length){
           clearInterval(myVar);
        }  
     }, 2000);

Input losing focus when scrolling

即使看不见输入，输入也应保持专注，并且用户应该能够输入文本。这使得整个应用无法在Android上使用

Answer 1

如果使用FlatList渲染视图而不输入数据，则需要设置removeClippedSubviews={true}或使用默认选项来优化渲染视图。

对于您的情况（使用输入进行渲染），应设置removeClippedSubviews={false}以防止键盘隐藏/显示。

<FlatList removeClippedSubviews={false} />

Answer 2

好吧，我想出了一种方法来解决此问题：通过使用Expo，一切都会按预期进行。不是最好的解决方案，但它可以工作

Answer 3

将Flatlist保留在ScrollView内，以便在单击底部文本输入时将视图向上移动并允许键盘显示。

 <ScrollView>
    <FlatList
        data={["a", "b", "c", "d", "e", "f", "g", "h", "i", "j", "k", "l", "m", "n", "o", "p", "q", "r", "s", "t"]}
        keyExtractor={item => item}
        renderItem={({item}) => (
            <TextInput placeholder="0.0"
                keyboardType='decimal-pad'
                onFocus={() => {void(0)}}
            />
        )}
    />  
</ScrollView>

Answer 4

好吧，这是一个经常发生的问题，这是关于键盘和平面列表的焦点的问题，您可以在android的清单中添加一个活动

<activity android:windowSoftInputMode="adjustPan">

也许不是最好的选择，但至少您可以摆脱使用expo的麻烦。

来源：https://developer.android.com/guide/topics/manifest/activity-element#wsoft

屏幕外时FlatList中的TextInput失去焦点

4 个答案: