实现一个悬浮在软键盘上的输入栏
前言
我們要實(shí)現(xiàn)一個(gè)懸浮在軟鍵盤(pán)上的輸入欄(即一個(gè)懸浮欄),過(guò)程中遇到了很多問(wèn)題,查閱了一個(gè)網(wǎng)上的文章,結(jié)果發(fā)現(xiàn)不少是錯(cuò)誤的,走了一些彎路,這里就一一記錄一下。
懸浮欄
實(shí)現(xiàn)懸浮欄很簡(jiǎn)單
chatInputPanel.setVisibility(View.VISIBLE); chatInputEt.setFocusable(true); chatInputEt.setFocusableInTouchMode(true); chatInputEt.requestFocus(); InputMethodManager inputManager = (InputMethodManager)chatInputEt.getContext().getSystemService(Context.INPUT_METHOD_SERVICE); inputManager.showSoftInput(chatInputEt, 0);chatInputPanel就是懸浮欄整個(gè)layout,mChatPanelContent才是懸浮欄實(shí)際部分,chatInputEt是其中的EditText,對(duì)它做一些設(shè)置就可以實(shí)現(xiàn)將chatInputPanel懸浮在軟件盤(pán)上。
這里chatInputPanel是全屏的(點(diǎn)擊mChatPanelContent以外部分隱藏鍵盤(pán)),mChatPanelContent是在它的bottom底部,默認(rèn)隱藏(INVISIBLE)。
橫屏?xí)r軟鍵盤(pán)全屏
橫屏?xí)r,安卓默認(rèn)會(huì)將軟鍵盤(pán)全屏顯示,這樣無(wú)法實(shí)現(xiàn)懸浮欄。所以需要取消全屏顯示
在EditText中使用android:imeOptinos可對(duì)Android自帶的軟鍵盤(pán)進(jìn)行一些界面上的設(shè)置
-
android:imeOptions=“flagNoExtractUi” //使軟鍵盤(pán)不全屏顯示,只占用一部分屏幕
-
android:imeOptions=“actionNone” //輸入框右側(cè)不帶任何提示
-
android:imeOptions=“actionGo” //右下角按鍵內(nèi)容為’開(kāi)始’
-
android:imeOptions=“actionSearch” //右下角按鍵為放大鏡圖片,搜索
-
android:imeOptions=“actionSend” //右下角按鍵內(nèi)容為’發(fā)送’
-
android:imeOptions=“actionNext” //右下角按鍵內(nèi)容為’下一步’
-
android:imeOptions=“actionDone” //右下角按鍵內(nèi)容為’完成’
所以我們?yōu)镋ditText設(shè)置android:imeOptions="flagNoExtractUi"即可實(shí)現(xiàn)在橫屏?xí)r不全屏顯示。同時(shí),可能EditText添加相應(yīng)的監(jiān)聽(tīng)器,捕捉用戶(hù)點(diǎn)擊了軟鍵盤(pán)右下角按鈕的監(jiān)聽(tīng)事件,以便進(jìn)行處理。
editText.setOnEditorActionListener(new OnEditorActionListener() { @Override public boolean onEditorAction(TextView v, int actionId, KeyEvent event) { Toast.makeText(MainActivity.this, "text2", Toast.LENGTH_SHORT).show(); return false; } });監(jiān)聽(tīng)軟鍵盤(pán)(該方法不可靠,廢棄,下面有靠譜的)
注意:這是網(wǎng)上的一個(gè)錯(cuò)誤方法,所以特意拿出來(lái)說(shuō)一下,不感興趣直接去看(3)即可。
顯示沒(méi)問(wèn)題了,但是軟鍵盤(pán)隱藏的時(shí)候要求懸浮欄同步隱藏起來(lái)。
系統(tǒng)并沒(méi)有提供監(jiān)聽(tīng)軟鍵盤(pán)收起的api,所以我們只能自己實(shí)現(xiàn)。
chatInputPanel.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {@Overridepublic void onGlobalLayout() {if(chatInputPanel.getBottom() > container.getRootView().getHeight() / 2){chatInputPanel.setVisibility(View.INVISIBLE);}else{chatInputPanel.setVisibility(View.VISIBLE);}} });監(jiān)聽(tīng)chatInputPanel(懸浮欄整體布局)的布局變化,當(dāng)?shù)撞看笥趓ootview高度一半的時(shí)候隱藏,否則顯示。
因?yàn)槲覀兊墓δ苁菣M屏的,所以鍵盤(pán)彈起時(shí),chatInputPanel因?yàn)閼腋≡阪I盤(pán)上,所以底部一定小于rootview高度(屏幕寬度)一半。
當(dāng)收起鍵盤(pán),chatInputPanel會(huì)回到最底部(設(shè)置是在父布局底部),所以底部一定大于一半。
這個(gè)方法不靠譜,而且重繪會(huì)導(dǎo)致onGlobalLayout頻繁的執(zhí)行,雖然可以加上一個(gè)時(shí)間來(lái)控制,但是不推薦使用這個(gè)方式來(lái)監(jiān)聽(tīng)軟鍵盤(pán),下面看看另外一種方式。
靠譜的監(jiān)聽(tīng)軟鍵盤(pán)的方法
上面的方法為什么不考慮,是因?yàn)槿溜@示FLAG_FULLSCREEN(隱藏通知欄)導(dǎo)致問(wèn)題
當(dāng)我們需要全屏顯示隱藏通知欄時(shí),會(huì)使用FLAG_FULLSCREEN屬性
getActivity().getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,WindowManager.LayoutParams.FLAG_FULLSCREEN);但是會(huì)影響上面的懸浮欄,因?yàn)榘l(fā)現(xiàn)chatInputPanel.getBottom()始終沒(méi)變化,但是我們判斷顯示隱藏就靠這個(gè)變化。
沒(méi)變化是因?yàn)閍ndroid在全屏FLAG_FULLSCREEN的處理方式導(dǎo)致的,全屏?xí)r軟鍵盤(pán)會(huì)出現(xiàn)很多問(wèn)題,這個(gè)網(wǎng)上有很多。
如何解決?
我們換一種方式監(jiān)聽(tīng)軟鍵盤(pán)即可
getActivity().getWindow().getDecorView().getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {@Overridepublic void onGlobalLayout() {Rect rect = new Rect();rootView.getWindowVisibleDisplayFrame(rect);int rootHeight=rootView.getRootView().getHeight();int displayHeight=rect.height();int diffHeight=rootHeight-displayHeight;if(diffHeight==0){//鍵盤(pán)收起chatInputPanel.setVisibility(View.INVISIBLE);}else{//鍵盤(pán)彈出chatInputPanel.setVisibility(View.VISIBLE);}} });通過(guò)監(jiān)聽(tīng)根布局種的content布局的變化來(lái)判斷,目前這個(gè)方法是最靠譜的。
但是還存在一個(gè)小問(wèn)題,就是全屏狀態(tài)下鍵盤(pán)會(huì)覆蓋懸浮欄底部的一小部分,這個(gè)怎么辦?
終極懸浮方式
上面解決了軟鍵盤(pán)的監(jiān)聽(tīng)問(wèn)題,但是全屏狀態(tài)下懸浮欄總會(huì)被遮住一部分,那怎么辦?
其實(shí)這里還有一個(gè)問(wèn)題,當(dāng)顯示鍵盤(pán)后,app中的布局整體被向上推起,這樣導(dǎo)致部分組件縮小等情況。
我們要首先解決這個(gè)問(wèn)題,讓app的布局整體保持不動(dòng),鍵盤(pán)覆蓋在其上面,這需要在彈起鍵盤(pán)前手動(dòng)設(shè)置一下,如下:
mChatInput.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {DisplayMetrics metric = new DisplayMetrics();getActivity().getWindowManager().getDefaultDisplay().getMetrics(metric);chatInputPanel.setY(-metric.heightPixels);//解決首次可能向上推的問(wèn)題chatInputEt.setFocusable(true);chatInputEt.setFocusableInTouchMode(true);chatInputEt.requestFocus();InputMethodManager inputManager = (InputMethodManager)chatInputEt.getContext().getSystemService(Context.INPUT_METHOD_SERVICE);inputManager.showSoftInput(chatInputEt, 0);} });這樣將懸浮欄移到了最頂部以上,就不會(huì)出現(xiàn)上推的情況了(猜測(cè)與鍵盤(pán)的機(jī)制有關(guān),因?yàn)殒I盤(pán)彈出如果遮擋了有焦點(diǎn)的輸入組件就好重新調(diào)整窗口,我們將懸浮窗放在最上面,鍵盤(pán)怎么也不會(huì)遮擋到焦點(diǎn)的EditText,所以不會(huì)重新調(diào)整窗口)。
但是這樣懸浮欄就一直看不見(jiàn)了,而且我們可以看到在這里去掉了chatInputPanel.setVisibility(View.VISIBLE);代碼,那么如何顯示?
上面我們提到使用OnGlobalLayoutListener方式監(jiān)聽(tīng)鍵盤(pán),我們就在這里顯示即可,同時(shí)優(yōu)化一下顯示的位置,在這里計(jì)算窗口顯示區(qū)域上移多少,讓chatInputPanel也上移相應(yīng)位置即可,如:
private int mLastHeight = 0; getActivity().getWindow().getDecorView().getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {@Overridepublic void onGlobalLayout() {Rect rect = new Rect();getActivity().getWindow().getDecorView().getWindowVisibleDisplayFrame(rect);int height = rect.height();int rawHeight = getResources().getDisplayMetrics().heightPixels - rect.top;if (height == mLastHeight)return;if (height < rawHeight) {UiThreadHandler.postDelayed(new Runnable() {@Overridepublic void run() {chatInputPanel.setVisibility(View.VISIBLE);chatInputPanel.setTranslationY(-(rawHeight - height));}}, 200);} else {UiThreadHandler.postDelayed(new Runnable() {@Overridepublic void run() {chatInputPanel.setVisibility(View.GONE);}}, 100);}mLastHeight = height; } });可以看到先得到當(dāng)前窗口的顯示高度和屏幕的實(shí)際高度(窗口部分)
然后先判斷窗口顯示區(qū)域是否變化了,如果沒(méi)變化則不處理。
如果有變化,則判斷變大還是變小了。
如果變小了
說(shuō)明鍵盤(pán)彈起,這時(shí)候顯示chatInputPanel,同時(shí)設(shè)置translationY為-(rawHeight - height)
首先chatInputPanel初始位置底部是與屏幕底部對(duì)齊的,雖然設(shè)置了setY,但是setY實(shí)際上就是setTranslationY,初始位置沒(méi)變,源碼:
public void setY(float y) {setTranslationY(y - mTop); }而彈起鍵盤(pán)后想要顯示在鍵盤(pán)以上,那么就需要從最底部向上移動(dòng)一個(gè)鍵盤(pán)的高度,鍵盤(pán)高度就是rawHeight - height,所以向上移動(dòng)是將translationY設(shè)置為-(rawHeight - height)。
如果變大了
說(shuō)明鍵盤(pán)收起,隱藏chatInputPanel即可。
這樣不僅解決了窗口推起的問(wèn)題,也同時(shí)解決了軟鍵盤(pán)遮擋部分懸浮欄的問(wèn)題,因?yàn)閼腋诘奈恢檬峭ㄟ^(guò)計(jì)算得到的,不是通過(guò)軟鍵盤(pán)上推導(dǎo)致布局調(diào)整而改變位置的。
最終代碼
最后想將這個(gè)形成一個(gè)獨(dú)立的組件,直接可用,再編寫(xiě)過(guò)程中發(fā)現(xiàn)出現(xiàn)好多問(wèn)題,解決所有問(wèn)題后發(fā)現(xiàn)與上面的代碼都不一樣,不過(guò)思路是一致的,只不過(guò)細(xì)節(jié)調(diào)整了,比如獲取鍵盤(pán)高度等。完整源碼關(guān)注公眾號(hào):BennuCTech,發(fā)送"FloatInputView"獲取。
總結(jié)
以上是生活随笔為你收集整理的实现一个悬浮在软键盘上的输入栏的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: java中try-catch另外一种用法
- 下一篇: 如何实现不安装xpoedinstall激