话不多说直接上图:
在第一篇的基础上进行了拓展,整体下拉时,顶部图片会有拉伸回弹效果。
核心主要是重写了AppBarLayout使用的layout_behavior,顶部折叠的布局。Activity中只改动了一处,解决整体滑动时不流畅问题,Viewpager嵌套Fragment中展示每个item横向的RecycleView设置为setNestedScrollingEnabled(false);
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout 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"
android:background="@color/black"
android:orientation="vertical">
<com.google.android.material.appbar.AppBarLayout
android:id="@+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#0000"
app:layout_behavior=".feature.mine.widget.AppbarZoomBehavior"
tools:ignore="MissingConstraints">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:contentScrim="@color/black"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<!--顶部折叠布局-->
<com.example.gw.xlp.feature.mine.widget.YYImageWrapRelativeLayout
android:id="@+id/topLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ececec"
android:tag="scrollTag"
app:layout_collapseMode="pin"
app:layout_collapseParallaxMultiplier="0.7">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="300dp"
android:orientation="vertical"
android:padding="12dp"
android:gravity="left|bottom"
android:tag="bottomLayoutTag">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="阿伟哈皮"
android:textColor="@color/white"
android:textSize="@dimen/sp_18"
android:textStyle="bold"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="bottom">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1关注"
android:textSize="@dimen/sp_14"
android:textColor="@color/white"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1被关注"
android:layout_marginStart="@dimen/dp_10"
android:textSize="@dimen/sp_14"
android:textColor="@color/white"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_marginStart="@dimen/dp_10">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="+2"
android:layout_marginStart="@dimen/dp_20"
android:textColor="@color/red"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="6人气"
android:textSize="@dimen/sp_14"
android:textColor="@color/white"/>
</LinearLayout>
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="21/170/60"
android:textSize="@dimen/sp_14"
android:textColor="@color/light_gray"
android:layout_marginTop="@dimen/dp_10"
android:drawablePadding="@dimen/dp_10"
android:drawableLeft="@mipmap/icon_white_user"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="北京"
android:textSize="@dimen/sp_14"
android:textColor="@color/light_gray"
android:layout_marginTop="@dimen/dp_10"
android:drawablePadding="@dimen/dp_10"
android:drawableLeft="@mipmap/icon_white_location"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="你还没有填写个人介绍,点击添加"
android:textSize="@dimen/sp_14"
android:textColor="@color/light_gray"
android:layout_marginTop="@dimen/dp_10"
android:drawablePadding="@dimen/dp_10" />
</LinearLayout>
</com.example.gw.xlp.feature.mine.widget.YYImageWrapRelativeLayout>
<androidx.appcompat.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="@dimen/dp_40"
app:layout_collapseMode="pin">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginRight="@dimen/dp_30"
android:gravity="right">
<ImageView
android:id="@+id/img_right"
android:layout_width="@dimen/dp_24"
android:layout_height="@dimen/dp_32"
android:layout_gravity="right"
android:src="@mipmap/icon_list_setting" />
</LinearLayout>
</androidx.appcompat.widget.Toolbar>
</com.google.android.material.appbar.CollapsingToolbarLayout>
<com.flyco.tablayout.CommonTabLayout
android:id="@+id/tablayout"
android:layout_width="match_parent"
android:layout_height="@dimen/dp_40"
android:tag="tabTag"
app:tl_iconVisible="false"
app:tl_textBold="SELECT"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:tl_indicator_width="@dimen/dp_70"
app:tl_indicator_color="@color/white"
app:tl_indicator_height="@dimen/dp_2"
app:tl_textsize="@dimen/sp_16"
app:tl_textSelectColor="@color/white"
app:tl_textUnselectColor="@color/white">
</com.flyco.tablayout.CommonTabLayout>
</com.google.android.material.appbar.AppBarLayout>
<androidx.viewpager.widget.ViewPager
android:id="@+id/vp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
</androidx.viewpager.widget.ViewPager>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
在此很感谢博主迷人的羊驼的支持。重写的布局在他资源可下载,一定要注意布局中tag的设置。
大家喜欢的话可以点赞哦~~~
|