Android自定義ViewPager實現縱向滑動翻頁效果
抖音幾乎已經成為了我們日常生活中使用比較頻繁的App，無聊之時或工作之后可以刷一刷短視頻來供我們娛樂與放松?？吹蕉兑舻囊暺燎袚Q效果，覺得用ViewPager可以做出一樣的效果。想一想之前用的ViewPager都是橫向切換的，雖然很經常用，但是從來沒實現過豎向的切換效果，說做就做吧。
我們先看一波效果圖：
那么，要想實現這樣的效果，當然是自定義ViewPager啦。問了一下度娘，看到有這樣一種思路：
首先，把Touch事件的x,y坐標做一下交換，從原先的x坐標差值轉變成y坐標的差值，正符合了我們手指從橫向滑動轉成了縱向滑動。其次，再通過實現PageTransformer接口，改變view的平移方向，便實現了如上效果。
下面我們貼出代碼，并理解一下整個實現過程。
public class VerticalViewPager extends ViewPager {
public VerticalViewPager(Context context) {
super(context);
}
public VerticalViewPager(Context context, AttributeSet attrs) {
super(context, attrs);
}
@Override
public boolean onTouchEvent(MotionEvent ev) {
return super.onTouchEvent(swapTouchEvent(MotionEvent.obtain(ev)));
}
@Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
return super.onInterceptTouchEvent(swapTouchEvent(MotionEvent.obtain(ev)));
}
private MotionEvent swapTouchEvent(MotionEvent event) {
float width = getWidth();
float height = getHeight();
event.setLocation((event.getY() / height) * width, ((event.getX() / width) * height));
return event;
}
}
首先，我們自定義一個繼承ViewPager的類，我們重點關注一下swapTouchEvent()方法。這個方法是將MotionEvent事件的x坐標換成y坐標，而y坐標換成x坐標。當然，這個是參考百度的，我們理解了就好。其實現實在妙不可言！
public class VerticalPageTransformer implements ViewPager.PageTransformer {
@Override
public void transformPage(View view, float position) {
/**
* 0 當前界面
* -1 前一頁
* 1 后一頁
*/
if (position >= -1 && position <= 1) {
view.setTranslationX(view.getWidth() * -position);
float yPosition = position * view.getHeight();
view.setTranslationY(yPosition);
}
}
}
上部分代碼，實現了界面由原來的橫向平移到縱向平移的過程。其思路是這樣的，我畫了一個草圖（湊合看，畢竟連幼兒園都沒畢業(yè)，畫畫功底~~）
這張圖描述了我們手機的屏幕，我們知道ViewPager，默認是把三個界面橫向著排一起的，現在我們將其改為縱向的。
如果手指向下滑動，也就是第一個界面（綠色的），它將會進入到我們的屏幕，然而當前頁（紅色的）將退出屏幕，這是一套完整的流程，手指向上滑動，則方向相反。
view.setTranslationX(view.getWidth() * -position); float yPosition = position * view.getHeight(); view.setTranslationY(yPosition);
這是對ViewPager中所有子View的x,y坐標進行平移使它能夠排成縱向一排。代碼不難，就是對x,y坐標的平移處理。例如：
綠色的：它的position為-1，對y坐標而言,平移它的view高度。也就是-height，對x坐標而言，則平移它的width*-position，那它就跑到紅色的頭上了，現在我們往下滑動手指，它就進入屏幕了。
總體來說，大致實現就是這樣，只要理清思路便可以很快的理解。
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。
相關文章
這篇文章主要為大家詳細介紹了android實現直播點贊飄心動畫效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-03-03
這篇文章主要介紹了Android自定義view實現滑動解鎖九宮格控件，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習吧2023-02-02
這篇文章主要為大家詳細介紹了android實現簡單的活動轉盤，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-10-10
這篇文章主要為大家介紹了Android類加載ClassLoader雙親委托機制詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-07-07
Android中ListView綁定CheckBox實現全選增加和刪除功能(DEMO)
本文通過實例給大家講解了Android中ListView綁定CheckBox實現全選增加和刪除功能(DEMO)的代碼,對android checkbox全選相關知識感興趣的朋友一起學習吧2016-08-08
這篇文章主要介紹了Android中Activity的生命周期探討,本文同時講解了銷毀Activity、暫停與恢復、停止與重啟Activity等內容,需要的朋友可以參考下2014-10-10
這篇文章主要介紹了Android通知欄前臺服務的實現，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-03-03
這篇文章主要介紹了Android 獲取手機信息實例詳解的相關資料,這里附有實例代碼及實現效果圖，需要的朋友可以參考下2017-01-01
定義對象間一種一對多的依賴關系，使得當一個對象改變狀態(tài)，則所有依賴于它的對象都會得到通知并被自動更新等等，需要了解的朋友可以參考下2013-01-01
這篇文章主要介紹了Android仿QQ空間動態(tài)界面分享功能,本文圖文并茂給大家介紹的非常詳細，需要的朋友可以參考下2017-04-04