3

我希望模仿您在 Play Music 应用的播放器界面中看到的 ViewPager 过渡动画。看起来像这样。

动画画面

现在，可以使用此处描述的自定义 PageTransformer 轻松完成放大/淡入动画，困难的部分只是带有歌曲信息和内容的顶部栏。这个就像普通的 ViewPager 一样滑入。

在我看来，谷歌似乎正在以某种方式将两个 PageTransformer 组合用于布局的不同部分（1. 顶部栏，2. 封面艺术）。我不知道该怎么做，甚至可能。我可以想象开发人员这样做的另一种方法是拥有两个 ViewPager。一个用于歌曲信息栏，一个用于隐蔽艺术，然后共享触摸事件以同时滑动/动画。然而，对我来说，这听起来有点不方便，就像会使用大量 CPU 的东西。

有什么建议么？

4

1 回答 1

4

APageTransformer不必影响整体View，毕竟是你来定义发生的事情。考虑到Fragments内部的布局ViewPager看起来像这样：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/root"    
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <RelativeLayout
        android:id="@+id/top_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        ...

    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/content"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        ...

    </RelativeLayout>

</LinearLayout>

如您所见，有两个不同RelativeLayouts的，它们都有一个 id。有了它，您可以调用内部并findViewById()以不同的方式转换布局的不同部分！ViewPageTransformer

public class ExampleTransformer implements ViewPager.PageTransformer {

    public void transformPage(View view, float position) {

        View topBar = view.findViewById(R.id.top_bar);
        View content = view.findViewById(R.id.content);

        if (position < -1) {
            content.setAlpha(0);    
        } else if (position <= 1) {
            // Now you can fade the content without affecting the topBar
            content.setAlpha(...);

            // And by setting the translation on the root view you 
            // can move everything at the same time
            view.setTranslationX(...);
        } else {
            content.setAlpha(0);
        }
    }
}

我希望我能帮助你，如果你有任何进一步的问题，请随时提问！

于 2014-07-16T12:15:55.307 回答