Android - ActivityOptionsCompat - Пользовательский развернуть анимацию

В настоящее время я пытаюсь выяснить, как создать пользовательскую анимацию расширения, и использование ActivityOptionsCompat кажется лучшим для этого способом; однако я не уверен, как написать настраиваемую анимацию перехода, чтобы сделать эффект, который я хочу.

У меня есть кнопка над списком "Открыть" , которая при нажатии сдвигает ListView под ней вниз, расширяя и показывая экран с опциями. Я надеюсь, что этот образ объясняет, что я пытаюсь выполнить.

Развернуть анимацию перехода

То, что я пытаюсь сделать, это:

  • Установите верхнюю панель "Открыть" на верхнюю панель на втором экране "Название" "ФИЛЬТРЫ"
  • Установите высоту высотой 0px, которая находится непосредственно под панелью "Открыть" расширенный список параметров под названием "FRAME"
  • Установите ViewPager на вид высотой 0px под расширенными параметрами называемый "СПИСОК"

Но список не отталкивается, новый экран просто накладывается поверх него.

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() );

Кто-нибудь знает, как выполнить этот стиль переходной анимации?

Спасибо за ваше время и помощь.

Ответы

Ответ 1

Если это не должно быть другой деятельностью, вы можете использовать эту симпатичную библиотеку здесь по 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>

Ответ 2

ActivityOptionsCompat.makeSceneTransitionAnimation() эффективен только на устройствах API 21+. Чтобы просмотреть анимацию, ей необходимо включить переходы на уровне стиля

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

и ему нужно установить одно и то же TransitionName для вызова и вызова представлений макета.

Во всяком случае, переход будет похож на масштаб/масштаб, а не прокрутку.