【问题标题】:How to handle scrolling with Collapsing Toolbar Layout如何使用折叠工具栏布局处理滚动
【发布时间】:2020-07-01 09:21:19
【问题描述】:

我在我的应用程序中添加了折叠工具栏,但现在它只在用户滚动 CollapsingToolbarLayout 内的图像视图时折叠。当用户从视图中的任何位置滚动时,如何折叠工具栏?

这是我的布局

<?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"
tools:context=".ui.ProfileActivity">

<android.support.design.widget.AppBarLayout
    android:id="@+id/app_bar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:fitsSystemWindows="true">

    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/toolbar_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        app:contentScrim="?attr/colorPrimary"
        app:layout_scrollFlags="scroll|exitUntilCollapsed">

        <ImageView
            android:id="@+id/profile_image"
            android:layout_width="match_parent"
            android:layout_height="400dp"
            android:scaleType="centerCrop"
            android:src="@drawable/default_avatar"
            app:layout_collapseMode="parallax"
            app:layout_collapseParallaxMultiplier="0.7" />

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:layout_collapseMode="pin"
            app:popupTheme="@style/AppTheme.PopupOverlay" />
    </android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>

<include layout="@layout/profile_contents"
    app:layout_anchor="@+id/app_bar"
    app:layout_anchorGravity="bottom"
    android:layout_gravity="bottom"
    android:layout_height="wrap_content"
    android:layout_width="match_parent" />


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

这些是现在 profile_contents.xml 的内容,因为我将来会添加更多项目。

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto">


<TextView
    android:id="@+id/profile_displayName"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="32dp"
    android:text="loading name..."
    android:textColor="@color/black"
    android:textSize="24dp"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

<TextView
    android:id="@+id/profile_status"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="32dp"
    android:text="loading status..."
    android:textColor="@color/black"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/profile_displayName" />

<Button
    android:id="@+id/profile_send_req_btn"
    android:layout_width="182dp"
    android:layout_height="38dp"
    android:layout_marginTop="44dp"
    android:background="@drawable/profile_button_bg"
    android:padding="10dp"
    android:text="@string/send_friend_request"
    android:textAllCaps="false"
    android:textColor="@color/white"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.498"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/profile_status" />

</android.support.constraint.ConstraintLayout>

【问题讨论】:

  • 可以放profile_contents.xml源码吗?
  • 我刚刚更新了我的问题

标签: android material-design


【解决方案1】:

将您包含的布局放在NestedScrollView 视图中,因为ConstraintLayout 不是可滚动视图。

像这样:

<androidx.core.widget.NestedScrollView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_gravity="bottom"
    app:layout_anchor="@+id/app_bar"
    app:layout_anchorGravity="bottom"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

    <include layout="@layout/profile_contents"
        android:layout_height="wrap_content"
        android:layout_width="match_parent" />

</androidx.core.widget.NestedScrollView>

别忘了把app:layout_behavior放在NestedScrollView

【讨论】:

  • 很高兴能帮上忙。
【解决方案2】:

将此添加到profile_contents 布局的根视图中

app:layout_behavior="@string/appbar_scrolling_view_behavior"

我们需要定义 AppBarLayout 和要滚动的 View 之间的关联。将app:layout_behavior 添加到 RecyclerView 或任何其他能够嵌套滚动的 View,例如 NestedScrollView。支持库包含一个特殊的字符串资源@string/appbar_scrolling_view_behavior,它映射到AppBarLayout.ScrollingViewBehavior,用于在此特定视图上发生滚动事件时通知AppBarLayout。必须在触发事件的视图上建立行为。

以上文字来自这里https://guides.codepath.com/android/handling-scrolls-with-coordinatorlayout

【讨论】:

  • 当我添加这一行时,我包含的布局会跳到布局之外并且仍然不会滚动
  • 尝试将其添加到 profile_contents 布局的根视图中
猜你喜欢
  • 1970-01-01
  • 2015-08-14
  • 1970-01-01
  • 2015-09-03
  • 2016-01-16
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多