如何使用可滑动选项卡实现PageTransformer

时间:2014-08-05 10:27:37

标签: android android-viewpager android-tabs android-pagetransformer

在我的示例代码中,我在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);

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

以下是我想在我的程序中实现的内容:

enter image description here

这就是我的Tab的样子:

enter image description here

3 个答案:

答案 0 :(得分:5)

您必须使用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 PageTransformerViewPager transitions

答案 1 :(得分:1)

我找到了我的解决方案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..
            }
        });

答案 2 :(得分:0)

创建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阅读更多内容甚至还有几个变换示例可以尝试并自定义。