美文网首页
初次使用CoordinatorLayout

初次使用CoordinatorLayout

作者: Wang_Mr | 来源:发表于2018-07-31 17:18 被阅读0次
    效果
    效果.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);
          }
        }
    });
    

    相关文章

      网友评论

          本文标题:初次使用CoordinatorLayout

          本文链接:https://www.haomeiwen.com/subject/msphvftx.html