直播app源码开发实现Android 直播中弹幕、带货和键盘的交互

转载

泰安云豹科技 2021-05-31 18:19:52

文章标签 直播系统开发直播平台开发 Android开发 文章分类 Android 移动开发

直播app源码开发实现Android 直播中弹幕、带货和键盘的交互

本文主要分享下直播中的弹幕、键盘还有带货卡片的交互效果的实现方式

效果图

实现思路

通过监听键盘的状态以及商品卡片的状态对弹幕区域做 translationY 动画。实现思路就很简单，下面有一些难点

监听键盘状态的实现方法
键盘的高度怎么获取

监听键盘弹出收起

因为Android不能对键盘做监听，网上的方案都是用viewTreeObserver去间接的判断的

view.viewTreeObserver.addOnGlobalLayoutListener {
	// 在这里通过判断屏幕的可见高度，间接的判断弹出和收起
}  
复制代码

为什么可以通过这种方式去实现呢？

这里先看一下 addOnGlobalLayoutListener 在什么时候被回调的

这里需要对 View 的绘制流程有一定的了解，代码在 ViewRootImpl这个类的 2628 行（API 29）

if (triggerGlobalLayoutListener) {
    mAttachInfo.mRecomputeGlobalAttributes = false;
    mAttachInfo.mTreeObserver.dispatchOnGlobalLayout();
}
复制代码

当一个 Activity或者是Dialog 这样的 Window对添加的布局完成测量和布局后就会触发这个回调，从这里可以推断键盘弹出和收起的时候一定触发了 Activity 的重新布局

为什么键盘弹出会触发 Activity 的重新布局

Android提供了 windowSoftInputMode这个属性给开发者去配置键盘的状态以及界面该如何适配键盘

// 当前界面不做改变，键盘直接覆盖在界面上，不会重新布局所以不会触发 GlobalLayoutListener 回调
android:windowSoftInputMode="adjustNothing"

// 改变当前布局的大小来适应键盘，会触发 GlobalLayoutListener 回调，这个配置就非常适合做微信这种 IM 聊天界面
android:windowSoftInputMode="adjustResize"

// 直接把布局向上顶，会触发 GlobalLayoutListener 回调
android:windowSoftInputMode="adjustPan"

// 默认值，界面可以滑动会设置成 adjustResize,反之 adjustPan
android:windowSoftInputMode="adjustUnspecified"
复制代码

键盘弹起会改变界面布局，所以可以通过上述方式去判断键盘是否弹起

如何判断键盘弹起

键盘弹起会改变当前 Window 的可见区域，那么如果当前可见高度小于原始的高度，我们就判断键盘弹起了

可以通过 View 中的方法获取该 View 所在 Window 的可见区域

view.getWindowVisibleDisplayFrame(Rect)
复制代码

那么原始高度和现在高度相减的值就是键盘的高度

RecyclerView 顶部渐变消失效果

直播app源码开发实现Android 直播中弹幕、带货和键盘的交互_Android开发

RecyclerView提供了这个属性可以达到这个效果（做项目的时候不知道有这个属性，难死了????）android:requiresFadingEdge="vertical",不过设置这个属性之后android:overScrollMode="never"就没作用了，所以这里重写了RecyclerView

// android:overScrollMode="never" 样式
edgeEffectFactory = object : EdgeEffectFactory() {
    override fun createEdgeEffect(view: RecyclerView, direction: Int): EdgeEffect {
        return object : EdgeEffect(context) {
            override fun draw(canvas: Canvas): Boolean {
                return false
            }
        }
    }
}
    
复制代码

RecyclerView 设置最大高度

直播中的弹幕一般都是随着弹幕数量的增加高度也会增加，直到一个最大高度，所以在 xml里设置高度打不到这种效果，这里重写 onMeasure方法设置一下 MeasureSpec

override fun onMeasure(widthSpec: Int, heightSpec: Int) {
    // 设置最大高度
    val heightMeasureSpec = MeasureSpec.makeMeasureSpec(maxHeight, MeasureSpec.AT_MOST)
    super.onMeasure(widthSpec, heightMeasureSpec)
}
复制代码

具体实现方案

在直播的 Activity中要设置android:windowSoftInputMode="adjustNothing"，不能让界面布局响应键盘的变化，把监听键盘的工作交给弹幕输入框，输入框用 Dialog实现并且设置全屏，这样就可以在 Dialog中添加 GlobalLayoutListener 去监听键盘的状态了.