美文网首页
可直接自定义垂直或者水平滑动的ViewPager

可直接自定义垂直或者水平滑动的ViewPager

作者: 壹树YS | 来源:发表于2017-11-07 23:25 被阅读0次

最近在做项目总发现了一个好用的ViewPager,经过我的一些简单改造,可以直接设置在布局的XML设置ViewPager的滑动样式。
废话不多说,直接上代码。

我们的Java代码如下:

    import android.content.Context;
    import android.content.res.TypedArray;
    import android.support.v4.view.ViewPager;
    import android.util.AttributeSet;
    import android.view.MotionEvent;
    import android.view.View;        

    public class CustomViewPager extends ViewPager {
        public static final int SCROLL_MODE_HORIZONTAL = 0;
        public static final int SCROLL_MODE_VERTICAL = 1;
    
        private int orientationStyle;
    
        private float touchX;
        private float touchY;
        private float ratio = -1f;
    
    
        public CustomViewPager(Context context, AttributeSet attrs) {
            super(context, attrs);
            init(context, attrs);
        }
    
        private void init(Context context, AttributeSet attrs) {
            TypedArray t = context.obtainStyledAttributes(attrs, R.styleable.CustomViewPager);
            orientationStyle = t.getInt(R.styleable.CustomViewPager_app_layout_orientation, 0);
            t.recycle();
            setScrollModeHorizontal(orientationStyle);
        }
    
        public void setScrollModeHorizontal(int mode){
            if (mode == SCROLL_MODE_VERTICAL){
                setOverScrollMode(ViewPager.OVER_SCROLL_NEVER);
                setPageTransformer(true, new VerticalPageTransformer());
            }
            orientationStyle = mode;
        }
    
        private class VerticalPageTransformer implements ViewPager.PageTransformer {
            @Override
            public void transformPage(View view, float position) {
                if (position <= 1) {
                    view.setAlpha(1);
                    view.setTranslationX(view.getWidth() * -position);
                    //set Y position to swipe in from top
                    float yPosition = position * view.getHeight();
                    view.setTranslationY(yPosition);
    
                } else {
                    view.setAlpha(0);
                }
            }
        }
    
        @Override
        public boolean onInterceptTouchEvent(MotionEvent event) {
            return super.onInterceptTouchEvent(customTouchEvent(MotionEvent.obtain(event)));
        }
    
        private MotionEvent customTouchEvent(MotionEvent ev) {
            if (orientationStyle == SCROLL_MODE_VERTICAL){
                if (ratio == -1) {
                    ratio = (float) getWidth() / getHeight();
                }
                touchX = ev.getX();
                touchY = ev.getY();
                ev.setLocation(touchY * ratio, touchX / ratio);
            }
            return ev;
        }
    
        @Override
        public boolean onTouchEvent(MotionEvent ev) {
            return super.onTouchEvent(customTouchEvent(ev));
        }
    }

在你的attrs.xml文件中添加如下定义:

<declare-styleable name="CustomViewPager">
    <attr name="app_layout_orientation" format="enum">
        <enum name="horizontal" value="0"></enum>
        <enum name="vertical" value="1"></enum>
    </attr>
</declare-styleable>

最后你就可以愉快的在你的布局中设置了

示例代码如下

     <?xml version="1.0" encoding="utf-8"?>
      <FrameLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:orientation="vertical"
    
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    
        <com.aquila.custom.widget.view.CustomViewPager
            android:id="@+id/second_vertical_ViewPager"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
   
            app:app_layout_orientation="vertical"
            />
    </FrameLayout>

以上就是这样。

相关文章

网友评论

      本文标题:可直接自定义垂直或者水平滑动的ViewPager

      本文链接:https://www.haomeiwen.com/subject/weusmxtx.html