前言

我们要实现一个悬浮在软键盘上的输入栏(即一个悬浮栏),过程中遇到了很多问题,查阅了一些网上的文章,结果发现不少是错误的,走了一些弯路,这里就一一记录一下。

悬浮栏

实现悬浮栏很简单

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就是悬浮栏整个layout,mChatPanelContent才是悬浮栏实际部分,chatInputEt是其中的EditText,对它做一些设置就可以实现将chatInputPanel悬浮在软件盘上。

这里chatInputPanel是全屏的(点击mChatPanelContent以外部分隐藏键盘),mChatPanelContent是在它的bottom底部,默认隐藏(INVISIBLE)。

横屏时软键盘全屏

横屏时,安卓默认会将软键盘全屏显示,这样无法实现悬浮栏。所以需要取消全屏显示

在EditText中使用android:imeOptinos可对Android自带的软键盘进行一些界面上的设置

  • android:imeOptions="flagNoExtractUi" //使软键盘不全屏显示,只占用一部分屏幕

  • android:imeOptions="actionNone" //输入框右侧不带任何提示

  • android:imeOptions="actionGo" //右下角按键内容为'开始'

  • android:imeOptions="actionSearch" //右下角按键为放大镜图片,搜索

  • android:imeOptions="actionSend" //右下角按键内容为'发送'

  • android:imeOptions="actionNext" //右下角按键内容为'下一步'

  • android:imeOptions="actionDone" //右下角按键内容为'完成'

所以我们为EditText设置android:imeOptions="flagNoExtractUi"即可实现在横屏时不全屏显示。同时,可能EditText添加相应的监听器,捕捉用户点击了软键盘右下角按钮的监听事件,以便进行处理。

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;   
        }   
    });  

监听软键盘(该方法不可靠,废弃,下面有靠谱的)

注意:这是网上的一个错误方法,所以特意拿出来说一下,不感兴趣直接去看(3)即可。

显示没问题了,但是软键盘隐藏的时候要求悬浮栏同步隐藏起来。

系统并没有提供监听软键盘收起的api,所以我们只能自己实现。

chatInputPanel.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
    @Override
    public void onGlobalLayout() {
        if(chatInputPanel.getBottom() > container.getRootView().getHeight() / 2){
            chatInputPanel.setVisibility(View.INVISIBLE);
        }
        else{
            chatInputPanel.setVisibility(View.VISIBLE);
        }
    }
});

监听chatInputPanel(悬浮栏整体布局)的布局变化,当底部大于rootview高度一半的时候隐藏,否则显示。

因为我们的功能是横屏的,所以键盘弹起时,chatInputPanel因为悬浮在键盘上,所以底部一定小于rootview高度(屏幕宽度)一半。

当收起键盘,chatInputPanel会回到最底部(设置是在父布局底部),所以底部一定大于一半。

这个方法不靠谱,而且重绘会导致onGlobalLayout频繁的执行,虽然可以加上一个时间来控制,但是不推荐使用这个方式来监听软键盘,下面看看另外一种方式。

靠谱的监听软键盘的方法

上面的方法为什么不考虑,是因为全屏显示FLAG_FULLSCREEN(隐藏通知栏)导致问题

当我们需要全屏显示隐藏通知栏时,会使用FLAG_FULLSCREEN属性

getActivity().getWindow().setFlags(
        WindowManager.LayoutParams.FLAG_FULLSCREEN,
        WindowManager.LayoutParams.FLAG_FULLSCREEN);

但是会影响上面的悬浮栏,因为发现chatInputPanel.getBottom()始终没变化,但是我们判断显示隐藏就靠这个变化。

没变化是因为android在全屏FLAG_FULLSCREEN的处理方式导致的,全屏时软键盘会出现很多问题,这个网上有很多。

如何解决?

我们换一种方式监听软键盘即可

getActivity().getWindow().getDecorView().getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
    @Override
    public 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){
            //键盘收起
            chatInputPanel.setVisibility(View.INVISIBLE);
        }else{
            //键盘弹出
            chatInputPanel.setVisibility(View.VISIBLE);
        }
    }
});

通过监听根布局种的content布局的变化来判断,目前这个方法是最靠谱的。

但是还存在一个小问题,就是全屏状态下键盘会覆盖悬浮栏底部的一小部分,这个怎么办?

