时间戳

首页 > 解决方案 > 增加滚动时折叠工具栏布局的大小

android - 增加滚动时折叠工具栏布局的大小

问题描述

我正在尝试实现一种效果，其中图像视图在collapsingToolbarLayout开始时位于250dp并且向上滚动时图像视图变为400dp. 这是要求的示例：

动画

在开始片段看起来像：在此处输入图像描述

在向上滚动片段看起来像：在此处输入图像描述

我现在正在使用以下代码，但只能将视图折叠到工具栏中，不能扩展大小：

<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:fitsSystemWindows="true"
    android:layout_width="match_parent"
    android:layout_height="match_parent">


    <com.google.android.material.appbar.AppBarLayout
        android:id="@+id/htab_appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="?attr/colorPrimary"
        android:fitsSystemWindows="true"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <com.google.android.material.appbar.CollapsingToolbarLayout
            android:id="@+id/htab_collapse_toolbar"
            android:layout_width="match_parent"
            android:layout_height="256dp"
            android:fitsSystemWindows="true"
            app:contentScrim="?attr/colorPrimary"
            app:layout_scrollFlags="scroll|exitUntilCollapsed|snap"
            app:titleEnabled="false">

            <ImageView
                android:id="@+id/profile_avatar"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:src="@drawable/placeholder_user"
                android:fitsSystemWindows="true"
                android:scaleType="centerCrop"
                app:layout_collapseMode="parallax"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent" />

            <View
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:alpha="0.3"
                android:background="@android:color/black"
                android:fitsSystemWindows="true"/>

            <androidx.appcompat.widget.Toolbar
                android:id="@+id/htab_toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:layout_gravity="top"
                android:layout_marginBottom="48dp"
                app:layout_collapseMode="pin"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>

标签： androidparallaxandroid-collapsingtoolbarlayout

解决方案

在中使用了以下代码onCreate()：

val wm = context!!.getSystemService(Context.WINDOW_SERVICE) as WindowManager

        dWidth = wm.defaultDisplay

        layout = inflater.inflate(R.layout.fragment_profile_main_expanded, container, false)


        layout.appbar.post(Runnable {

            val heightPx: Int = dWidth.width * 1 / 3

            setAppBarOffset(heightPx)

        })

        layout.profile_avatar.layoutParams.height = dWidth.width

setAppBarOffset(heightpx)如下：

private fun setAppBarOffset(offsetPx: Int) {

        val params = layout.appbar.layoutParams as CoordinatorLayout.LayoutParams
        val behavior = params.behavior as AppBarLayout.Behavior?
        behavior!!.onNestedPreScroll(layout.coordinator,layout.appbar,this!!.view!!,0,offsetPx,intArrayOf(0, 0),0)
    }

推荐阅读