Android 頁面滑動切換（類Launcher滑動屏幕實現）
下面的這個例子也是從網上找來的，不是自己寫的，一直想學習下，但是一直沒有寫，以前也研究研究的是launcher的頁面跳轉，launcher修改--左右滑動屏幕切換源碼追蹤說實話，那個代碼有點復雜，所以理解的也不是很透徹。看到這個例子，比較簡單些，再這里學習下：
首先，看下效果圖吧：雖然很花哨，都是背景圖片。
看下他的布局文件：
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<com.genius.scroll.MyScrollLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/ScrollLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<FrameLayout
android:background="@drawable/guide01"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
</FrameLayout>
<FrameLayout
android:background="@drawable/guide02"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
</FrameLayout>
<FrameLayout
android:background="@drawable/guide03"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
</FrameLayout>
<FrameLayout
android:background="@drawable/guide04"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
</FrameLayout>
<FrameLayout
android:background="@drawable/guide05"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
</FrameLayout>
</com.genius.scroll.MyScrollLayout>
<LinearLayout
android:orientation="horizontal"
android:id="@+id/llayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="24.0dip"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true">
<ImageView android:clickable="true"
android:padding="15.0dip"
android:layout_gravity="center_vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/guide_round" />
<ImageView android:clickable="true"
android:padding="15.0dip"
android:layout_gravity="center_vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/guide_round" />
<ImageView android:clickable="true"
android:padding="15.0dip"
android:layout_gravity="center_vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/guide_round" />
<ImageView android:clickable="true"
android:padding="15.0dip"
android:layout_gravity="center_vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/guide_round" />
<ImageView android:clickable="true"
android:padding="15.0dip"
android:layout_gravity="center_vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/guide_round" />
</LinearLayout>
</RelativeLayout>
底部的LinearLayout是放了5個按鈕，上面使用到了一個自定義的控件：MyScrollLayout下面再看下這個自定義控件：里面使用frameLayout放了5張圖片。
public class MyScrollLayout extends ViewGroup{
private static final String TAG = "ScrollLayout";
private VelocityTracker mVelocityTracker; // 用于判斷甩動手勢
private static final int SNAP_VELOCITY = 600;
private Scroller mScroller; // 滑動控制器
private int mCurScreen;
private int mDefaultScreen = 0;
private float mLastMotionX;
private OnViewChangeListener mOnViewChangeListener;
public MyScrollLayout(Context context) {
super(context);
init(context);
}
public MyScrollLayout(Context context, AttributeSet attrs) {
super(context, attrs);
init(context);
}
public MyScrollLayout(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
init(context);
}
private void init(Context context)
{
mCurScreen = mDefaultScreen;
mScroller = new Scroller(context);
}
@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
// TODO Auto-generated method stub
if (changed) {
int childLeft = 0;
final int childCount = getChildCount();
for (int i=0; i<childCount; i++) {
final View childView = getChildAt(i);
if (childView.getVisibility() != View.GONE) {
final int childWidth = childView.getMeasuredWidth();
childView.layout(childLeft, 0,
childLeft+childWidth, childView.getMeasuredHeight());
childLeft += childWidth;
}
}
}
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
// TODO Auto-generated method stub
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
final int width = MeasureSpec.getSize(widthMeasureSpec);
final int widthMode = MeasureSpec.getMode(widthMeasureSpec);
final int count = getChildCount();
for (int i = 0; i < count; i++) {
getChildAt(i).measure(widthMeasureSpec, heightMeasureSpec);
}
scrollTo(mCurScreen * width, 0);
}
public void snapToDestination() {
final int screenWidth = getWidth();
final int destScreen = (getScrollX()+ screenWidth/2)/screenWidth;
snapToScreen(destScreen);
}
public void snapToScreen(int whichScreen) {
// get the valid layout page
whichScreen = Math.max(0, Math.min(whichScreen, getChildCount()-1));
if (getScrollX() != (whichScreen*getWidth())) {
final int delta = whichScreen*getWidth()-getScrollX();
mScroller.startScroll(getScrollX(), 0,
delta, 0, Math.abs(delta)*2);
mCurScreen = whichScreen;
invalidate(); // Redraw the layout
if (mOnViewChangeListener != null)
{
mOnViewChangeListener.OnViewChange(mCurScreen);
}
}
}
@Override
public void computeScroll() {
// TODO Auto-generated method stub
if (mScroller.computeScrollOffset()) {
scrollTo(mScroller.getCurrX(), mScroller.getCurrY());
postInvalidate();
}
}
@Override
public boolean onTouchEvent(MotionEvent event) {
// TODO Auto-generated method stub
final int action = event.getAction();
final float x = event.getX();
final float y = event.getY();
switch (action) {
case MotionEvent.ACTION_DOWN:
Log.i("", "onTouchEvent ACTION_DOWN");
if (mVelocityTracker == null) {
mVelocityTracker = VelocityTracker.obtain();
mVelocityTracker.addMovement(event);
}
if (!mScroller.isFinished()){
mScroller.abortAnimation();
}
mLastMotionX = x;
break;
case MotionEvent.ACTION_MOVE:
int deltaX = (int)(mLastMotionX - x);
if (IsCanMove(deltaX)){
if (mVelocityTracker != null){
mVelocityTracker.addMovement(event);
}
mLastMotionX = x;
scrollBy(deltaX, 0);
}
break;
case MotionEvent.ACTION_UP:
int velocityX = 0;
if (mVelocityTracker != null){
mVelocityTracker.addMovement(event);
mVelocityTracker.computeCurrentVelocity(1000);
velocityX = (int) mVelocityTracker.getXVelocity();
}
if (velocityX > SNAP_VELOCITY && mCurScreen > 0) {
Log.e(TAG, "snap left");
snapToScreen(mCurScreen - 1);
} else if (velocityX < -SNAP_VELOCITY
&& mCurScreen < getChildCount() - 1) {
Log.e(TAG, "snap right");
snapToScreen(mCurScreen + 1);
} else {
snapToDestination();
}
if (mVelocityTracker != null) {
mVelocityTracker.recycle();
mVelocityTracker = null;
}
break;
}
return true;
}
private boolean IsCanMove(int deltaX)
{
if (getScrollX() <= 0 && deltaX < 0 ){
return false;
}
if (getScrollX() >= (getChildCount() - 1) * getWidth() && deltaX > 0){
return false;
}
return true;
}
public void SetOnViewChangeListener(OnViewChangeListener listener)
{
mOnViewChangeListener = listener;
}
}
首先注意，他繼承了ViewGroup類，在這里面主要重寫了onMeasure()、onTouchEvent()等方法，在這里使用了一個自定義的接口private OnViewChangeListener mOnViewChangeListener。看下它的定義：
public interface OnViewChangeListener {
public void OnViewChange(int view);
}
這個接口里之定義了一個回調方法：OnViewChange()這個方法的具體實現，是在主Activity中：
public class SwitchViewDemoActivity extends Activity implements OnViewChangeListener, OnClickListener{
/** Called when the activity is first created. */
private MyScrollLayout mScrollLayout;
private ImageView[] mImageViews;
private int mViewCount;
private int mCurSel;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
init();
}
private void init()
{
mScrollLayout = (MyScrollLayout) findViewById(R.id.ScrollLayout);
LinearLayout linearLayout = (LinearLayout) findViewById(R.id.llayout);
mViewCount = mScrollLayout.getChildCount();
mImageViews = new ImageView[mViewCount];
for(int i = 0; i < mViewCount; i++) {
mImageViews[i] = (ImageView) linearLayout.getChildAt(i);
mImageViews[i].setEnabled(true);
mImageViews[i].setOnClickListener(this);
mImageViews[i].setTag(i);
}
mCurSel = 0;
mImageViews[mCurSel].setEnabled(false);
mScrollLayout.SetOnViewChangeListener(this);
}
private void setCurPoint(int index)
{
if (index < 0 || index > mViewCount - 1 || mCurSel == index) {
return ;
}
mImageViews[mCurSel].setEnabled(true);
mImageViews[index].setEnabled(false);
mCurSel = index;
}
@Override
public void OnViewChange(int view) {
// TODO Auto-generated method stub
setCurPoint(view);
}
@Override
public void onClick(View v) {
// TODO Auto-generated method stub
int pos = (Integer)(v.getTag());
setCurPoint(pos);
mScrollLayout.snapToScreen(pos);
}
}
這個OnViewChange()方法，主要調用了setCurPoint()方法，就是完成界面的跳轉。在MyScrollLayout中的snapToScreen()方法中就是典型的回調方法：
public void snapToScreen(int whichScreen) {
// get the valid layout page
whichScreen = Math.max(0, Math.min(whichScreen, getChildCount()-1));
if (getScrollX() != (whichScreen*getWidth())) {
final int delta = whichScreen*getWidth()-getScrollX();
mScroller.startScroll(getScrollX(), 0,
delta, 0, Math.abs(delta)*2);
mCurScreen = whichScreen;
invalidate(); // Redraw the layout
if (mOnViewChangeListener != null)
{
mOnViewChangeListener.OnViewChange(mCurScreen);
}
}
}
mOnViewChangeListener.OnViewChange(mCurScreen);
這句代碼就是典型的回調。
在MyScrollLayout的onTouchEvent()的方法里面是對觸屏事件做出的響應：
final int action = event.getAction();
final float x = event.getX();
final float y = event.getY();
switch (action) {
case MotionEvent.ACTION_DOWN:
Log.i("", "onTouchEvent ACTION_DOWN");
if (mVelocityTracker == null) {
mVelocityTracker = VelocityTracker.obtain();
mVelocityTracker.addMovement(event);
}
if (!mScroller.isFinished()){
mScroller.abortAnimation();
}
mLastMotionX = x;
break;
case MotionEvent.ACTION_MOVE:
int deltaX = (int)(mLastMotionX - x);
if (IsCanMove(deltaX)){
if (mVelocityTracker != null){
mVelocityTracker.addMovement(event);
}
mLastMotionX = x;
scrollBy(deltaX, 0);
}
break;
case MotionEvent.ACTION_UP:
int velocityX = 0;
if (mVelocityTracker != null){
mVelocityTracker.addMovement(event);
mVelocityTracker.computeCurrentVelocity(1000);
velocityX = (int) mVelocityTracker.getXVelocity();
}
if (velocityX > SNAP_VELOCITY && mCurScreen > 0) {
Log.e(TAG, "snap left");
snapToScreen(mCurScreen - 1);
} else if (velocityX < -SNAP_VELOCITY
&& mCurScreen < getChildCount() - 1) {
Log.e(TAG, "snap right");
snapToScreen(mCurScreen + 1);
} else {
snapToDestination();
}
if (mVelocityTracker != null) {
mVelocityTracker.recycle();
mVelocityTracker = null;
}
break;
}
通過判斷移動距離和移動方向做出不同的響應。
其他的代碼都比較好懂了，有什么問題歡迎大家討論，下面是代碼的下載地址：
本文由用戶 jopen 自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。
轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。
本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！