短视频商城源码详情页嵌套滑动效果实现

短视频商城源码详情页嵌套滑动效果实现的相关代码
对于BottomSheetBehavior后续会和Behavior单独写文章说明下使用和自定义相关的。

<?xml version="1.0" encoding="utf-8"?>
<org.fireking.laboratory.qingtingfm.detail_ios.widget.BottomSheetRootFrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="org.fireking.laboratory.qingtingfm.detail_ios.QtDetailsIosActivity">

<androidx.appcompat.widget.LinearLayoutCompat
android:id="@+id/flAudioInfo"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/sp_audio_bg"
android:orientation="vertical">

<View
android:id="@+id/vStatusBar"
android:layout_width="match_parent"
android:layout_height="25dp" />

<org.fireking.laboratory.qingtingfm.detail_ios.widget.QtFmAppbar
android:id="@+id/fmAppbar"
android:layout_width="match_parent"
android:layout_height="44dp" />

<org.fireking.laboratory.qingtingfm.detail_ios.widget.QtFmContent
android:id="@+id/qtFmContent"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</androidx.appcompat.widget.LinearLayoutCompat>

<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:visibility="gone">

<androidx.appcompat.widget.LinearLayoutCompat
android:id="@+id/bottomSheetLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/sp_round_12"
android:orientation="vertical"
app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior">

<net.lucode.hackware.magicindicator.MagicIndicator
android:id="@+id/magicIndicator"
android:layout_width="match_parent"
android:layout_height="50dp" />

<View
android:layout_width="match_parent"
android:layout_height="0.7dp"
android:background="#EEEEEE" />

<androidx.viewpager.widget.ViewPager
android:id="@+id/vPager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:nestedScrollingEnabled="false" />
</androidx.appcompat.widget.LinearLayoutCompat>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</org.fireking.laboratory.qingtingfm.detail_ios.widget.BottomSheetRootFrameLayout>

 

BottomSheetRootFrameLayout 中主要做的事情就是用来计算BottomSheetBehavior默认展开状态下最大应该展示多少距离，这个距离是不能写死的，因为需要根据请求到的内容来动态计算，所以这里重写了onMeasure，来根据内容变化动态计算出来一个实际的高度并设置给BottomSheetBehavior的peekHeight方法。

override fun onMeasure(widthMeasureSpec: Int, heightMeasureSpec: Int) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec)
bottomSheetLayout?.also {
val newBottomSheetHeight =
(measuredHeight - dip2px(44F) - StatusBarUtil.getStatusBarHeight(context)).toInt()
if (bottomSheetHeight != newBottomSheetHeight) {
it.layoutParams.height = newBottomSheetHeight
bottomSheetHeight = newBottomSheetHeight
}
val newPeekHeight =
(measuredHeight - qtFmContent!!.measuredHeight - dip2px(44F) - StatusBarUtil.getStatusBarHeight(
context
)).toInt()
if (currentPeekHeight != newPeekHeight && !isFinal) {
val mBottomSheetBehavior = BottomSheetBehavior.from(it)
mBottomSheetBehavior.peekHeight = newPeekHeight
currentPeekHeight = newPeekHeight
//设置高度后，进行二次计算，确保布局同步
super.onMeasure(widthMeasureSpec, heightMeasureSpec)
isFinal = true
}
}
}

 

完成上面的计算设置之后，你会发现BottomSheetBehavior在没有填充SmartRefreshLayout和RecyclerView的情况下，可以正常使用了，且基本满足折叠需求，而且折叠展示的高度都是满足实际需求的。
标题栏的展示隐藏控制，可以直接使用`BottomSheetBehavior#onStateChanged进行处理

val bottomSheetBehavior = BottomSheetBehavior.from(bottomSheetLayout)
bottomSheetBehavior.setBottomSheetCallback(object :
BottomSheetBehavior.BottomSheetCallback() {
override fun onStateChanged(bottomSheet: View, newState: Int) {
if (newState == BottomSheetBehavior.STATE_EXPANDED) {
fmAppbar.showTitle()
} else if (newState == BottomSheetBehavior.STATE_COLLAPSED) {
fmAppbar.hideTitle()
}
}

override fun onSlide(bottomSheet: View, slideOffset: Float) {

}
})

 

 
以上就是 短视频商城源码详情页嵌套滑动效果实现的相关代码，更多内容欢迎关注之后的文章