android - 在 CollapsingToolbarLayout 中显示任何组件
问题描述
我想做以下设计
不被折叠:
折叠:
为此,我做了以下布局:
<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/white"
android:clipChildren="false">
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/tracklist"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_anchor="@id/profileAppBar"
app:layout_anchorGravity="bottom"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
tools:listitem="@layout/tracklist_item"/>
<com.google.android.material.appbar.AppBarLayout
android:id="@+id/profileAppBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/tracklist_header_background">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="-10dp"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|exitUntilCollapsed|snap">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/profileMainSection"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/ui_margin_small"
android:layout_marginEnd="@dimen/ui_margin_small"
android:gravity="center_vertical"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="@font/quicksand"
android:gravity="center_vertical"
android:text="@string/drawer_menu_item_music"
android:textColor="@color/white"
android:textSize="@dimen/text_size_default_text"
android:textStyle="bold" />
<ImageView
android:id="@+id/editButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="?attr/selectableItemBackgroundBorderless"
android:padding="@dimen/ui_margin_xsmall"
app:srcCompat="@drawable/ic_headphones_white" />
</LinearLayout>
<androidx.cardview.widget.CardView
android:id="@+id/profileImageCard"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/ui_margin_xl_plus"
android:layout_marginTop="@dimen/ui_margin_xxl_plus"
android:elevation="0dp"
app:cardCornerRadius="25dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:id="@+id/profileImage"
android:layout_width="115dp"
android:layout_height="115dp"
android:contentDescription="@null"
app:srcCompat="@drawable/imago_placeholder_small" />
</androidx.cardview.widget.CardView>
<ImageView
android:id="@+id/favoriteButton"
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_marginStart="@dimen/ui_margin_large_plus"
android:layout_marginTop="2dp"
app:layout_constraintStart_toEndOf="@id/profileImageCard"
app:layout_constraintTop_toTopOf="@id/profileImageCard"
app:srcCompat="@drawable/full_heart_green" />
<ImageView
android:id="@+id/sendButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/ui_margin_normal"
app:layout_constraintStart_toEndOf="@id/favoriteButton"
app:layout_constraintTop_toTopOf="@id/profileImageCard"
app:srcCompat="@drawable/ic_send" />
<TextView
android:id="@+id/profileName"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/ui_margin_large_plus"
android:layout_marginTop="10dp"
android:layout_marginEnd="@dimen/ui_margin_normal"
android:fontFamily="@font/nunito"
android:textColor="@color/white"
android:textSize="@dimen/tracklist_header_title"
android:textStyle="bold"
android:text="Baba bubu"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/profileImageCard"
app:layout_constraintTop_toBottomOf="@id/favoriteButton"
tools:text="Rosalie Khumalo" />
<TextView
android:id="@+id/profilePhoneNumber"
style="@style/AyobaTypography.Body2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/ui_margin_large_plus"
android:layout_marginEnd="@dimen/ui_margin_normal"
android:textColor="@color/white"
android:text="32 songs · 1hr 40m"
app:layout_constraintStart_toEndOf="@id/profileImageCard"
app:layout_constraintTop_toBottomOf="@id/profileName"
tools:text="32 songs · 1hr 40m" />
<TextView
android:id="@+id/updateInfo"
style="@style/AyobaTypography.Body2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/tracklist_header_update_info_margin"
android:layout_marginEnd="@dimen/ui_margin_normal"
android:fontFamily="@font/nunito"
android:paddingTop="10dp"
android:paddingBottom="@dimen/tracklist_header_update_info_margin"
android:textColor="@color/white"
android:textStyle="italic"
android:text="Updated last week"
app:layout_constraintStart_toStartOf="@id/profileImageCard"
app:layout_constraintTop_toBottomOf="@id/profileImageCard"
tools:text="Updated last week" />
<ImageView
android:id="@+id/playButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="@dimen/ui_margin_large_plus"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="@+id/updateInfo"
app:srcCompat="@drawable/ic_music_button" />
<ImageView
android:id="@+id/shuffleButton"
android:layout_width="35dp"
android:layout_height="35dp"
android:layout_marginEnd="@dimen/ui_margin_large"
app:layout_constraintBottom_toBottomOf="@+id/playButton"
app:layout_constraintEnd_toStartOf="@id/playButton"
app:layout_constraintTop_toTopOf="@id/playButton"
app:srcCompat="@drawable/ic_button_shuffle_off" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.appcompat.widget.Toolbar
android:id="@+id/profileToolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_marginEnd="@dimen/ui_margin_xxl_md"
app:collapseIcon="@drawable/ic_white_arrow"
app:layout_collapseMode="pin"
app:navigationIcon="@drawable/ic_white_arrow" />
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
但是我无法在折叠时使 playButton 和 profileName 组件可见。我试图找到一个很好的例子,但我发现的唯一例子只是显示工具栏和 CollapsingToolbarLayout 组件中设置的标题。
解决方案
推荐阅读
- python - 从 CSV 文件加载虹膜数据集?
- html - SmoothScroll、Safari 支持和响应式导航
- c# - InstaSharper 令牌
- asp.net-core - 如何在 ASP .NET Core 的 Area 中使用 css 文件或 js
- java - 计算给定整数元素数组中范围 * {0, ..., r} 中整数的出现次数
- ansible - 在远程节点上运行远程脚本
- nginx - nginx服务器默认使用HTTP/2协议版本?
- google-bigquery - BigQuery 中复杂的字符串聚合
- java - java.net.http 客户端超时和连接管理/地址解析
- javascript - rn-apple-healthkit “发送到实例的无法识别的选择器”