React Native中KeyboardAvoidingView的 Flink 问题

7nbnzgx9  于 2023-10-22  发布在  React
关注(0)|答案(1)|浏览(87)

我在使用KeyboardAvoidingView时遇到React Native应用 Flink 问题。当我退出一个输入字段时,问题出现了,WaveSVG组件 Flink 。

<View style={{ flex: 1, backgroundColor: COLORS['backgroundColor'] }}>
      <Stack.Screen options={{ headerShown: false }} />
      <KeyboardAvoidingView
        behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
        style={{ flex: 1 }}
      >
        <ScrollView
          keyboardShouldPersistTaps='handled'
          contentContainerStyle={{ flex: 1 }}
        >
          <View style={{ flex: 1, marginTop: 100, margin: 20 }}>
            <Text style={SignInStyles.title}>Hi,{'\n'}sign up!</Text>
            <View style={{ flexDirection: 'column', gap: 30 }}>
              <Text style={SignInStyles.description}>Get started now!</Text>
              <Input
                placeholder='Email'
                autoCapitalize='none'
                keyboardType='email-address'
                autoComplete='email'
              />
              <Input
                placeholder='Password'
                autoCapitalize='none'
                secureTextEntry={true}
              />
              <Button style={{ alignSelf: 'stretch' }}>Sign up</Button>
            </View>
          </View>
        </ScrollView>
      </KeyboardAvoidingView>
      <WaveSVG />
    </View>

调整父视图中WaveSVG组件的位置和布局。我希望WaveSVG组件在我退出输入字段时不会 Flink 。

mf98qq94

mf98qq941#

我已经找到了解决这个问题的办法...在app.json文件中,

android": { 
"softwareKeyboardLayoutMode": "pan", 
}

有了这个,

相关问题