标签: android-collapsingtoolbarlayout

以编程方式折叠或展开CollapsingToolbarLayout

简单的问题,但我找不到答案.如何以CollapsingToolbarLayout编程方式折叠或展开？

折叠的工具栏

↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓

扩展工具栏

android android-collapsingtoolbarlayout

Tom*_*mas

2016 03-30

151
推荐指数

7
解决办法

8万
查看次数

仅在折叠时显示CollapsingToolbarLayout标题

标题说明了一切.我试过setExpandedTitleColor和setCollapsedTitleColor(开关,并从透明的),没有运气.我也看不到任何内置的方法可以做我正在寻找的东西.

我只想在CollapsingToolbarLayout完全折叠时显示标题,否则,我需要隐藏它.

任何提示？

android android-collapsingtoolbarlayout

Pse*_*328

lucky-day

137
推荐指数

8
解决办法

8万
查看次数

如何模仿谷歌地图的底层3阶段行为？

背景

我被指派制作一个与Google地图显示找到结果的底页的行为类似的用户界面.

它有三个不同的阶段:

底部内容.上部区域仍然是可触摸的,不会在底部滚动任何东西
全屏内容,而上部区域有一个大标题.
全屏内容,而上部区域只有工具栏.

以下是我在Google地图上讨论的内容:

问题

事实是,底页不是设计库的一部分(尽管这是请求的,这里).

不仅如此,UI似乎相当复杂,需要在多个阶段处理工具栏.

我试过的

我已经找到了底部片(一个很好的(足够的)库在这里),并添加内容到它的碎片样本,有大致相同的看法材料设计的样品,如图(如这里),有一个CollapsingToolbarLayout会照顾阶段2 + 3.

在我正在制作的应用程序中,我还必须在滚动时移动一个图标,但我认为如果我成功完成其余部分,这应该很容易.这是代码:

fragment_my.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
    android:id="@+id/main_content"
    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.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="@dimen/detail_backdrop_height"

        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsing_toolbar"
            android:layout_width="match_parent"
            android:layout_height="match_parent"

            app:contentScrim="?attr/colorPrimary"
            app:expandedTitleMarginEnd="64dp"
            app:expandedTitleMarginStart="48dp"
            app:layout_scrollFlags="scroll|exitUntilCollapsed|snap">

            <ImageView
                android:id="@+id/backdrop"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:scaleType="centerCrop"
                app:layout_collapseMode="parallax"/>

            <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/ThemeOverlay.AppCompat.Light"/>
        </android.support.design.widget.CollapsingToolbarLayout>
    </android.support.design.widget.AppBarLayout>

    <android.support.v4.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical"
            android:paddingTop="24dp">

            <android.support.v7.widget.CardView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="@dimen/card_margin">

                <LinearLayout
                    style="@style/Widget.CardContent"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content">

                    <TextView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:text="Info"
                        android:textAppearance="@style/TextAppearance.AppCompat.Title"/> …

Run Code Online (Sandbox Code Playgroud)

android material-design android-design-library android-coordinatorlayout android-collapsingtoolbarlayout

and*_*per

2016 12-15

106
推荐指数

2
解决办法

3万
查看次数

CollapsingToolbarLayout无法识别滚动显示

我创建了一个简单的CollapsingToolbarLayout,它就像一个魅力.我的问题是,如果我尝试在nestedscrollview上使用一个滚动滚动,它会在我释放手指时停止.正常滚动就像它应该的那样工作.

我的活动代码未更改=>自动生成的空活动.(我刚刚点击了在android studio中创建新的空活动并编辑了XML).

我在这里看到,imageview本身的滚动手势是错误的,但不是,滚动本身是错误的:看到这里.

我尝试通过java代码激活"平滑滚动".似乎如果我滚动得足够远以至于不再可见图像视图,则可以识别出手势.

TLDR:只要图像视图可见,为什么抛弃手势不起作用？我的XML代码如下所示:

    <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:fitsSystemWindows="true">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/profile_app_bar_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        android:fitsSystemWindows="true">

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

            <ImageView
                android:id="@+id/image"
                android:layout_width="match_parent"
                android:layout_height="420dp"
                android:scaleType="centerCrop"
                android:fitsSystemWindows="true"
                android:src="@drawable/headerbg"
                android:maxHeight="192dp"

                app:layout_collapseMode="parallax"/>

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
                app:layout_collapseMode="pin" />

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

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

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        app:layout_anchor="@id/profile_app_bar_layout"
        app:layout_anchorGravity="bottom|right|end"
        android:layout_height="@dimen/fab_size_normal"
        android:layout_width="@dimen/fab_size_normal"
        app:elevation="2dp"
        app:pressedTranslationZ="12dp"
        android:layout_marginRight="8dp"
        android:layout_marginEnd="8dp"/>

    <android.support.v4.widget.NestedScrollView
        android:id="@+id/profile_content_scroll"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:clipToPadding="false"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        android:layout_gravity="fill_vertical"
        android:minHeight="192dp"
        android:overScrollMode="ifContentScrolls"
        > …

