IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> 移动开发 -> CoordinatorLayout+AppBarLayout+CollapsingToolbarLayout+ImmersionBar实现吸顶悬浮,状态栏沉浸式,顶部图片拉伸效果(二) -> 正文阅读

[移动开发]CoordinatorLayout+AppBarLayout+CollapsingToolbarLayout+ImmersionBar实现吸顶悬浮,状态栏沉浸式,顶部图片拉伸效果(二)

话不多说直接上图:
在这里插入图片描述

第一篇的基础上进行了拓展,整体下拉时,顶部图片会有拉伸回弹效果。

核心主要是重写了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的设置。

大家喜欢的话可以点赞哦~~~

  移动开发 最新文章
Vue3装载axios和element-ui
android adb cmd
【xcode】Xcode常用快捷键与技巧
Android开发中的线程池使用
Java 和 Android 的 Base64
Android 测试文字编码格式
微信小程序支付
安卓权限记录
知乎之自动养号
【Android Jetpack】DataStore
上一篇文章      下一篇文章      查看所有文章
加:2021-07-17 12:03:47  更:2021-07-17 12:04:35 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年5日历 -2024/5/20 13:00:35-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码