ReactNative 使用 TextInput 組件的時(shí)候缎除,蘋果端適配的效果很友好严就,安卓端可能會(huì)遇到鍵盤彈出后遮住 input 輸入框的情況,那么可能會(huì)因?yàn)槿缦屡渲脤?dǎo)致的器罐;
將此配置參數(shù)變更即可梢为,暫時(shí)經(jīng)過測(cè)試過后無(wú)需添加 KeyboardAvoidingView 并特殊處理 keyboardVerticalOffset 屬性即可,可供大家參考轰坊;
首先铸董,在 Android 項(xiàng)目工程中 app => src => main => AndroidManifest.xml 中 activity 查看 windowSoftInputMode 參數(shù):
<activity
android:name=".MainActivity"
android:label="@string/app_name"
android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
android:screenOrientation="landscape"
android:windowSoftInputMode="adjustResize">
其次,將 android:windowSoftInputMode 的屬性從 adjustResize 變更為 adjustPan 即可肴沫;
android:windowSoftInputMode="adjustPan
UI 處并沒有做特殊操作粟害,code 如下:
<View style={styles.accountInputStyle}>
<View style={{ height : 30, width : 40, marginLeft : 10, marginTop : 7 }}>
<Icon name={'ios-phone-portrait'} type={'ionicon'}/>
</View>
<View style={{ borderColor : 'gray', width : 150 }}>
<TextInput
placeholder="請(qǐng)輸入用戶名"
style={{ width : 130, fontSize : 14, color : 'gray' }}
onChangeText={text => setUsername(text)}
value={username}
autoCapitalize='none'
/>
</View>
<View style={{ marginLeft : 10, marginRight : 10, borderLeftWidth : 0.5, borderLeftColor : 'gray' }}>
<Button title={'清空'} color={'gray'} onPress={() => setUsername('')}/>
</View>
</View>
最后,該 windowSoftInputMode 屬性是用來設(shè)置軟鍵盤的模式颤芬,其中有幾種模式可供選擇悲幅;
stateUnspecified
軟鍵盤的狀態(tài)并未做專門指定(即:默認(rèn)屬性)孽文,系統(tǒng)將默認(rèn)選擇當(dāng)前合適的模式進(jìn)行顯示;stateUnchanged
該模式下鍵盤狀態(tài)將采用以之前頁(yè)面狀態(tài)夺艰,若上一級(jí)頁(yè)面狀態(tài)為彈出狀態(tài)芋哭,則 push 到該頁(yè)面后則會(huì)繼續(xù)保持該狀態(tài);stateHidden
鍵盤始終處于隱藏狀態(tài)郁副;stateAlwaysHidden
該模式與 stateHidden 類似减牺,相對(duì)級(jí)別會(huì)更高一等;stateVisible
該模式下鍵盤則會(huì)始終處在激活狀態(tài)一直顯示著存谎;stateAlwaysVisible
該模式下與 stateVisible 類似拔疚,若設(shè)置為該模式則 push 到該頁(yè)面無(wú)論頁(yè)面中是否存在有類似 input 的錄入框,鍵盤均會(huì)彈出顯示既荚,與 stateHidden 和 stateAlwaysHidden 類似稚失;adjustUnspecified
該模式下鍵盤狀態(tài)則由系統(tǒng)自行判斷控制隱藏還是顯示,頁(yè)面空間中彈出遮罩層可能遮罩的哪些控件恰聘;adjustResize(視圖中含有滾動(dòng)屬性組件情況下使用該模式更佳)
該模式下鍵盤彈出后則會(huì)自動(dòng)調(diào)整屏幕上一些組件的布局句各,為鍵盤預(yù)留出彈出空間,圖層中圖片部分的位置會(huì)被頂起晴叨,但部分組件則會(huì)保持現(xiàn)有位置不變凿宾,如 input 錄入框可能也會(huì)被遮擋住兼蕊;adjustPan(視圖中沒有滾動(dòng)屬性組件情況下使用該模式更佳)
該模式下鍵盤彈出后則系統(tǒng)將會(huì)對(duì)布局進(jìn)行位移初厚,從而保證錄入框在用戶的可視范圍內(nèi),若界面中沒有滾動(dòng)組件孙技,則效果類似于 adjustUnspecified产禾,若存在有滾動(dòng)組件,則鍵盤顯示的情況下可能會(huì)有一部分內(nèi)容被遮擋住牵啦。
以上便是此次分享的全部?jī)?nèi)容亚情,希望能對(duì)大家有所幫助!