Run Code Online (Sandbox Code Playgroud)

java xml android android-collapsingtoolbarlayout

use*_*516

2016 02-27

93
推荐指数

2
解决办法

1万
查看次数

Android CollapsingToolbarLayout崩溃侦听器

我使用的CollapsingToolBarLayout旁边有AppBarLayout和CoordinatorLayout,和他们一起工作的罚款.Toolbar当我向上滚动时,我将我设置为固定,我想知道是否有一种方法可以在CollapsingToolBarLayout折叠时更改工具栏的标题文本.

总结一下,我想在滚动和扩展时使用两种不同的标题.

谢谢大家

android android-design-library android-collapsingtoolbarlayout

Ana*_*ade

2017 01-18

92
推荐指数

7
解决办法

5万
查看次数

使用AppBarLayout重叠滚动视图

我想从Material设计滚动技术中实现"具有重叠内容的灵活空间"模式,例如在此视频中: 具有重叠内容GIF的灵活空间

我的XML布局现在看起来像:

<android.support.design.widget.CoordinatorLayout 
    android:layout_width="match_parent"
    android:layout_height="match_parent">

  <android.support.design.widget.AppBarLayout
      android:layout_width="match_parent"
      android:layout_height="192dp"
      android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

    <android.support.design.widget.CollapsingToolbarLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_scrollFlags="scroll|exitUntilCollapsed">

      <android.support.v7.widget.Toolbar
          android:layout_height="?attr/actionBarSize"
          android:layout_width="match_parent"
          app:layout_collapseMode="pin"/>
    </android.support.design.widget.CollapsingToolbarLayout>
  </android.support.design.widget.AppBarLayout>

  <android.support.v4.widget.NestedScrollView
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      app:layout_behavior="@string/appbar_scrolling_view_behavior">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
      <....>
    </LinearLayout>
  </android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>

Run Code Online (Sandbox Code Playgroud)

有没有一种简单的方法可以使用设计库实现这一目标？或者我是否必须构建自定义CoordinatorLayout.Behavior来执行此操作？

android android-design-library android-collapsingtoolbarlayout

ian*_*ake

2016 06-19

90
推荐指数

2
解决办法

4万
查看次数

如何更改CollapsingToolbarLayout字体和大小？

我想改变CollapsingToolbarLayout字体大小和字体.我怎么能做到这一点？

fonts android toolbar font-size android-collapsingtoolbarlayout

Ale*_*tov

lucky-day

80
推荐指数

8
解决办法

5万
查看次数

如何禁用NestedScrollView和CollapsingToolbarLayout的滚动,例如下面没有更多内容？

背景

我尝试添加许多应用程序所显示的相同功能,其中屏幕的上部区域根据滚动内容缩小和扩展.

为此,我使用了Google的设计库,如CheeseSquare示例所示.

问题

事实是,无论NestedScrollView中有多少内容,它都允许我在内容的最后一个视图下方滚动,只是为了让我看到动作栏的最终状态,具有最小的自身大小.

简而言之,这是我在滚动到底部时看到的内容(CheeseSquare示例的修改内容):

虽然这是滚动到底部时我想要的(从联系人应用程序中获取):

我也试图修复ThreePhasesBottomSheet示例中的一个错误,即使它处于窥视状态,滚动底部内容也是可能的.要重现,请开始水平滚动(这不会做任何事情,因为没有任何东西可以滚动),然后垂直滚动,这会以某种方式触发底部内容的滚动.

因此,我需要在"transformView()"方法中禁用滚动,在"翻译"的情况下

这是使用正常用法的方式:

这就是它如何处理不阻止滚动的错误:

我试过的

我试图使用" layout_scrollFlags "标志,将高度更改为wrap_content,并删除clipToPadding和fitsSystemWindows属性.

这是示例XML文件,我已将其修改为仅包含一个cardView而不是多个:

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/main_content"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="@dimen/detail_backdrop_height"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        android:fitsSystemWindows="true">

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

            <ImageView
                android:id="@+id/backdrop"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:scaleType="centerCrop"
                android:fitsSystemWindows="true"
                app:layout_collapseMode="parallax" />

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
                app:layout_collapseMode="pin" />

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

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

    <android.support.v4.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical"
            android:paddingTop="24dp">

            <android.support.v7.widget.CardView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="@dimen/card_margin">

                <LinearLayout
                    style="@style/Widget.CardContent"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content">

                    <TextView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:text="Info" …

Run Code Online (Sandbox Code Playgroud)

android material-design android-design-library android-collapsingtoolbarlayout nestedscrollview

