其他分享
首页 > 其他分享> > Android——可折叠式的标题栏

Android——可折叠式的标题栏

作者:互联网

可折叠式的标题栏

效果图:

实现步骤:

第一步:依赖包:

implementation 'com.android.support:design:28.0.0'

第二步:定义 activity_main.xml文件 内容如下:

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.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.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        >

        <android.support.design.widget.CollapsingToolbarLayout
            android:layout_width="match_parent"
            android:layout_height="200dp"
            app:contentScrim="?attr/colorPrimary"
            android:background="@mipmap/ic_launcher"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">



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


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

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/my_head"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_anchor="@id/appbar"
        app:layout_anchorGravity="bottom|center"
        app:elevation="6dp"
        android:clickable="true"
        app:borderWidth="0dp"
        android:backgroundTint="#FFEB3B"
        app:rippleColor="#832B2B2B"
        android:layout_marginBottom="20dp"
        android:layout_marginRight="20dp"
        app:pressedTranslationZ="12dp"
        />

    <android.support.v4.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        >


        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            >

            <TextView
                android:layout_width="match_parent"
                android:layout_height="200dp"
                android:background="#2196F3"
                android:textColor="#FFFFFF"
                android:textSize="28sp"
                android:gravity="center"
                android:layout_marginBottom="10dp"
                />

            <TextView
                android:layout_width="match_parent"
                android:layout_height="200dp"
                android:background="#2196F3"
                android:textColor="#FFFFFF"
                android:textSize="28sp"
                android:gravity="center"
                android:layout_marginBottom="10dp"
                />

            <TextView
                android:layout_width="match_parent"
                android:layout_height="200dp"
                android:background="#2196F3"
                android:textColor="#FFFFFF"
                android:textSize="28sp"
                android:gravity="center"
                android:layout_marginBottom="10dp"
                />

        </LinearLayout>


    </android.support.v4.widget.NestedScrollView>

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

 

结论:

CollapsingToolbarLayout 是不能独立存在的,它必须只能作为AppBarLayout 的子布局来使用,这里先调整AppbarLayout 的告诉来适应图片。

标签:xml,AppBarLayout,标题栏,design,折叠式,Android
来源: https://blog.csdn.net/qq_39799899/article/details/98884480