Android - ActivityOptionsCompat - 自定义展开动画答案

【问题标题】：Android - ActivityOptionsCompat - Custom Expand AnimationAndroid - ActivityOptionsCompat - 自定义展开动画
【发布时间】：2015-12-04 18:31:23
【问题描述】：

我目前正在尝试弄清楚如何制作自定义展开动画，并且使用 ActivityOptionsCompat 似乎是最好的方法；但是，我不太确定如何编写自定义过渡动画来实现我想要的效果。

我在“打开”列表顶部有一个按钮，按下该按钮时会将其下方的 ListView 向下移动，展开并显示带有选项的屏幕。我希望这张图片能解释我想要完成的工作。

我想做的是：

将顶部“打开”栏设置为第二个屏幕“标题”中的顶部栏称为“过滤器”
将“打开”栏正下方的 0px 高度视图设置为名为“FRAME”的扩展选项列表
将 ViewPager 设置为展开选项下方 0 像素高度的视图称为“列表”

但列表并没有被推开，新屏幕只是覆盖在它上面。

ViewCompat.setTransitionName( filters, "FILTERS" );
ViewCompat.setTransitionName( frame, "FRAME" );
ViewCompat.setTransitionName( viewPager, "LIST" );

ActivityOptionsCompat options = ActivityOptionsCompat.makeSceneTransitionAnimation(
            getActivity(), new Pair<>( filters, "FILTERS" ), new Pair<>( frame, "FRAME" ), new Pair<>( (View)viewPager, "LIST" ) );


ActivityCompat.startActivity( getActivity(), new Intent( getActivity(), Filters.class ),
            options.toBundle() );

有谁知道如何完成这种风格的过渡动画？

感谢您的时间和帮助。

【问题讨论】：

您在测试什么 API 级别？它仅适用于 API 21 或更高版本。
我正在尝试定位 15 岁以上。

标签： android animation android-appcompat

【解决方案1】：

如果不必是其他活动，您可以使用我过去也使用过的 nice library here by umano。

要使用它，您需要将它包含在您的 gradle 依赖项中：

compile 'com.sothree.slidinguppanel:library:3.2.0'

然后你可以像这样使用它：

<com.sothree.slidinguppanel.SlidingUpPanelLayout
    xmlns:sothree="http://schemas.android.com/apk/res-auto"
    android:id="@+id/sliding_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="bottom"
    sothree:umanoPanelHeight="68dp"
    sothree:umanoShadowHeight="4dp"
    sothree:umanoParallaxOffset="100dp"
    sothree:umanoDragView="@+id/dragView"
    sothree:umanoOverlay="true"
    sothree:umanoScrollableView="@+id/list">

    <!-- MAIN CONTENT -->
    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
        <android.support.v7.widget.Toolbar
            xmlns:sothree="http://schemas.android.com/apk/res-auto"
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/main_toolbar"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            sothree:theme="@style/ActionBar"
            android:layout_width="match_parent"/>
        <TextView
            android:id="@+id/main"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginTop="?attr/actionBarSize"
            android:gravity="center"
            android:text="Main Content"
            android:clickable="true"
            android:focusable="false"
            android:focusableInTouchMode="true"
            android:textSize="16sp" />
    </FrameLayout>

    <!-- SLIDING LAYOUT -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#ffffff"
        android:orientation="vertical"
        android:clickable="true"
        android:focusable="false"
        android:id="@+id/dragView">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="68dp"
            android:orientation="horizontal">

            <TextView
                android:id="@+id/name"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:textSize="14sp"
                android:gravity="center_vertical"
                android:paddingLeft="10dp"/>

            <Button
                android:id="@+id/follow"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:textSize="14sp"
                android:gravity="center_vertical|right"
                android:paddingRight="10dp"
                android:paddingLeft="10dp"/>

        </LinearLayout>

        <ListView
            android:id="@+id/list"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1">
        </ListView>
    </LinearLayout>
</com.sothree.slidinguppanel.SlidingUpPanelLayout>

【讨论】：

我不认为这正是我想要的。我希望它看起来像是将视图从 0px 拉伸到填充屏幕，这更像是一个叠加层。

【解决方案2】：

ActivityOptionsCompat.makeSceneTransitionAnimation() 仅在 API 21+ 设备上运行有效。要查看动画，需要在样式级别启用过渡

<!-- enable window content transitions -->
<item name="android:windowContentTransitions">true</item>

它需要为调用和被调用的目标布局的视图设置相同的TransitionName。

无论如何，过渡就像一个缩小/缩小，而不是滚动。

【讨论】：