BottomSheetBehavior+CoordinatorLayout實(shí)現(xiàn)抖音評(píng)論列表滑動(dòng)效果

效果圖


bottomsheet.gif

最近項(xiàng)目有這個(gè)需求, 自己能想出的最簡單直接的實(shí)現(xiàn)辦法, 稍稍改動(dòng)也能支持ListView的情況.

效果說明


  1. 支持列表滑動(dòng)
  2. 只有當(dāng)列表滑動(dòng)到頂端時(shí), 繼續(xù)下滑, 才會(huì)收起整個(gè)評(píng)論列表. 否則只是評(píng)論列表滑動(dòng).
  3. 如果設(shè)置了評(píng)論列表的標(biāo)題, 可以通過拖動(dòng)標(biāo)題直接收起整個(gè)評(píng)論列表, 這時(shí)不再考慮評(píng)論列表是否滑動(dòng)到頂部.

實(shí)現(xiàn)說明


所有的都在這個(gè)xml布局文件中

<androidx.coordinatorlayout.widget.CoordinatorLayout 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">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <Button
            android:id="@+id/startBtn"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="40dp"
            android:text="評(píng)論列表" />
        
    </RelativeLayout>


    <LinearLayout
        android:id="@+id/bottom_sheet"
        android:layout_width="match_parent"
        android:layout_height="348dp"
        android:orientation="vertical"
        app:behavior_hideable="true"
        app:behavior_peekHeight="0dp"
        app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior">

        <TextView
            android:id="@+id/list_title_tv"
            android:layout_width="match_parent"
            android:layout_height="48dp"
            android:background="#3300ff00"
            android:gravity="center"
            android:text="這個(gè)是標(biāo)題,可以拖住滑動(dòng)" />

        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/recyclerView"
            android:layout_width="match_parent"
            android:layout_height="300dp">

        </androidx.recyclerview.widget.RecyclerView>

    </LinearLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>


完整代碼:

https://github.com/shaopx/BottomSheetBehaviorExample

這是示例使用了androidx, 當(dāng)然如果你不想升級(jí)到androidx, 也完全可以使用support庫中的控件, 一樣的效果. 可以查看這個(gè)示例:https://github.com/shaopx/CoordinatorLayoutExample

如果你看了這篇文章, 我猜想你可能對(duì)抖音的視頻上下頁切換播放也趕興趣, 那么請(qǐng)也看看我的這個(gè)小demo
https://github.com/shaopx/MyDouYin
使用exoplayer實(shí)現(xiàn)的播放, 預(yù)加載, 很流暢

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

友情鏈接更多精彩內(nèi)容