如何使用可滑动标签实现 PageTransformer答案

【问题标题】：How to Implement PageTransformer with Swipeable Tabs如何使用可滑动标签实现 PageTransformer
【发布时间】：2014-09-27 23:34:09
【问题描述】：

在我的示例代码中，我在 MainActivity.java 中有三个可滑动选项卡，即：Android、IOS 和 WINDOWS，我使用滑动在选项卡之间切换。

现在，我必须用 Swipeable Tabs 实现 PageTransformer，所以在这里我需要你的帮助，是否可能，如果可以，如何？

MainActivity.java:-

    public class MainActivity extends FragmentActivity {
    ViewPager Tab;
    TabPagerAdapter TabAdapter;
    ActionBar actionBar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        TabAdapter = new TabPagerAdapter(getSupportFragmentManager());

        Tab = (ViewPager)findViewById(R.id.pager);
        Tab.setOnPageChangeListener(
                new ViewPager.SimpleOnPageChangeListener() {
                    @Override
                    public void onPageSelected(int position) {

                        actionBar = getActionBar();
                        actionBar.setSelectedNavigationItem(position);                    
                    }
                });
        Tab.setAdapter(TabAdapter);

        ..............
    }
}

这是我想在我的程序中实现的：

这就是我的标签的外观：

【问题讨论】：

按照@Squonk 的建议，您是否关注Customize the Animation with PageTransformer？你遇到什么问题了吗？
@Moon 你能举个例子吗？

标签： android android-viewpager android-tabs android-pagetransformer

【解决方案1】：

你必须使用setPageTransformer() 来做这种类型的导航.. 使用下面的代码到您的寻呼机..

将此代码添加到您的MainActivity.java

Tab = (ViewPager)findViewById(R.id.pager); // you have defined view pager as `TAB`

    Tab.setPageTransformer(false, new PageTransformer() {

            public void transformPage(View page, float position) {

                page.setRotationY(position * -30); // animation style... change as you want..
            }
        });
        Tab.setCurrentItem(pos);
    }

从这里获取更多动画样式..Customize the Animation with PageTransformer 或 ViewPager transitions

【讨论】：

【解决方案2】：

我找到了我的解决方案here，它真的很容易实现

使用非常简单，只需将 PageTransformer 附加到 ViewPager：

viewpager.setPageTransformer(false, new ViewPager.PageTransformer() {
    @Override
    public void transformPage(View page, float position) {
        // do transformation here
        }
});

将页面围绕 Z 轴旋转 30 度；您不需要为此进行标准化。效果类似于封面流UI模式：

@Override
public void transformPage(View page, float position) {
    page.setRotationY(position * -30);
}

这是我使用的最终代码：

viewPager = (ViewPager)findViewById(R.id.pager);

        viewPager.setOnPageChangeListener(
                new ViewPager.SimpleOnPageChangeListener() {
                    @Override
                    public void onPageSelected(int position) {                       
                        actionBar = getActionBar();
                        actionBar.setSelectedNavigationItem(position);                    
                    }
                });

        viewPager.setAdapter(tabAdapter);        
        viewPager.setPageTransformer(false, new PageTransformer() {

            public void transformPage(View page, float position) {

                page.setRotationY(position * -30); // animation style... change as you want..
            }
        });

【讨论】：

【解决方案3】：

为你的Activity创建一个内部类...

public class MyPageTransformer implements ViewPager.PageTransformer {

    public void transformPage(View view, float position) {
        // Do your transform here
    }
}

然后在您的Activity 中，您可以在您的ViewPager 上设置它。示例...

Tab.setPageTransformer(true, new MyPageTransformer());

在Customize the Animation with PageTransformer 上阅读更多信息，甚至还有几个转换示例可供您尝试和自定义。

【讨论】：