Android實現(xiàn)View滑動效果的6種方法
本文實例為大家分享了Android實現(xiàn)View滑動效果的具體代碼,供大家參考,具體內(nèi)容如下
一、View的滑動簡介
View的滑動是Android實現(xiàn)自定義控件的基礎,同時在開發(fā)中我們也難免會遇到View的滑動的處理。其實不管是那種滑動的方式基本思想都是類似的:當觸摸事件傳到View時,系統(tǒng)記下觸摸點的坐標,手指移動時系統(tǒng)記下移動后的觸摸的坐標并算出偏移量,并通過偏移量來修改View的坐標。
實現(xiàn)View滑動有很多種方法,這篇文章主要講解六種滑動的方法,分別是:layout()、offsetLeftAndRight()與offsetTopAndBottom()、LayoutParams、動畫、scollTo與scollBy和Scroller;在下一篇文章我們會詳細介紹屬性動畫。
二、實現(xiàn)View滑動的六種方法
2.1 layout()
view進行繪制的時候會調用onLayout()方法來設置顯示的位置,因此我們同樣也可以通過修改View的left、top、right、bottom這四種屬性來控制View的坐標。首先我們要自定義一個View,在onTouchEvent()方法中獲取觸摸點的坐標:
public boolean onTouchEvent(MotionEvent event) { //獲取到手指處的橫坐標和縱坐標 int x = (int) event.getX(); int y = (int) event.getY(); switch (event.getAction()) { case MotionEvent.ACTION_DOWN: lastX = x; lastY = y; break;
接下來我們在ACTION_MOVE事件中計算偏移量,再調用layout()方法重新放置這個自定義View的位置就好了:
case MotionEvent.ACTION_MOVE: //計算移動的距離 int offsetX = x - lastX; int offsetY = y - lastY; //調用layout方法來重新放置它的位置 layout(getLeft()+offsetX, getTop()+offsetY, getRight()+offsetX , getBottom()+offsetY); break;
當我們每次移動時都會調用layout()方法來對自己重新布局,從而達到移動View的效果。
自定義View的全部代碼(CustomView.java):
package com.example.liuwangshu.moonviewslide; import android.content.Context; import android.util.AttributeSet; import android.view.MotionEvent; import android.view.View; public class CustomView extends View { private int lastX; private int lastY; public CustomView(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); } public CustomView(Context context, AttributeSet attrs) { super(context, attrs); } public CustomView(Context context) { super(context); } public boolean onTouchEvent(MotionEvent event) { //獲取到手指處的橫坐標和縱坐標 int x = (int) event.getX(); int y = (int) event.getY(); switch (event.getAction()) { case MotionEvent.ACTION_DOWN: lastX = x; lastY = y; break; case MotionEvent.ACTION_MOVE: //計算移動的距離 int offsetX = x - lastX; int offsetY = y - lastY; //調用layout方法來重新放置它的位置 layout(getLeft()+offsetX, getTop()+offsetY, getRight()+offsetX , getBottom()+offsetY); break; } return true; } }
布局中引用自定義View:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <com.example.liuwangshu.moonviewslide.CustomView android:id="@+id/customview" android:layout_width="80dp" android:layout_height="80dp" android:layout_margin="50dp" android:background="@android:color/holo_red_light" /> </LinearLayout>
2.2 offsetLeftAndRight()與offsetTopAndBottom()
這兩種方法和layout()方法效果方法差不多,使用也差不多,我們將ACTION_MOVE中的代碼替換成如下代碼:
case MotionEvent.ACTION_MOVE: //計算移動的距離 int offsetX = x - lastX; int offsetY = y - lastY; //對left和right進行偏移 offsetLeftAndRight(offsetX); //對top和bottom進行偏移 offsetTopAndBottom(offsetY); break;
2.3 LayoutParams(改變布局參數(shù))
LayoutParams主要保存了一個View的布局參數(shù),因此我們可以通過LayoutParams來改變View的布局的參數(shù)從而達到了改變View的位置的效果。同樣的我們將ACTION_MOVE中的代碼替換成如下代碼:
LinearLayout.LayoutParams layoutParams= (LinearLayout.LayoutParams) getLayoutParams(); layoutParams.leftMargin = getLeft() + offsetX; layoutParams.topMargin = getTop() + offsetY; setLayoutParams(layoutParams);
因為父控件是LinearLayout,所以我們用了LinearLayout.LayoutParams,如果父控件是RelativeLayout則要使用RelativeLayout.LayoutParams。除了使用布局的LayoutParams外,我們還可以用ViewGroup.MarginLayoutParams來實現(xiàn):
ViewGroup.MarginLayoutParams layoutParams = (ViewGroup.MarginLayoutParams) getLayoutParams(); layoutParams.leftMargin = getLeft() + offsetX; layoutParams.topMargin = getTop() + offsetY; setLayoutParams(layoutParams);
2.4 動畫
可以采用View動畫來移動,在res目錄新建anim文件夾并創(chuàng)建translate.xml:
<?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://schemas.android.com/apk/res/android"> <translate android:fromXDelta="0" android:toXDelta="300" android:duration="1000"/> </set>
在Java代碼中引用:
mCustomView.setAnimation(AnimationUtils.loadAnimation(this, R.anim.translate));
當然使用屬性動畫移動那就更簡單了,我們讓CustomView在1000毫秒內(nèi)沿著X軸像右平移300像素:
ObjectAnimator.ofFloat(mCustomView,"translationX",0,300).setDuration(1000).start();
2.5 scollTo與scollBy
scollTo(x,y)表示移動到一個具體的坐標點,而scollBy(dx,dy)則表示移動的增量為dx、dy。其中scollBy最終也是要調用scollTo的。scollTo、scollBy移動的是View的內(nèi)容,如果在ViewGroup中使用則是移動他所有的子View。我們將ACTION_MOVE中的代碼替換成如下代碼:
((View)getParent()).scrollBy(-offsetX,-offsetY);
這里要實現(xiàn)CustomView隨著我們手指移動的效果的話,我們就需要將偏移量設置為負值。
2.6 Scroller
我們用scollTo/scollBy方法來進行滑動時,這個過程是瞬間完成的,所以用戶體驗不大好。這里我們可以使用Scroller來實現(xiàn)有過度效果的滑動,這個過程不是瞬間完成的,而是在一定的時間間隔完成的。Scroller本身是不能實現(xiàn)View的滑動的,它需要配合View的computeScroll()方法才能彈性滑動的效果。
在這里我們實現(xiàn)CustomView平滑的向右移動。
首先我們要初始化Scroller:
public CustomView(Context context, AttributeSet attrs) { super(context, attrs); mScroller = new Scroller(context); }
接下來重寫computeScroll()方法,系統(tǒng)會在繪制View的時候在draw()方法中調用該方法,這個方法中我們調用父類的scrollTo()方法并通過Scroller來不斷獲取當前的滾動值,每滑動一小段距離我們就調用invalidate()方法不斷的進行重繪,重繪就會調用computeScroll()方法,這樣我們就通過不斷的移動一個小的距離并連貫起來就實現(xiàn)了平滑移動的效果:
@Override public void computeScroll() { super.computeScroll(); if(mScroller.computeScrollOffset()){ ((View) getParent()).scrollTo(mScroller.getCurrX(),mScroller.getCurrY()); //通過不斷的重繪不斷的調用computeScroll方法 invalidate(); } }
調用Scroller.startScroll()方法。我們在CustomView中寫一個smoothScrollTo()方法,調用Scroller.startScroll()方法,在2000毫秒內(nèi)沿X軸平移delta像素:
public void smoothScrollTo(int destX,int destY){ int scrollX=getScrollX(); int delta=destX-scrollX; //1000秒內(nèi)滑向destX mScroller.startScroll(scrollX,0,delta,0,2000); invalidate(); }
最后我們在ViewSlideActivity.java中調用CustomView的smoothScrollTo()方法
//使用Scroll來進行平滑移動 mCustomView.smoothScrollTo(-400,0);
這里我們是設定CustomView沿著X軸向右平移400像素。
以上就是本文的全部內(nèi)容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。
- Android自定義view實現(xiàn)滑動解鎖效果
- Android實現(xiàn)小米相機底部滑動指示器
- Android自定義SeekBar實現(xiàn)滑動驗證且不可點擊
- Android SeekBar實現(xiàn)禁止滑動
- Android實現(xiàn)一個比相冊更高大上的左右滑動特效(附源碼)
- Android 滑動Scrollview標題欄漸變效果(仿京東toolbar)
- Android RecycleView滑動停止后自動吸附效果的實現(xiàn)代碼(滑動定位)
- Android實現(xiàn)上下菜單雙向滑動
- Android實現(xiàn)滑動效果
- Android實現(xiàn)手勢滑動(左滑和右滑)
- Android RecyclerView實現(xiàn)滑動刪除
- 詳解Android使用CoordinatorLayout+AppBarLayout+CollapsingToolbarLayou實現(xiàn)手指滑動效果
- Android實現(xiàn)三段式滑動效果
相關文章
Android下Activity間通信序列化過程中的深淺拷貝淺析
這篇文章主要給大家介紹了關于Android下Activity間通信序列化過程中深淺拷貝的相關資料,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧。2017-10-10Android自定義View實現(xiàn)支付寶咻一咻效果
這篇文章主要為大家詳細介紹了Android自定義View實現(xiàn)支付寶咻一咻效果的相關資料,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-02-02Flutter中實現(xiàn)交互式Webview的方法詳解
Flutter是一款強大的跨平臺移動應用開發(fā)框架,而Webview則是在應用中展示W(wǎng)eb內(nèi)容的重要組件,本文將介紹如何在Flutter應用中實現(xiàn)交互式的Webview,快跟隨小編一起學習一下吧2023-09-09詳解Kotlin Android開發(fā)中的環(huán)境配置
這篇文章主要介紹了詳解Kotlin Android開發(fā)中的環(huán)境配置的相關資料,需要的朋友可以參考下2017-06-06android RecycleView實現(xiàn)下拉刷新和上拉加載
這篇文章主要為大家詳細介紹了android RecycleView實現(xiàn)下拉刷新和上拉加載,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下2020-06-06