钉钉新建任务页面文字/语音切换按钮位于软键盘之上的实现思路

2019-01-04  本文已影响0人  _fanqh

1、项目中要实现一个发布定时任务的功能,页面效果类似于钉钉新建任务页面,现将基本实现思路及部分核心代码记录于此,先看下钉钉的实现效果,上图:


钉钉-新建任务.gif

此页面主要交互难点就在键盘弹出,文字与语音切换按钮位于软键盘之上。


part1.png part2.png
先说说我的实现思路

1、软键盘弹出/隐藏监听

etText.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
            //当键盘弹出或隐藏的时候会 调用此方法。
            @Override
            public void onGlobalLayout() {

                Rect r = new Rect();
                //获取当前界面可视部分
                NewTaskActivity.this.getWindow().getDecorView().getWindowVisibleDisplayFrame(r);

                //获取屏幕的高度
                int screenHeight = NewTaskActivity.this.getWindow().getDecorView().getRootView().getHeight();

                //此处就是用来获取键盘的高度的, 在键盘没有弹出的时候 此高度为0 键盘弹出的时候为一个正数
                int heightDifference = screenHeight - r.bottom;

                //因为该监听回调特别频繁,加此判断,防止频繁执行重复操作
                if (heightDiff != heightDifference) {
                    heightDiff = heightDifference;

                    //此处可判断软键盘是否弹出,navigationBarHeight是手机导航栏的高度,
                    //">"后面的值一般大于导航栏高度就可以,不过稍微定义的再大多一点点。
                    isKeyboardShow = heightDifference > navigationBarHeight * 2;

                   //设置part2.png中那块区域的布局参数,其高度为软键盘的高度,
                  //此处要判断屏幕底部导航栏是否显示,显示的话要减去导航栏的高度
                    if (isKeyboardShow) {
                        ViewGroup.LayoutParams layoutParams = part2.getLayoutParams();
                        layoutParams.width = ViewGroup.LayoutParams.MATCH_PARENT;
                        if (isNavigationBarShow) { //导航栏是否显示
                            layoutParams.height = heightDifference - navigationBarHeight;
                        } else {
                            layoutParams.height = heightDifference;
                        }
                        part2.setLayoutParams(layoutParams);
                    }
                  //设置part1.png中那块区域是否显示
                    if (isKeyboardShow) {
                        //显示part1区域
                        part1.setVisibility(View.VISIBLE);
                    } else {
                        //文字模式下,软键盘隐藏,则part1区域隐藏
                        if (!isWordMode) {
                           part1.setVisibility(View.GONE);
                        }
                    }
                }
            }
        });
上一篇 下一篇

猜你喜欢

热点阅读