android 聊天界面键盘、表情切换丝滑

1、我们在聊天页面时候,往往会遇到,键盘、表情、其他选择切换时候页面会出现掉下来再弹起问题,这是因为,我们切换时候,键盘异步导致内容View高度变化,页面掉下来后,又被其他内容顶起这种很差视觉效果。

要解决这个问题,最简单方法就是切换时候,将内容View高度固定然后去操作键盘显示后再去释放内容View高度。

2、这里我们提供具体思路

2.1xml布局:(FrameLayout + RecyclerView,是为了让键盘弹起时候,RecyclerView有个向上平移效果)

复制代码
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <!--  标题View -->
    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="?actionBarSize">



    </androidx.constraintlayout.widget.ConstraintLayout>


    <!--  聊天展示View   android:layout_weight="1" 让聊天内容填充剩下内容-->
    <com.scwang.smart.refresh.layout.SmartRefreshLayout
        android:id="@+id/smartRefreshLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        app:srlEnableLoadMore="false"
        app:srlEnableRefresh="true">

 <!--  添加FrameLayout 是为了让键盘弹起时候,聊天内容(RecyclerView)平移上去效果-->
        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <androidx.recyclerview.widget.RecyclerView
                android:id="@+id/recyler"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_gravity="bottom"
                android:overScrollMode="never"
                android:scrollbars="none"
                android:visibility="invisible" />

        </FrameLayout>


    </com.scwang.smart.refresh.layout.SmartRefreshLayout>

    <!-- 按钮:发送、输入框等View -->
    <LinearLayout
        android:id="@+id/button_input"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">


    </LinearLayout>

    <!-- 图片选择、语音、视频等View -->
    <androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/other_select"
        android:layout_width="match_parent"
        android:layout_height="@dimen/common_dp_114"
        android:visibility="gone">



    </androidx.constraintlayout.widget.ConstraintLayout>

    <!-- emotion 表情选择View  这个是自定义View-->
    <EmotionView
        android:id="@+id/emotion"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:visibility="gone" />

</LinearLayout>

2.2:当键盘需要弹起锁内容View高度(这里重点讲解参数:height,height = smartRefreshLayoutMaxHeight(聊天内容最大高度) - supportSoftInputHeight(键盘的高度),这样做的目前就是让键盘弹起时候,页面感觉聊天内容View平移上效果)

复制代码
 private void viewLockHeight(int height) {
        LinearLayout.LayoutParams layoutParams = (LinearLayout.LayoutParams) smartRefreshLayout.getLayoutParams();
        layoutParams.height = height == 0 ? smartRefreshLayout.getHeight() : height;
        layoutParams.weight = 0.0F;
        smartRefreshLayout.setLayoutParams(layoutParams);
    }

2.3:延迟释放高度(设置 layoutParams.weight = 1.0F)

复制代码
 private void viewReleaseLockHeight(int delayMillis) {
        if (smartRefreshLayout != null) {
            smartRefreshLayout.postDelayed(new Runnable() {
                @Override
                public void run() {
                    if (smartRefreshLayout != null) {
                        LinearLayout.LayoutParams layoutParams = (LinearLayout.LayoutParams) smartRefreshLayout.getLayoutParams();
                        layoutParams.height = LinearLayout.LayoutParams.MATCH_PARENT;
                        layoutParams.weight = 1.0F;
                        smartRefreshLayout.setLayoutParams(layoutParams);
                    }
                }
            }, delayMillis == 0 ? 200L : delayMillis);
        }
    }

2.4:RecyclerView展示最后一条数据(切换、键盘、表情等)

复制代码
  public void recyclerStopScroll() {
        recyclerView.stopScroll();
        layoutManager.scrollToPositionWithOffset(0, 0);
    }

3:切换流程

界面正常展示(此时聊天内容界面最大高度展示)--->弹起键盘

①、RecyclerView停止所有事件recyclerStopScrol()

②、内容View锁高 viewLockHeight(contentViewMaxHeight)

③、起键盘

④、延迟释放高度viewReleaseLockHeight()

弹起键盘------>表情

①、RecyclerView停止所有事件recyclerStopScrol()

②、内容View锁高 viewLockHeight(0)

③、收键盘

④、展示表情

⑤、延迟释放高度viewReleaseLockHeight()

表情------>弹起键盘

①、RecyclerView停止所有事件recyclerStopScrol()

②、内容View锁高 viewLockHeight(0)

③、弹起键盘

④、收起表情

⑤、延迟释放高度viewReleaseLockHeight()

相关推荐
PuddingSama1 小时前
Android 高级绘制技巧: BlendMode
android·前端·面试
2501_915921431 小时前
iOS App 性能监控与优化实战 如何监控CPU、GPU、内存、帧率、耗电情况并提升用户体验(uni-app iOS开发调试必备指南)
android·ios·小程序·uni-app·iphone·webview·ux
Digitally2 小时前
如何将视频从安卓手机传输到电脑?
android·智能手机·电脑
CV资深专家2 小时前
Android 相机框架的跨进程通信架构
android
前行的小黑炭2 小时前
Android :如何提升代码的扩展性,方便复制到其他项目不会粘合太多逻辑,增强你的实战经验。
android·java·kotlin
2501_915921432 小时前
前端开发工具有哪些?常用前端开发工具、前端调试工具、前端构建工具与效率提升工具对比与最佳实践
android·前端·ios·小程序·uni-app·iphone·webview
花菜会噎住3 小时前
MySQL 高级特性与性能优化:深入理解函数、视图、存储过程、触发器
android·mysql·函数·索引·视图
娅娅梨8 小时前
Android- Surface, SurfaceView, TextureView, SurfaceTexture 原理图解
android·surface
2501_9159184110 小时前
HTTPS 端口号详解 443 端口作用、iOS 抓包方法、常见 HTTPS 抓包工具与网络调试实践
android·网络·ios·小程序·https·uni-app·iphone
程序员码歌10 小时前
明年35岁了,如何破局?说说心里话
android·前端·后端