`
夏文权
  • 浏览: 245400 次
  • 性别: Icon_minigender_1
  • 来自: 贵州
社区版块
存档分类
最新评论

左右滑动的布局

 
阅读更多 
最关键的代码：

package com.dianxing.dialog;

import android.content.Context;
import android.util.AttributeSet;
import android.util.Log;
import android.view.MotionEvent;
import android.view.VelocityTracker;
import android.view.View;
import android.view.ViewConfiguration;
import android.view.ViewGroup;
import android.widget.Scroller;

public class  ScrollLayout extends ViewGroup {

	private static final String TAG = "ScrollLayout";
	private Scroller mScroller;
	private VelocityTracker mVelocityTracker;
	
	private  int mCurScreen;
	private int mDefaultScreen = 0;
	
	private static final int TOUCH_STATE_REST = 0;
	private static final int TOUCH_STATE_SCROLLING = 1;
	
	private static final int SNAP_VELOCITY = 600;
	
	private int mTouchState = TOUCH_STATE_REST;
	private int mTouchSlop;
	private float mLastMotionX;
	private float mLastMotionY;
	private OnCurrentViewChangedListener mOnCurrentViewChangedListener;
	
	public OnCurrentViewChangedListener getmOnCurrentViewChangedListener() {
		return mOnCurrentViewChangedListener;
	}

	public void setmOnCurrentViewChangedListener(
			OnCurrentViewChangedListener mOnCurrentViewChangedListener) {
		this.mOnCurrentViewChangedListener = mOnCurrentViewChangedListener;
	}

	public interface OnCurrentViewChangedListener {

		public void onCurrentViewChanged(View view, int currentview);
	}
	
	public ScrollLayout(Context context, AttributeSet attrs) {
		this(context, attrs, 0);
		// TODO 再执行这个函数		
		Log.i(TAG, "ScrollLayout(1)");
	}

	public ScrollLayout(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
		// TODO 首先执行这个函数
		Log.i(TAG, "ScrollLayout(2)");
		mScroller = new Scroller(context);
		
		mCurScreen = mDefaultScreen;
		mTouchSlop = ViewConfiguration.get(getContext()).getScaledTouchSlop();
		Log.i(TAG, "mTouchSlop ===== " + mTouchSlop);
	}

	@Override
	protected void onLayout(boolean changed, int l, int t, int r, int b) {
		// TODO Auto-generated method stub
		Log.i(TAG, "onLayout");
		Log.i(TAG, "changed === " + changed);
		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();
					Log.i(TAG, "childView.getMeasuredWidth() === " + childView.getMeasuredWidth());
					childView.layout(childLeft, 0, childLeft+childWidth, childView.getMeasuredHeight());
					Log.i(TAG, "childView.getMeasuredHeight() === " + childView.getMeasuredHeight());
							
					childLeft += childWidth;
					Log.i(TAG, "childLeft === " + childLeft);
				}
			}
		}
	}


    @Override  
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {   
    	Log.e(TAG, "onMeasure");
    	Log.e(TAG, "onMeasure widthMeasureSpec === " + widthMeasureSpec);
    	Log.e(TAG, "onMeasure heightMeasureSpec ==== " + heightMeasureSpec);
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);   
  
        final int width = MeasureSpec.getSize(widthMeasureSpec); 
        Log.e(TAG, "width ==onMeasure== " + width);
        final int widthMode = MeasureSpec.getMode(widthMeasureSpec);   
        Log.e(TAG, "widthMode ==onMeasure== " + widthMode);
//        if (widthMode != MeasureSpec.EXACTLY) {   
//            throw new IllegalStateException("ScrollLayout only canmCurScreen run at EXACTLY mode!"); 
//        }   
  
        final int heightMode = MeasureSpec.getMode(heightMeasureSpec);   
        Log.e(TAG, "heightMode ==onMeasure== " + heightMode);
//        if (heightMode != MeasureSpec.EXACTLY) {   
//            throw new IllegalStateException("ScrollLayout only can run at EXACTLY mode!");
//        }   
  
        // The children are given the same width and height as the scrollLayout   
        final int count = getChildCount();  
        Log.i(TAG, "count = getChildCount()  ===== " + count);
        for (int i = 0; i < count; i++) {   
            getChildAt(i).measure(widthMeasureSpec, heightMeasureSpec);   
        }   
        // Log.e(TAG, "moving to screen "+mCurScreen);   
        scrollTo(mCurScreen * width, 0);         
    }  
    
    /**
     * According to the position of current layout
     * scroll to the destination page.
     */
    public void snapToDestination() {
    	final int screenWidth = getWidth();
    	Log.i(TAG, "screenWidth ==snapToDestination== " + screenWidth);
    	final int destScreen = (getScrollX()+ screenWidth/2)/screenWidth;
    	Log.i(TAG, "destScreen ==snapToDestination== " + destScreen);
    	snapToScreen(destScreen);
    }
    
    public void snapToScreen(int whichScreen) {
    	// get the valid layout page
    	whichScreen = Math.max(0, Math.min(whichScreen, getChildCount()-1));
    	Log.i(TAG, "whichScreen ==== " + whichScreen);
    	Log.i(TAG, "getScrollX() ==== " + getScrollX());
    	Log.i(TAG, "whichScreen*getWidth() ==== " + whichScreen*getWidth());
    	if (getScrollX() != (whichScreen*getWidth())) {
    		
    		final int delta = whichScreen*getWidth()-getScrollX();
    		Log.i(TAG, "delta ===== " + delta);
    		mScroller.startScroll(getScrollX(), 0, delta, 0, Math.abs(delta)*2);
    		mCurScreen = whichScreen;
    		Log.i(TAG, "mCurScreen = whichScreen =====  " + mCurScreen );
    		
    		
    		// 这里监听是为了在滑动的时候能改变的button的图�?    		
    		if (mOnCurrentViewChangedListener != null) {
    			mOnCurrentViewChangedListener.onCurrentViewChanged(this,mCurScreen);
    		}
    		invalidate();		// Redraw the layout
    	}
    }
    
    public void setToScreen(int whichScreen) {
    	Log.i(TAG, "whichScreen ==setToScreen== " + whichScreen);
    	whichScreen = Math.max(0, Math.min(whichScreen, getChildCount()-1));
    	mCurScreen = whichScreen;
    	scrollTo(whichScreen*getWidth(), 0);
    	// TODO 在这里做监听主要是为了点击button的时候，能够把当前的mCurScreen传给mOnCurrentViewChangedListener，使得达到改变图片的状
    	if (mOnCurrentViewChangedListener != null) {
			mOnCurrentViewChangedListener.onCurrentViewChanged(this,mCurScreen);
		}
    }
    
    public int getCurScreen() {
    	return mCurScreen;
    }
    
	@Override
	public void computeScroll() {
		// TODO Auto-generated method stub
		Log.i(TAG, "computeScroll()");
		if (mScroller.computeScrollOffset()) {
			scrollTo(mScroller.getCurrX(), mScroller.getCurrY());
			postInvalidate();
		}
	}

	@Override
	public boolean onTouchEvent(MotionEvent event) {
		// TODO Auto-generated method stub
		
		if (mVelocityTracker == null) {
			mVelocityTracker = VelocityTracker.obtain();
		}
		mVelocityTracker.addMovement(event);
		
		final int action = event.getAction();
		final float x = event.getX();
		final float y = event.getY();
		
		switch (action) {
		case MotionEvent.ACTION_DOWN:
			Log.e(TAG, "event down!");
			if (!mScroller.isFinished()){
				mScroller.abortAnimation();
			}
			mLastMotionX = x;
			break;
			
		case MotionEvent.ACTION_MOVE:
			int deltaX = (int)(mLastMotionX - x);
			mLastMotionX = x;
			Log.v(TAG, "event ACTION_MOVE");
            scrollBy(deltaX, 0);
			break;
			
		case MotionEvent.ACTION_UP:
			Log.e(TAG, "event : up");   
            // if (mTouchState == TOUCH_STATE_SCROLLING) {   
            final VelocityTracker velocityTracker = mVelocityTracker;   
            velocityTracker.computeCurrentVelocity(1000);   
            int velocityX = (int) velocityTracker.getXVelocity();   // 滑动的速度，左边为负，右边为正
            Log.e(TAG, "velocityX:"+velocityX); 
            
            
            if (velocityX > SNAP_VELOCITY && mCurScreen > 0) {   
                // Fling enough to move left    
            	Log.e(TAG, "snap  向右滑动");
                snapToScreen(mCurScreen - 1);   
            } else if (velocityX < -SNAP_VELOCITY  && mCurScreen < getChildCount() - 1) {   
                     
                // Fling enough to move right,    
            	Log.e(TAG, "snap 向左滑动");
                snapToScreen(mCurScreen + 1);   
            } else {   
                snapToDestination();   
            }   

            if (mVelocityTracker != null) {   
                mVelocityTracker.recycle();   
                mVelocityTracker = null;   
            }   
            // }   
            mTouchState = TOUCH_STATE_REST;   
            
            
			break;
		case MotionEvent.ACTION_CANCEL:
			mTouchState = TOUCH_STATE_REST;
			break;
		}
		
		return true;
	}

	@Override
	public boolean onInterceptTouchEvent(MotionEvent ev) {
		// TODO Auto-generated method stub
		Log.e(TAG, "onInterceptTouchEvent-slop:"+mTouchSlop);
		
		final int action = ev.getAction();
		Log.i(TAG, "action  ==== " + action);
		if ((action == MotionEvent.ACTION_MOVE) && (mTouchState != TOUCH_STATE_REST)) {
			return true;
		}
		
		final float x = ev.getX();
		final float y = ev.getY();
		
		switch (action) {
		case MotionEvent.ACTION_MOVE:
			final int xDiff = (int)Math.abs(mLastMotionX-x);
			if (xDiff>mTouchSlop) {
				Log.i(TAG, "MotionEvent.ACTION_MOVE");
				mTouchState = TOUCH_STATE_SCROLLING;
				
			}
			break;
			
		case MotionEvent.ACTION_DOWN:
			Log.v(TAG, "MotionEvent.ACTION_DOWN");
			mLastMotionX = x;
			mLastMotionY = y;
			mTouchState = mScroller.isFinished()? TOUCH_STATE_REST : TOUCH_STATE_SCROLLING;
			
			break;
			
		case MotionEvent.ACTION_CANCEL:
		case MotionEvent.ACTION_UP:
			Log.e(TAG, "MotionEvent.ACTION_UP");
			mTouchState = TOUCH_STATE_REST;
			break;
		}
		return mTouchState != TOUCH_STATE_REST;
	}
}


主页面：


package com.dianxing.dialog;


import com.dianxing.dialog.ScrollLayout.OnCurrentViewChangedListener;

import android.app.Activity;
import android.os.Bundle;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageButton;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;

public class MeMainActivity extends Activity {

	private LinearLayout layout;
	private ScrollLayout scrollLayout;
	private ImageButton imageButton;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		layout = (LinearLayout) LayoutInflater.from(this).inflate(R.layout.memain, null);
		scrollLayout = (ScrollLayout) layout.findViewById(R.id.scroll_privage);
		scrollLayout.setmOnCurrentViewChangedListener(mOnCurrentViewChangedListener);
		getLayout();
		setContentView(layout);
	}
	
	private void getLayout(){
		// TODO 添加布局页面
		final LayoutInflater layoutInflater = LayoutInflater.from(getApplicationContext());
		for(int i=0; i < 10 ; i++){
			Log.i("Main", i + "");
			final View view = layoutInflater.inflate(R.layout.meitem, null);
			final LinearLayout item_fisrtLayout = (LinearLayout) view.findViewById(R.id.item_fisrtLayout);
			TextView textView = (TextView) view.findViewById(R.id.tv);
			ImageView iamgeViewLeft = (ImageView) view.findViewById(R.id.iamgeViewLeft);
			ImageView iamgeViewRight = (ImageView) view.findViewById(R.id.iamgeViewRight);
			
			iamgeViewLeft.setImageDrawable(getResources().getDrawable(R.drawable.qwe));
			iamgeViewRight.setImageDrawable(getResources().getDrawable(R.drawable.awq));
			
			scrollLayout.addView(item_fisrtLayout);
			
			
			// TODO 添加按钮
			final LinearLayout imageButtonLayout = (LinearLayout) layout.findViewById(R.id.imageButtonLayout);
			final View viewButton = layoutInflater.inflate(R.layout.mebutton, null);
			imageButton = (ImageButton) viewButton.findViewById(R.id.imageButton);
			
			imageButtonLayout.addView(imageButton);
			
		}
		
	}
	private OnCurrentViewChangedListener mOnCurrentViewChangedListener = new OnCurrentViewChangedListener() {
		
		@Override
		public void onCurrentViewChanged(View view, int currentview) {
			Log.i("Main", "currentview ==== " + currentview );
			if(currentview == 0){
				imageButton.setImageDrawable(getResources().getDrawable(R.drawable.mv_dot_light));
			}
		}
	};
	
}


memain.xml:


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:orientation="vertical"
  android:layout_height="fill_parent">
  
   <TextView 
    	android:id="@+id/title_tv"
    	android:text="北京*东直门"
    	android:layout_marginTop="5dip"
    	android:gravity="center_horizontal"
    	android:layout_width="fill_parent"
    	android:layout_height="wrap_content"/>
    
    <LinearLayout 
    	android:background="#999999"
	    android:orientation="vertical"
	    android:layout_marginTop="5dip"
	    android:layout_marginLeft="10dip"
	    android:layout_marginRight="10dip"
	    android:layout_width="fill_parent"
	    android:layout_height="wrap_content">
	    
	    <com.dianxing.dialog.ScrollLayout
	    	android:id="@+id/scroll_privage"
			android:layout_width="fill_parent" 
			android:layout_height="130dip">
			
  		</com.dianxing.dialog.ScrollLayout>
  		
  		 <LinearLayout 
			android:id="@+id/imageButtonLayout"
			android:layout_width="fill_parent" 
			android:layout_height="wrap_content"  
			android:gravity="center_horizontal"
			android:layout_marginBottom="5dip"
			android:orientation="horizontal">
  		
		</LinearLayout>
	</LinearLayout>
</LinearLayout>


meitem.xml:

<?xml version="1.0" encoding="utf-8"?>
 <LinearLayout 
	android:id="@+id/item_fisrtLayout"
	android:orientation="vertical"
	android:layout_width="fill_parent" 
    xmlns:android="http://schemas.android.com/apk/res/android"
	android:layout_height="wrap_content">
	
	<TextView
		android:id="@+id/tv"
		android:layout_marginLeft="20dip"
		android:textSize="20sp"
		android:paddingTop="5dip"
		android:layout_width="wrap_content" 
		android:layout_height="30dip" 
		android:singleLine="true"
		android:text="你可能喜欢的优惠.你可能喜欢的优惠。。。。" 
		android:ellipsize="end"
		android:textColor="#F0F0"/>
	
   	<LinearLayout 
   		android:orientation="horizontal"
   		android:gravity="center_horizontal"
   		android:paddingTop="5dip"
		android:layout_width="fill_parent" 
		android:layout_height="wrap_content">
	<ImageView 
		android:id="@+id/iamgeViewLeft"
   		android:layout_marginRight="5dip"
		android:layout_width="135dip" 
		android:background="@drawable/qwe" 
		android:layout_height="90dip" 
		android:textColor="#F0F0"/>
	<ImageView 
		android:id="@+id/iamgeViewRight"
   		android:layout_marginLeft="5dip"
		android:layout_width="130dip" 
		android:layout_height="90dip" 
		android:background="@drawable/awq" 
		android:textColor="#F0F0"/>
	</LinearLayout>
</LinearLayout>

mebutton.xml:

<?xml version="1.0" encoding="utf-8"?>
<ImageButton 
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:id="@+id/imageButton" 
	android:layout_width="wrap_content" 
	android:background="#00000000" 
	android:layout_height="wrap_content" 
	android:padding="3dip"
	android:src="@drawable/mv_dot_light"/>






 
 
分享到：
| 图片拖动和缩放功能
评论
2 楼 夏文权 2012-05-28  
呵呵， 会尽量配好，最近还没有时间。
1 楼 573842281 2012-05-11  
写得不错，如果配个图就更好了！
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    RecyclerLayoutManager-RecyclerView模仿探探左右滑动布局.zip

    本项目“RecyclerLayoutManager-RecyclerView模仿探探左右滑动布局”是基于开源项目，目的是实现类似探探应用的左右滑动交互效果。通过分析这个项目的源代码，我们可以深入理解RecyclerView的自定义LayoutManager...

    微信小程序开发中scroll-view左右滑动布局

    微信小程序开发中scroll-view实现左右滑动时的布局样式,样式的编写，欢迎大家参考和提意见微信小程序开发中scroll-view实现左右滑动时的布局样式,样式的编写，欢迎大家参考和提意见

    模仿探探左右滑动的卡片效果

    在Android开发中，模仿探探应用的左右滑动卡片效果是一项常见的需求，它为用户提供了一种直观且有趣的交互方式。这种效果通常应用于匹配或者选择类的界面，用户可以通过简单的手势来表达他们的喜好或不喜好。在本...

    Android开发中RecyclerView模仿探探左右滑动布局功能

    在本示例中，我们将探讨如何模仿探探应用的左右滑动布局功能，这通常用于卡片式用户界面，例如匹配或喜欢/不喜欢用户的交互。 首先，我们需要创建一个新的布局管理器，继承自RecyclerView.LayoutManager。这个...

    android实现上下左右滑动界面布局

    Android 实现上下左右滑动界面布局 Android 实现上下左右滑动界面布局是 Android 开发中的一种常见需求，今天我们将详细介绍如何使用 ScrollView 和 HorizontalScrollView 实现上下左右滑动的界面布局。 首先，...

    【Android】自定义左右滑动菜单

    本项目“【Android】自定义左右滑动菜单”就是这样一个实例，它旨在实现一个可滑动的侧边菜单，用户可以通过左右滑动来显示或隐藏菜单，提升应用的用户体验。 首先，我们来看菜单布局。在Android中，布局是UI设计的...

    html5手机触屏左右滑动图动画切换效果

    效果描述： 可以放到移动端的html5动画切换效果 默认也可以自动切换 ... 支持鼠标点击拖动、滑动 使用方法： 1、将head中的样式引入到你的样式表中 2、将body中需要的代码部分拷贝过去即可

    Android 仿探探左右滑

    这种效果通常用于约会应用或图片浏览应用，用户可以通过左右滑动卡片来表示喜欢或不喜欢。在这个场景下，我们主要会涉及到以下几个关键知识点： 1. **自定义View**: 实现这个功能需要创建一个自定义的View，通常是...

    左右滑动的日历选择，标题也可以左右滑动

    "左右滑动的日历选择，标题也可以左右滑动"这个标题描述了一个交互式的日历组件，它允许用户通过手势进行左右滑动来切换月份，同时标题也会随着滑动而更新显示当前的年月。这种设计提供了良好的用户体验，使得查看和...

    swiper滑动-上下左右滑动结合

    在"swiper滑动-上下左右滑动结合"的项目中，开发者通过Swiper实现了一个复杂的交互效果，既支持水平滑动，也支持垂直滑动，并且可以在左右滑动的过程中嵌入上下滑动的内容。这样的设计极大地丰富了用户的浏览体验，...

    recyclerView 实现viewparger左右滑动上下滑动功能

    在本教程中，我们将探讨如何结合RecyclerView和ViewPager来创建一个既能左右滑动也能上下滑动的交互效果。 ### RecyclerView与ViewPager的组合原理 RecyclerView是通过Adapter来绑定数据并渲染到视图上的，而...

    web前端仿手机左右滑动

    标题中的“web前端仿手机左右滑动”是指在网页开发中实现类似移动设备上常见的左右滑动页面的效果。这种效果通常用于创建全屏滚动、轮播图或者展示多个项目的流式布局。在移动互联网时代，为了让用户体验更加贴近...

    android桌面，支持左右滑动

    在实现左右滑动的桌面效果时，通常会使用一个自定义的ViewGroup或者继承自现有布局（如LinearLayout、RelativeLayout等）的类来作为整个桌面的基础框架。这个ViewGroup需要能够监听用户的触摸事件，判断是水平滑动...

    左右滑动swiplistview显示不同的布局

    在Android开发中，SwiplistView是一个非常实用的控件，它允许用户通过左右滑动列表项来展示不同的布局，从而提供丰富的交互体验。SwiplistView通常被用于实现类似卡片式切换、选项切换或者多状态展示等功能。下面将...

    iOS UIScrollView左右滑动

    本篇文章将深入探讨如何利用`UIScrollView` 实现左右滑动的效果，特别是针对`UITableView` 和 `UICollectionView` 的应用。 首先，我们要理解`UIScrollView`的基本原理。`UIScrollView`是一个可以容纳大于其实际...

    左右滑动的自定义的tabbar

    一个自定义且可左右滑动的TabBar可以为用户提供更流畅的交互体验，尤其是在功能较多，不能一次性显示所有Tab时。本文将深入探讨如何实现这样一个自定义的左右滑动TabBar，并提供一个详细的实例来帮助你的项目提升...

    GridView的左右滑动+分页

    在标题"GridView的左右滑动+分页"中，提到的功能是为GridView添加左右滑动以及分页加载数据，这在处理大量数据时非常有用，既能提供良好的用户体验，又能优化性能。 首先，让我们详细讲解如何实现GridView的左右...

    可以左右滑动的UITableView

    而“可以左右滑动的UITableView”则是对原生UITableView功能的一种扩展，使得用户可以通过左右滑动单元格来触发不同的操作或者显示更多信息。这种功能常见于许多社交应用，比如微信中的聊天列表，通过滑动可以快速...

    android左右滑动的选择控件

    总结，实现Android的左右滑动选择控件涉及的知识点包括：自定义View的创建与绘制、触摸事件处理、布局管理、动画效果、手势识别、库的使用以及性能优化。通过深入理解和实践这些技术，开发者可以构建出满足各种需求...

Magicbox
Global site tag (gtag.js) - Google Analytics