终极悬浮方式

上面解决了软键盘的监听问题,但是全屏状态下悬浮栏总会被遮住一部分,那怎么办?

其实这里还有一个问题,当显示键盘后,app中的布局整体被向上推起,这样导致部分组件缩小等情况。

我们要首先解决这个问题,让app的布局整体保持不动,键盘覆盖在其上面,这需要在弹起键盘前手动设置一下,如下:

mChatInput.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        DisplayMetrics metric = new DisplayMetrics();
        getActivity().getWindowManager().getDefaultDisplay().getMetrics(metric);
        chatInputPanel.setY(-metric.heightPixels);//解决首次可能向上推的问题
        
        chatInputEt.setFocusable(true);
        chatInputEt.setFocusableInTouchMode(true);
        chatInputEt.requestFocus();
        InputMethodManager inputManager = (InputMethodManager)chatInputEt.getContext().getSystemService(Context.INPUT_METHOD_SERVICE);
        inputManager.showSoftInput(chatInputEt, 0);
    }
});

这样将悬浮栏移到了最顶部以上,就不会出现上推的情况了(猜测与键盘的机制有关,因为键盘弹出如果遮挡了有焦点的输入组件就好重新调整窗口,我们将悬浮窗放在最上面,键盘怎么也不会遮挡到焦点的EditText,所以不会重新调整窗口)。

但是这样悬浮栏就一直看不见了,而且我们可以看到在这里去掉了chatInputPanel.setVisibility(View.VISIBLE);代码,那么如何显示?

上面我们提到使用OnGlobalLayoutListener方式监听键盘,我们就在这里显示即可,同时优化一下显示的位置,在这里计算窗口显示区域上移多少,让chatInputPanel也上移相应位置即可,如:

private int mLastHeight = 0;
getActivity().getWindow().getDecorView().getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
    @Override
    public 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() {
                @Override
                public void run() {
                    chatInputPanel.setVisibility(View.VISIBLE);
                    chatInputPanel.setTranslationY(-(rawHeight - height));
                }
            }, 200);
        } else {
            UiThreadHandler.postDelayed(new Runnable() {
                @Override
                public void run() {
                    chatInputPanel.setVisibility(View.GONE);
                }
            }, 100);
        }
                
        mLastHeight = height;    
    }
});

可以看到先得到当前窗口的显示高度和屏幕的实际高度(窗口部分)

然后先判断窗口显示区域是否变化了,如果没变化则不处理。

如果有变化,则判断变大还是变小了。

如果变小了

说明键盘弹起,这时候显示chatInputPanel,同时设置translationY为-(rawHeight - height)

首先chatInputPanel初始位置底部是与屏幕底部对齐的,虽然设置了setY,但是setY实际上就是setTranslationY,初始位置没变,源码:

public void setY(float y) {
    setTranslationY(y - mTop);
}

而弹起键盘后想要显示在键盘以上,那么就需要从最底部向上移动一个键盘的高度,键盘高度就是rawHeight - height,所以向上移动是将translationY设置为-(rawHeight - height)。

如果变大了

说明键盘收起,隐藏chatInputPanel即可。

这样不仅解决了窗口推起的问题,也同时解决了软键盘遮挡部分悬浮栏的问题,因为悬浮栏的位置是通过计算得到的,不是通过软键盘上推导致布局调整而改变位置的。

最终代码

最后想将这个形成一个独立的组件,直接可用,再编写过程中发现出现好多问题,解决所有问题后发现与上面的代码都不一样,不过思路是一致的,只不过细节调整了,比如获取键盘高度等。

总结

到此这篇关于使用Android实现一个悬浮在软键盘上的输入栏的文章就介绍到这了,更多相关Android实现悬浮输入栏内容请搜索Devmax以前的文章或继续浏览下面的相关文章希望大家以后多多支持Devmax!