and*_*per

2015 12-29

64
推荐指数

2
解决办法

2万
查看次数

Android:CollapsingToolbarLayout和SwipeRefreshLayout卡住了

我一起使用CollapsingToolbarLayout,RecyclerView和SwipeRefreshLayout:

XML:

<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

<android.support.design.widget.CoordinatorLayout
    android:id="@+id/coordinator_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

<android.support.design.widget.AppBarLayout
    android:id="@+id/appbar"
    android:layout_width="match_parent"
    android:layout_height="@dimen/collapse_toolbar_height"
    android:fitsSystemWindows="true"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

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

        <ImageView
            android:id="@+id/toolbar_image"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="centerCrop"
            android:fitsSystemWindows="true"
            app:layout_collapseMode="parallax" />

        <include
            layout="@layout/activity_main_toolbar"/>

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

    <android.support.v4.widget.SwipeRefreshLayout
        android:id="@+id/swipe_container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <cz.yetanotherview.webcamviewer.app.helper.EmptyRecyclerView
            android:id="@+id/mainList"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scrollbars="vertical" />
    </android.support.v4.widget.SwipeRefreshLayout>

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/floating_action_button"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        app:layout_anchor="@id/appbar"
        app:layout_anchorGravity="bottom|right|end"
        android:layout_margin="16dp"
        app:fabSize="mini"
        android:src="@drawable/ic_action_edit"
        android:onClick="assignSelectedWebCamsToCategory"/>

    <com.github.clans.fab.FloatingActionMenu
        android:id="@+id/floating_action_menu"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="bottom|end"
        android:paddingRight="10dp"
        android:paddingBottom="8dp"
        android:paddingLeft="10dp"
        fab:menu_shadowColor="#37000000"
        fab:menu_colorNormal="#DA4336"
        fab:menu_colorPressed="#E75043"
        fab:menu_colorRipple="#99FFFFFF"
        fab:menu_icon="@drawable/fab_add"
        fab:menu_buttonSpacing="10dp"
        fab:menu_labels_textColor="@color/very_dark_grey"
        fab:menu_labels_textSize="14sp"
        fab:menu_labels_colorNormal="@color/white" …

Run Code Online (Sandbox Code Playgroud)

android swiperefreshlayout android-collapsingtoolbarlayout

Tom*_*mas

2015 10-27

56
推荐指数

3
解决办法

3万
查看次数

Android CollapsingToolbarLayout标题背景

我正在使用新Android设计支持库中的CollapsingToolbarLayout.

我已经设置了它的标题并且它工作正常,我仍然唯一的问题是当你滚动时,文本会丢失,具体取决于背景中的图像.

我想做的是设置CollapsingToolbarLayout标题的背景,但我还没有办法做到这一点.

反正有没有实现这个目标？

谢谢!

布局:

<android.support.design.widget.CoordinatorLayout
android:id="@+id/main_content"
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:fitsSystemWindows="true">

<android.support.design.widget.AppBarLayout
    android:id="@+id/appbar"
    android:layout_width="match_parent"
    android:layout_height="@dimen/detail_backdrop_height"
    android:fitsSystemWindows="true"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

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

        <ImageView
            android:id="@+id/ivBigImage"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true"
            android:scaleType="centerCrop"
            app:layout_collapseMode="parallax"/>

        <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/ThemeOverlay.AppCompat.Light"/>

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

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

<android.support.v4.widget.NestedScrollView
    android:layout_width="match_parent"
    android:layout_gravity="fill_vertical"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:paddingTop="24dp">

        <android.support.v7.widget.CardView
            android:id="@+id/cvDescription"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="10dp">

            <LinearLayout
                style="@style/Image.Info.CardContent"
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:text="@string/description"
                    android:textAppearance="@style/TextAppearance.AppCompat.Title"/>

                <TextView
                    android:id="@+id/tvDescription"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:text=""/>

            </LinearLayout>

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


    </LinearLayout>

</android.support.v4.widget.NestedScrollView>

Run Code Online (Sandbox Code Playgroud)

在活动中设置CollapsingToolbarLayout标题:

CollapsingToolbarLayout collapsingToolbar = …

Run Code Online (Sandbox Code Playgroud)

android android-styles android-support-design android-collapsingtoolbarlayout

roy*_*non

2015 07-29

46
推荐指数

2
解决办法

3万
查看次数

标签统计

android ×10

android-collapsingtoolbarlayout ×10

android-design-library ×4

material-design ×2

android-coordinatorlayout ×1

android-styles ×1

android-support-design ×1

font-size ×1

fonts ×1

java ×1

nestedscrollview ×1

swiperefreshlayout ×1

toolbar ×1

xml ×1

背景

问题

我试过的

fragment_my.xml

背景

问题

我试过的

标签 统计

标签统计