初次使用CoordinatorLayout

2018-07-31  本文已影响0人  Wang_Mr
效果
效果.png
布局
<RelativeLayout 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">

    <!--顶部导航栏(永远不滚动)-->
    <include
        android:id="@+id/temp"
        layout="@layout/include_toolbar" />

    <android.support.design.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@id/temp">

        <android.support.design.widget.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="#fff">

            <!--由于滚出屏幕的这一部分比较复杂所以用include进行了引用-->
            <include layout="@layout/include_club_detail_header" />

            <!--悬浮在顶部-->
            <android.support.design.widget.TabLayout
                android:id="@+id/tablayout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="#fff"
                app:tabBackground="@null"
                app:tabIndicatorColor="#ff5006"
                app:tabIndicatorHeight="0dp"
                app:tabMode="fixed"
                android:layout_alignParentBottom="true"
                app:tabSelectedTextColor="@android:color/holo_red_dark"
                app:tabTextAppearance="@style/TabLayoutTextStyle" />

   
        </android.support.design.widget.AppBarLayout>

        <!--如果要实现折叠效果,ViewPager所绑定的frament必须是RecyclerView 或 NestedScrollView-->
        <!--并且需要定义此属性:app:layout_behavior="@string/appbar_scrolling_view_behavior" -->
        <android.support.v4.view.ViewPager
            android:id="@+id/viewpager"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_behavior="@string/appbar_scrolling_view_behavior" />

    </android.support.design.widget.CoordinatorLayout>
    

</RelativeLayout>

include滑出屏幕的那部分布局

include滑出屏幕.png
<!--如果要实现折叠效果,根标签加入了属性-->
<!--app:layout_scrollFlags="scroll|enterAlways"-->
<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="195dp"
    android:orientation="vertical"
    app:layout_scrollFlags="scroll|enterAlways">


    <RelativeLayout   ...>

    <TextView  ... >

    <TextView  ... >

    <include layout="@layout/line_gray_bold" />

</LinearLayout>

嗯,看似不错,貌似实现了想要的效果,虽然是实现了可是当发现ViewPager里的RecyclerView上拉加载时,上拉加载的监听会延迟个1秒,即本来应该监听到到底了,过了大概1秒才走监听到底的方法,后来发现api25和最新的api28没有此问题,而api26和api27都有问题

android {
    compileSdkVersion 28
    buildToolsVersion '27.0.3'
    ......
}

dependencies {
    implementation fileTree(include: ['*.jar'], dir: 'libs')
    implementation 'com.android.support:support-v4:28.0.0-beta01'
    androidTestImplementation('com.android.support.test.espresso:espresso-core:2.2.2', {
        exclude group: 'com.android.support', module: 'support-annotations'
    })
   
    implementation 'com.android.support:design:28.0.0-beta01'
    implementation 'com.android.support:cardview-v7:28.0.0-beta01'
 
}
代码

代码部分没有什么需要特殊实现的
如果Viewpager换成RecyclerView,并且最外层是SwipeRefreshLayout,需要解决冲突

appBarLayout.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() {
    @Override
    public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
      if (verticalOffset >= 0) {
        swipeRefreshLayout.setEnabled(true);
      } else {
        swipeRefreshLayout.setEnabled(false);
      }
    }
});
上一篇下一篇

猜你喜欢

热点阅读