【问题标题】:How to achieve an "animated CollapsingToolbar?"如何实现“动画 CollapsingToolbar”?
【发布时间】:2016-09-02 07:49:45
【问题描述】:

基本上,我想知道在使用 RecyclerView 时如何实现一种“动画 CollapsingToolbar”。请注意,它是用引号引起来的,因为我没有附加到作为 CollapsingToolbar 的解决方案,但这是迄今为止我能找到的最接近我想要的东西。基本上,我想制作一个工具栏,其中包含我的应用程序的标题,以及带有一些字符串的副标题,后跟一个 int(作为字符串类型)。当我向上滚动时,我希望字符串淡出,但保留 int 并向上移动到与应用标题相同的级别。

(请原谅粗图)

我查看了this solution,但它依赖于 ListView。我也看过this solution,但是我看不出我如何能够按照自己的意愿自定义动画。 This repo 看起来可以工作,但它有一堆错误,无法编译。

所以基本上,总而言之,我正在寻找如何以我上面描述的方式为工具栏设置动画,用你认为最好的任何方式,不一定是折叠工具栏。

【问题讨论】:

  • 请发布您的代码
  • @skydroid 我没有任何东西可以像我想要实现的那样工作。我得到的最接近的是提供的两个链接,以及它们对我不起作用的原因。

标签: java android android-animation android-collapsingtoolbarlayout


【解决方案1】:

查看此CoordinatorLayout

<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/app_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingTop="5dp"
        android:paddingBottom="30dp"
        android:theme="@style/AppTheme.AppBarOverlay"
        >

        <abysmel.com.collapsibletoolbarhelper.widgets.CollapsibleToolbarHelper
            android:id="@+id/toolbar_layout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"
            android:gravity="center_vertical"
            android:layout_marginTop="10dp"
            android:background="@android:color/transparent"
            >

            <!--Note that the position has to be set with respect to the collapsed toolbar. So,
                aligning it in center initially (centerInParent="true") will NOT work as it will remain
                at its position even after the Toolbar collapses. Also note that the initially set the
                alpha of the view to zero and NOT the visibility to gone, as the view will then have never
                been drawn which will throw all calculations haywire for show_on_collapse. Wish there
                was a better way to do this-->
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/hello.img"
                android:src="@mipmap/hello"
                android:layout_marginLeft="10dp"
                android:alpha="0"
                app:layout_marginTopPercent = "3%"
                app:collapseMode="show_on_collapse"/>

            <!-- Title -->
            <abysmel.com.collapsibletoolbarhelper.widgets.CollapsibleTextLayout
                android:id="@+id/hello.text"
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                app:layout_widthPercent="59%"
                android:layout_alignParentLeft="true"
                app:layout_marginTopPercent = "1%"
                app:layout_marginBottomPercent = "1%"
                app:layout_marginLeftPercent="5%"
                android:textColor="@android:color/white"
                app:collapseMode="pin_on_scroll"
                app:textToShow = "Hello World"
                app:expandedTextColor = "@android:color/white"
                app:collapsedTextColor = "@android:color/white"
                app:typefaceFamilyPrimary = "sans-serif-light"
                app:typefaceFamilySecondary = "sans-serif-medium"
                app:isMultiFaceted="true"
                app:typefaceSplitPosition="5"
                app:expandedTextSize = "62dp"
                app:collapsedTextSize = "32dp"
                app:maxExpandedTextSize = "62dp"
                />

            <!-- The hello number edit button -->
            <ImageView
                android:id="@+id/hello.edit"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentRight="true"
                app:layout_marginTopPercent = "3%"
                app:layout_marginBottomPercent = "1%"
                app:layout_marginRightPercent = "4%"
                android:layout_marginLeft="10dp"
                android:src="@mipmap/pencil"
                app:collapseMode="hide_on_collapse"/>

            <!-- The hello Number -->
            <TextView
                android:id="@+id/hello.number"
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                app:layout_widthPercent="40%"
                app:layout_marginTopPercent = "1%"
                app:layout_marginBottomPercent = "1%"
                app:layout_marginRightPercent = "1%"
                android:layout_toLeftOf="@id/hello.edit"
                android:layout_toRightOf="@id/hello.text"
                android:gravity="end"
                android:text="@string/hello_no_sign"
                android:textColor="@android:color/white"
                android:textSize="@dimen/hello_no_size"
                app:collapseMode="pin_on_scroll"/>



            <!-- Version -->
            <TextView
                android:id="@+id/version"
                app:layout_widthPercent="40%"
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:layout_below="@id/hello.text"
                android:layout_marginTop="5dp"
                android:layout_alignParentLeft="true"
                app:layout_marginLeftPercent="5%"
                android:text="@string/version"
                android:textColor="@android:color/white"
                android:textSize="@dimen/version_no_size"
                app:collapseMode="parallax_on_scroll"
                 />

            <!-- E-mail Address -->
            <TextView
                android:id="@+id/hello.address"
                app:layout_widthPercent="40%"
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:layout_below="@id/hello.number"
                android:layout_alignParentRight="true"
                android:gravity="end"
                app:layout_marginRightPercent="5%"
                android:text="@string/emailaddress"
                android:textColor="@android:color/white"
                android:textSize="@dimen/mail_address_size"
                app:collapseMode="parallax_on_scroll"
                 />
        </abysmel.com.collapsibletoolbarhelper.widgets.CollapsibleToolbarHelper>
    </android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>

https://github.com/opacapp/multiline-collapsingtoolbar

【讨论】:

  • 看起来它可以工作,但我似乎无法弄清楚如何安装它。看起来它本身就是一个 android 应用,而不是真正的库
  • 是的,看来这个库已经过时了。我为它找到了一个等级,但它充满了错误,目前似乎适用于 24.1.1,但即使使用该版本的设计,它也会抛出 ResourceNotFoundExceptions
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2010-11-22
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多