【问题标题】:Collapse bar as the user scrolls fragment (NestedScrollView)用户滚动片段时折叠栏(NestedScrollView)
【发布时间】:2018-07-16 10:05:10
【问题描述】:

在我的ProfileFragment.java 中,我有一个带有用户横幅和个人资料图片的折叠工具栏。在该片段中,我也有一个 NestedScrollView(包含在我的 XML 中)以使折叠工具栏在用户滚动片段时折叠。在那个 Nested ScrollView 里面我有一个 RecyclerView。我想要实现的是,当用户滚动 RecyclerView 时,折叠的工具栏会折叠。我没有做到这一点,我不知道为什么。 这是我在ProfileFragment.java 中使用的include

<include
    layout="@layout/content_scrolling_profile"
    android:layout_width="match_parent"
    android:layout_height="443dp"
    android:layout_marginTop="203dp" />

这是包含的 XML:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.NestedScrollView 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="fill_parent"
android:layout_height="match_parent"
android:paddingTop="30dp"
app:layout_behavior="@string/appbar_scrolling_view_behavior">


<android.support.v7.widget.RecyclerView
    android:id="@+id/recyclerViewFotosPerfil"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_alignParentBottom="true"
    android:layout_alignParentStart="true"
    android:layout_marginEnd="20dp"
    android:layout_marginStart="20dp"
    android:layout_marginTop="60dp"
    android:paddingBottom="-150dp">


</android.support.v7.widget.RecyclerView>

如果用户滚动的是recyclerview而不是栏,为什么我无法获得栏折叠的效果?

编辑

这只是我想要的一个例子。在这里,完整的图像是一个Collapsing Toolbar,文本是一个NestedScrollView,里面有一个TextView。当我向上滚动 NestedScrollView 时,工具栏又变大了。

我想这样做,但是在我的嵌套滚动视图中使用 Recycler 视图 以及该尺寸的折叠工具栏。 (我想放在折叠工具栏之后)

这是我的主要 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"
android:layout_width="match_parent" android:layout_height="match_parent"
android:background="@color/colorWhite"
android:orientation="vertical"
xmlns:tools="http://schemas.android.com/tools">

<android.support.design.widget.AppBarLayout
    android:id="@+id/testeparabackground"
    android:layout_width="match_parent"
    android:layout_height="203dp"
    android:background="?attr/actionBarDivider">

    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/backgroundcollapsedtoolbar"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:expandedTitleMarginEnd="64dp"
        app:expandedTitleMarginStart="48dp"
        app:layout_scrollFlags="exitUntilCollapsed|scroll">

        <ImageView
            android:id="@+id/imgFotoCapa"
            android:layout_width="446dp"
            android:layout_height="203dp"
            android:layout_alignParentStart="true"
            android:layout_alignParentTop="true"
            android:paddingLeft="-32dp"
            android:visibility="visible"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:srcCompat="@drawable/banner_profile"
            tools:layout_editor_absoluteY="1dp" />

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbarid"
            android:layout_width="match_parent"
            android:layout_height="110dp"
            app:layout_collapseMode="pin"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light">

        </android.support.v7.widget.Toolbar>


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

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


<ImageView
    android:id="@+id/picFotoPerfil3"
    android:layout_width="117dp"
    android:layout_height="103dp"
    android:layout_alignParentTop="true"
    android:layout_centerHorizontal="true"
    android:layout_marginTop="-75dp"
    android:elevation="50dp"
    app:layout_anchor="@+id/testeparabackground"
    app:layout_anchorGravity="bottom|center"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:srcCompat="@android:color/black" />


<TextView
    android:id="@+id/txtLocalizacao2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerInParent="true"
    android:layout_marginRight="75dp"
    android:layout_marginTop="262dp"
    android:text="@string/LocalizacaoAtual"
    android:textAlignment="center"
    android:textColor="@color/colorWhiteGrey"
    android:textSize="14sp"
    app:layout_anchor="@+id/testeparabackground"
    app:layout_anchorGravity="right|center"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.543"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/picFotoPerfil3"
    app:layout_constraintVertical_bias="0.126"
    tools:ignore="MissingConstraints" />