使用Android实现一个悬浮在软键盘上的输入栏的更多相关文章

  1. 详解通过focusout事件解决IOS键盘收起时界面不归位的问题

    这篇文章主要介绍了详解通过focusout事件解决IOS键盘收起时界面不归位的问题,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

  2. HTML5去掉输入框type为number时的上下箭头的实现方法

    这篇文章主要介绍了HTML5去掉输入框type为number时的上下箭头的实现方法,需要的朋友可以参考下

  3. html5 canvas合成海报所遇问题及解决方案总结

    这篇文章主要介绍了html5 canvas合成海报所遇问题及解决方案总结,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  4. Html5 video标签视频的最佳实践

    这篇文章主要介绍了Html5 video标签视频的最佳实践,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

  5. HTML5中input输入框默认提示文字向左向右移动的示例代码

    这篇文章主要介绍了HTML5中input输入框默认提示文字向左向右移动,本文通过实例代码给大家介绍的非常详细对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  6. 详解移动端HTML5页面端去掉input输入框的白色背景和边框(兼容Android和ios)

    本篇文章主要介绍了移动端HTML5页面端去掉input输入框的白色背景和边框,非常具有实用价值,需要的朋友可以参考下。

  7. HTML5在微信内置浏览器下右上角菜单的调整字体导致页面显示错乱的问题

    HTML5在微信内置浏览器下,在右上角菜单的调整字体导致页面显示错乱的问题,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧

  8. ios – containerURLForSecurityApplicationGroupIdentifier:在iPhone和Watch模拟器上给出不同的结果

    我使用默认的XCode模板创建了一个WatchKit应用程序.我向iOSTarget,WatchkitAppTarget和WatchkitAppExtensionTarget添加了应用程序组权利.(这是应用程序组名称:group.com.lombax.fiveminutes)然后,我尝试使用iOSApp和WatchKitExtension访问共享文件夹URL:延期:iOS应用:但是,测试NSURL

  9. Ionic – Splash Screen适用于iOS,但不适用于Android

    我有一个离子应用程序,其中使用CLI命令离子资源生成的启动画面和图标iOS版本与正在渲染的启动画面完美配合,但在Android版本中,只有在加载应用程序时才会显示白屏.我检查了config.xml文件,所有路径看起来都是正确的,生成的图像出现在相应的文件夹中.(我使用了splash.psd模板来生成它们.我错过了什么?这是config.xml文件供参考,我觉得我在这里做错了–解决方法在config.xml中添加以下键:它对我有用!

  10. ios – 无法启动iPhone模拟器

    /Library/Developer/CoreSimulator/Devices/530A44CB-5978-4926-9E91-E9DBD5BFB105/data/Containers/Bundle/Application/07612A5C-659D-4C04-ACD3-D211D2830E17/ProductName.app/ProductName然后,如果您在Xcode构建设置中选择标准体系结构并再次构建和运行,则会产生以下结果:dyld:lazysymbolbindingFailed:Symbol

随机推荐

  1. Flutter 网络请求框架封装详解

    这篇文章主要介绍了Flutter 网络请求框架封装详解,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  2. Android单选按钮RadioButton的使用详解

    今天小编就为大家分享一篇关于Android单选按钮RadioButton的使用详解,小编觉得内容挺不错的,现在分享给大家,具有很好的参考价值,需要的朋友一起跟随小编来看看吧

  3. 解决android studio 打包发现generate signed apk 消失不见问题

    这篇文章主要介绍了解决android studio 打包发现generate signed apk 消失不见问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

  4. Android 实现自定义圆形listview功能的实例代码

    这篇文章主要介绍了Android 实现自定义圆形listview功能的实例代码,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  5. 详解Android studio 动态fragment的用法

    这篇文章主要介绍了Android studio 动态fragment的用法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  6. Android用RecyclerView实现图标拖拽排序以及增删管理

    这篇文章主要介绍了Android用RecyclerView实现图标拖拽排序以及增删管理的方法,帮助大家更好的理解和学习使用Android,感兴趣的朋友可以了解下

  7. Android notifyDataSetChanged() 动态更新ListView案例详解

    这篇文章主要介绍了Android notifyDataSetChanged() 动态更新ListView案例详解,本篇文章通过简要的案例,讲解了该项技术的了解与使用,以下就是详细内容,需要的朋友可以参考下

  8. Android自定义View实现弹幕效果

    这篇文章主要为大家详细介绍了Android自定义View实现弹幕效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  9. Android自定义View实现跟随手指移动

    这篇文章主要为大家详细介绍了Android自定义View实现跟随手指移动,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  10. Android实现多点触摸操作

    这篇文章主要介绍了Android实现多点触摸操作,实现图片的放大、缩小和旋转等处理,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

返回
顶部