我想创建一个如下图所示的布局:
一个 CoordinatorLayout 包含:
- CollapsingToolbarLayout(包含ImageView和工具栏)
- 回收视图
- 选项卡布局
- ViewPager(它的每个片段都包含一个RecyclerView)
我想以这种方式响应滚动事件:
- CollapsingToolbarLayout 通过滚动展开和折叠
- 工具栏粘在顶部,直到 TabLayout 到达顶部
- 之后工具栏向上滚动并且 TabLayout 粘在顶部
我在 CollapsingToolbarLayout 和 TabLayout 之间的 RecyclerView 方面遇到问题。我可以在没有 RecyclerView 的情况下实现这个布局(我将 CollapsingToolbarLayout 和 TabLayout 放在 AppBarLayout 内,将 ViewPager 放在它外面,在 CoordinatorLayout 内)。
我的问题:
- 我应该把 RecyclerView 放在哪里?
- 哪个和哪里
layout_scrollFlags
and layout_behavior
我应该为每个布局设置吗?
看来 AppBarLayout 的高度有限。当我将 RecyclerView 放入 AppBarLayout 中时,只有 RecyclerView 的一部分可见,并且 TabLayout 也消失了。
我读了很多教程,比如this one https://guides.codepath.com/android/Handling-Scrolls-with-CoordinatorLayout#responding-to-scroll-events和很多问题,比如this one https://stackoverflow.com/questions/35766172/recyclerview-and-viewpager-with-collapsing-toolbar and this one https://stackoverflow.com/questions/31958749/collapsing-toolbar-layout-with-viewpager-inside-nestedscrollview,但他们都没有帮助我。
使用它作为主要布局
活动主线
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.SwipeRefreshLayout 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:id="@+id/swipe_refresh_layout_profile"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:ignore="RtlHardcoded">
<android.support.design.widget.CoordinatorLayout
android:id="@+id/co_profile_activity_root_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/white"
android:visibility="visible">
<android.support.design.widget.AppBarLayout
android:id="@+id/appbar_profile"
android:layout_width="match_parent"
android:layout_height="@dimen/profile_img_placeholder_height"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapse_toolbar_profile"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed|snap">
<RelativeLayout
android:id="@+id/rel_top"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop">
<ImageView
android:id="@+id/img_bg_placeholder_profile"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:tint="#11000000"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.9" />
<LinearLayout
android:id="@+id/lin_top_inner"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#BF473e6b"
android:orientation="vertical"
android:scaleType="centerCrop">
</LinearLayout>
</RelativeLayout>
<FrameLayout
android:id="@+id/frame_detail_profile"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center|center_horizontal"
android:orientation="vertical"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.3">
<android.support.v7.widget.RecyclerView
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</android.support.v7.widget.RecyclerView>
</FrameLayout>
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar_profile"
android:layout_width="match_parent"
android:layout_height="@dimen/profile_toolbar_height"
android:gravity="top|center"
app:layout_anchor="@id/frame_detail_profile"
app:layout_collapseMode="pin"
app:theme="@style/ThemeOverlay.AppCompat.Dark"
app:title="">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="@+id/tv_toolbar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="@dimen/profile_toolbar_title_left_margin"
android:gravity="center_vertical|center"
android:ellipsize="end"
android:singleLine="true"
android:layout_gravity="center"
android:textColor="@android:color/white"
android:textSize="20sp" />
</LinearLayout>
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="@+id/tab_layout_profile"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_gravity="bottom"
android:layout_marginTop="@dimen/profile_tab_layout_top_margin"
android:background="@color/white"
app:tabIndicatorColor="@color/colorPrimary"
app:tabSelectedTextColor="@color/colorPrimary"
app:tabTextColor="@color/charcoal_grey" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="@+id/view_pager_profile"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
</RelativeLayout>
</android.support.v4.widget.SwipeRefreshLayout>
对于选项卡的网格布局,请使用适配器类。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)