<TextView
    android:id="@+id/txtProfileTitulo3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    android:layout_centerHorizontal="true"
    android:layout_marginBottom="172dp"
    android:paddingTop="20dp"
    android:text="@string/PerfilTitulo"
    android:textColor="@android:color/white"
    android:textSize="20sp"
    app:layout_anchor="@+id/testeparabackground"
    app:layout_anchorGravity="top|center"
    app:layout_constraintBottom_toTopOf="@+id/picFotoPerfil3"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.501"
    app:layout_constraintStart_toStartOf="parent" />

<TextView
    android:id="@+id/txtNomeUtilizador2"
    android:layout_width="220dp"
    android:layout_height="wrap_content"
    android:layout_above="@+id/txtLocalizacao2"
    android:layout_centerHorizontal="true"
    android:layout_marginBottom="-4dp"
    android:paddingTop="30dp"
    android:text="@string/NomeUtilizador"
    android:textAlignment="center"
    android:textColor="#323B45"
    android:textSize="18sp"
    app:layout_anchor="@+id/picFotoPerfil3"
    app:layout_anchorGravity="bottom|center"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/picFotoPerfil3"
    app:layout_constraintVertical_bias="0.042"
    tools:ignore="MissingConstraints" />






<include
    layout="@layout/content_scrolling_profile"
    android:layout_width="match_parent"
    android:layout_height="443dp"
    android:layout_marginTop="203dp" />

【问题讨论】:

  • 对您的回收站视图使用 setNestedScrollingEnabled(false)
  • 你的xmlAppBarLayout在哪里?
  • @AbuYousuf 完全忘记了,抱歉,请查看我更新的问题!

标签: java android xml


【解决方案1】:

这就是我在我的应用程序中实现它的方式 -

    <android.support.design.widget.AppBarLayout
        android:id="@+id/app_bar_layout"
        android:layout_width="match_parent"
        android:layout_height="@dimen/app_bar_height"
        android:fitsSystemWindows="true"
        android:theme="@style/AppTheme.AppBarOverlay">

        <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"
            app:toolbarId="@+id/toolbar">

            <ImageView
                android:id="@+id/collapsing_toolbar_image"
                android:layout_width="match_parent"
                android:layout_height="200dp"
                android:tint="@color/colorWhite"
                android:scaleType="centerCrop"
                android:src="@drawable/ic_logo"
                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>

这里的关键属性是“layout_scrollFlags”,它可以让工具栏在向下滚动时折叠。希望这会有所帮助。

编辑 - 您是否将 widget.Toolbar 包含在 CollapsingToolbarLayout 中?上面的布局代码给了我你正在寻找的确切的东西。

【讨论】:

  • 您还可以通过在 CollapsingToolbarLayout 中添加可绘制背景属性来为工具栏添加背景
  • 我的折叠工具栏中有app:layout_scrollFlags="scroll|exitUntilCollapsed"。问题是它只在我滚动折叠工具栏时滚动,而不是在我向外滚动时滚动(在我的 NestedScrollView 中)。我想要的是,当用户滚动 NestedScrollView/RecyclerView 时,toll​​bar 也会折叠,当用户向上滚动 Nested/RecyclerView 时,工具栏又满了
  • 您的折叠工具栏是content_scrolling_profile 的一部分吗?如果是,请将其从该文件中删除并将其添加到活动的主布局文件中。不要在&lt;include layout=...&gt; 资源文件中包含工具栏。
  • 不,这是我的主文件的一部分,而不是包含
  • 恐怕这不是我想要的,因为当我用里面的 RecyclerView 滚动嵌套的 ScrollView 时,工具栏一直不滚动啊啊啊&lt;include&gt; 需要在工具栏之后吗?
猜你喜欢
  • 1970-01-01
  • 2015-12-14
  • 1970-01-01
  • 1970-01-01
  • 2016-04-04
  • 1970-01-01
  • 1970-01-01
  • 2022-10-15
  • 1970-01-01
相关资源
最近更新 更多