android viewpager實現(xiàn)豎屏滑動效果
Viewpager 橫向滑動效果系統(tǒng)就自帶了很多種,比如這個
效果
那如果做成豎屏的這種效果呢 。我百度過很多,效果都不是很好,有的代碼特別多而且存在很多問題。我結(jié)合了以前別人的代碼現(xiàn)在來教大家個簡單的實現(xiàn)過程。
首先自定義Viewpager 是肯定必不可少的了
public class VerticalViewPager extends ViewPager { private OnItemClickListener mOnItemClickListener; public VerticalViewPager(Context context) { super(context); init(); } public VerticalViewPager(Context context, AttributeSet attrs) { super(context, attrs); init(); setup(); } private void init() { // The majority of the magic happens here setPageTransformer(true, new VerticalPageTransformer()); // The easiest way to get rid of the overscroll drawing that happens on the left and right setOverScrollMode(OVER_SCROLL_NEVER); } private MotionEvent swapXY(MotionEvent ev) { float width = getWidth(); float height = getHeight(); float newX = (ev.getY() / height) * width; float newY = (ev.getX() / width) * height; ev.setLocation(newX, newY); return ev; } @Override public boolean onInterceptTouchEvent(MotionEvent ev){ boolean intercepted = super.onInterceptTouchEvent(swapXY(ev)); swapXY(ev); // return touch coordinates to original reference frame for any child views return intercepted; } private float scaleY ; @Override public boolean onTouchEvent(MotionEvent ev) { System.out.println("----------getY" + ev.getY()); System.out.println("----------scaleY" + scaleY); if (ev.getAction()==MotionEvent.ACTION_MOVE){ } if (ev.getAction()==MotionEvent.ACTION_DOWN){ scaleY = ev.getY(); } if (ev.getAction()==MotionEvent.ACTION_UP){ if (scaleY == ev.getY()){ System.out.println("------------------======"); scaleY= 0; return false; } } try { return super.onTouchEvent(swapXY(ev)); }catch (Exception e){ } return true; } public void setOnItemClickListener(OnItemClickListener onItemClickListener) { mOnItemClickListener = onItemClickListener; } public interface OnItemClickListener { void onItemClick(int position); } private void setup() { final GestureDetector tapGestureDetector = new GestureDetector(getContext(), new TapGestureListener()); setOnTouchListener(new OnTouchListener() { @Override public boolean onTouch(View v, MotionEvent event) { tapGestureDetector.onTouchEvent(event); return false; } }); } private class TapGestureListener extends GestureDetector.SimpleOnGestureListener { @Override public boolean onSingleTapConfirmed(MotionEvent e) { if(mOnItemClickListener != null) { mOnItemClickListener.onItemClick(getCurrentItem()); } return true; } } }
要實現(xiàn)動畫效果的核心就在 setPageTransformer(true, new VerticalPageTransformer());,大家都知道這個是設置Viewpager 設置動畫的方法 ,那么要實現(xiàn)這個如果用系統(tǒng)自帶的切換動畫效果的話 肯定是不符合Viewpager 豎屏滑動的效果的。所以自定義PageTransformer 就是必然的趨勢了
private class VerticalPageTransformer implements ViewPager.PageTransformer { private float MIN_SCALE = 0.5f; @Override public void transformPage(View view, float position) { if (position < -1) { // [-Infinity,-1) // This page is way off-screen to the left. view.setAlpha(0); }else if (position <= 0) { // [-1,1] view.setAlpha(1 + position); view.setTranslationX(-view.getWidth() * position); view.setPivotY( view.getMeasuredHeight()); view.setPivotX( view.getMeasuredWidth()/2); view.setTranslationY( position * view.getHeight()); float scaleFactor = MIN_SCALE + (1 - MIN_SCALE) * (1 - Math.abs(position)); view.setScaleX(scaleFactor); view.setScaleY(scaleFactor); } else if (position <= 1) { // [-1,1] view.setAlpha(1); view.setTranslationX(-view.getWidth() * position); view.setTranslationY( position * view.getHeight()); float scaleFactor = MIN_SCALE + (1 - MIN_SCALE) * (1 - Math.abs(position)); } else { // (1,+Infinity] view.setAlpha(0); view.setTranslationY( position * view.getHeight()); } } }
重寫transformPage 方法。然后得到如上gif 向左旋轉(zhuǎn)90的效果,剩下的代碼你們看看也就知道是item點擊事件與滑動事件的監(jiān)聽。所以就不細講了
以上就是本文的全部內(nèi)容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。
- Android利用ViewPager實現(xiàn)滑動廣告板實例源碼
- Android App中ViewPager所帶來的滑動沖突問題解決方法
- Android App中使用ViewPager+Fragment實現(xiàn)滑動切換效果
- Android中ViewPager帶來的滑動卡頓問題解決要點解析
- Android開發(fā)之使用ViewPager實現(xiàn)圖片左右滑動切換效果
- Android ViewPager無限循環(huán)實現(xiàn)底部小圓點動態(tài)滑動
- android配合viewpager實現(xiàn)可滑動的標簽欄示例分享
- Android利用ViewPager實現(xiàn)可滑動放大縮小畫廊效果
- Android自定義ViewPager實現(xiàn)縱向滑動翻頁效果
- android viewpager實現(xiàn)豎直滑動效果
相關(guān)文章
Android自定義View實現(xiàn)九宮格圖形解鎖(Kotlin版)
這篇文章主要為大家詳細介紹了Android自定義View實現(xiàn)九宮格圖形解鎖,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下2021-09-09Android通過ksoap2傳遞復雜數(shù)據(jù)類型及CXF發(fā)布的webservice詳細介紹
這篇文章主要介紹了 Android通過ksoap2傳遞復雜數(shù)據(jù)類型詳細介紹的相關(guān)資料,需要的朋友可以參考下2017-02-02Android提高之SurfaceView與多線程的混搭實例
這篇文章主要介紹了Android提高之SurfaceView與多線程的混搭,很實用的功能,需要的朋友可以參考下2014-08-08Android開發(fā)之ContentProvider的使用詳解
本篇文章介紹了Android開發(fā)之ContentProvider的使用詳解。需要的朋友參考下2013-04-04Android來電監(jiān)聽和去電監(jiān)聽實現(xiàn)代碼
本文是關(guān)于來點監(jiān)聽和去電監(jiān)聽展開問題,通過實例代碼講解,對android來電監(jiān)聽和去電監(jiān)聽的相關(guān)知識感興趣的朋友一起看看吧2017-06-06實例講解Android中ContentProvider組件的使用方法
這篇文章主要介紹了Android中ContentProvider組件的使用方法,包括ContentProvider使用單元測試的步驟,需要的朋友可以參考下2016-04-04VS Code開發(fā)React-Native及Flutter 開啟無線局域網(wǎng)安卓真機調(diào)試問題
這篇文章主要介紹了VS Code開發(fā)React-Native,F(xiàn)lutter 開啟無線局域網(wǎng)安卓真機調(diào)試,需要的朋友可以參考下2020-04-04