React-native: как управлять клавиатурой
Структура приложения довольно проста: панель поиска, список и интерактивные вкладки внизу. Проблема: если я нажму на панель поиска на Android, она подталкивает все приложение, поэтому я вижу вкладки прямо над клавиатурой. Но на iOS клавиатура накладывает все приложение, не нажимая ничего. Есть ли способ контролировать это?
Я рад поделиться кодами/скриншотами, если вопрос не ясен.
Благодаря
изменить:
<View style={{flex:1, backgroundColor: '#f2f2f2'}}>
<ListView
dataSource={this.state.dataSource}
renderRow={this.renderSearchResults.bind(this)}
style={styles.listView}
/>
<KeyboardAvoidingView
style={styles.addQuestionBar}
behavior={'position'}>
<Text>
Don't see your question?
</Text>
<TouchableOpacity>
<Text>
Add it
</Text>
</TouchableOpacity>
</KeyboardAvoidingView>
</View>
Ответы
Ответ 1
Установите android:windowSoftInputMode="adjustPan"
в файл манифеста, и он будет работать так, как вы ожидаете.
например.
<application
android:name=".MainApplication"
android:allowBackup="true"
...
<activity
android:name=".MainActivity"
android:label="@string/app_name"
...
android:windowSoftInputMode="adjustPan">
...
</activity>
...
</application>
Ответ 2
Существует новый Компонент под названием KeyboardAvoidingView из React Native, который еще не задокументирован, но я уже использую его в своем проекте и его очень полезном
Пример кода:
'use strict'
import { ... , KeyboardAvoidingView } from 'react-native'
class Test extends Component {
constructor () {
super()
this.state = {
behavior: 'position'
// there is three ways to adjust (position , height , padding )
}
}
render(){
return (
<View>
<KeyboardAvoidingView behavior={this.state.behavior}>
<TextInput
style={style.PhoneNumberInput}
onChangeText={(text) => this.setState({text})}
value={this.state.text}
/>
</KeyboardAvoidingView>
</View>
)
}
}
module.exports = Test
и для более подробной информации вы можете проверить KeyboardAvoidingViewExample
EDIT:
Извините, я только что получил неправильную идею из вопроса, я думаю, что вы пытаетесь остановить клавиатуру Android от нажатия приложения здесь, это компонент, который позволяет вам выбирать между (Pan, Resize, Nothing) в android
react-native-android-keyboard-adjust