Android 左右滑动 控件

    先看效果:


main.xml:

<?xml version="1.0" encoding="utf-8"?><linearlayout xmlns:android="http://schemas.android.com/apk/res/android"	android:orientation="vertical" android:layout_width="fill_parent"	android:layout_height="fill_parent">	<textview android:id="@+id/textview" android:layout_width="fill_parent"		android:layout_height="wrap_content" android:text="ddd" />	<com.diydyq.android.swipetest.slipview		android:id="@+id/slipview" android:orientation="vertical"		android:layout_width="fill_parent" android:layout_height="fill_parent">	</com.diydyq.android.swipetest.slipview></linearlayout>

slipentity.java

package com.iaiai.activity;import java.util.hashmap;import java.util.map;import android.graphics.bitmap;import android.util.log;/** *  * <p> * title: slipentity.java * </p> * <p> * e-mail: [e-mail] * </p> * <p> * qq: 176291935 * </p> * <p> * http: iaiai.iteye.com * </p> * <p> * create time: 2011-8-11 * </p> *  * @author 丸子 * @version 0.0.1 */public class slipentity {	public static final int flag_back = 1;	public static final int flag_frot = 2;	public static final float dock_l = 0;	public static final float dock_m = (float) 0.5;	public static final float dock_r = 1;	public static final float micro_x = 10;	/** background image */	bitmap backimage;	/** front image */	bitmap frotimage;	/** start position of back image */	float xbackstart;	/** start position of back image */	float ybackstart;	/** start position of front image */	float xfrotstart;	/** start position of front image */	float yfrotstart;	/** initial position of front image */	float xfrotinitpos;	/** initial position of front image */	float yfrotinitpos;	/** margin of front and back image in x-axis */	float xmarginleft;	/** margin of front and back image in y-axis */	float ymargintop;	/** containing dock position of the front image */	map<float, float> dockposlist = new hashmap<float, float>();	/** current dock percentage: dock_l | dock_m | dock_r */	float curdockper = dock_l;	/** weather has invoked initslipentity() */	boolean isinit = false;	public slipentity() {	}	public slipentity(bitmap backimage, bitmap frotimage) {		this.backimage = backimage;		this.frotimage = frotimage;	}	public slipentity(float xbackstart, float ybackstart, float xfrotstart,			float yfrotstart) {		this.xbackstart = xbackstart;		this.ybackstart = ybackstart;		this.xfrotstart = xfrotstart;		this.yfrotstart = yfrotstart;	}	public void initslipentity(float viewwidth, float viewheight) {		this.xbackstart = (viewwidth - this.backimage.getwidth()) / 2;		this.ybackstart = (viewheight - this.backimage.getheight()) / 2;		this.xmarginleft = 5;		this.ymargintop = (this.backimage.getheight() - this.frotimage				.getheight()) / 2;		this.xfrotinitpos = this.xbackstart + this.xmarginleft;		this.yfrotinitpos = this.ybackstart + this.ymargintop;		this.xfrotstart = this.xfrotinitpos;		this.yfrotstart = this.yfrotinitpos;		// add dock position		float dockl = this.xfrotinitpos;		float dockr = this.xbackstart + this.backimage.getwidth()				- this.frotimage.getwidth() - this.xmarginleft;		this.dockposlist.put(dock_l, dockl);		this.dockposlist.put(dock_r, dockr);		for (float dockper : this.dockposlist.keyset()) {			if (this.dockposlist.get(dockper) == 0) {				float docpos = (dockr - dockl) * dockper						+ this.dockposlist.get(dock_l);				this.dockposlist.put(dockper, docpos);			}		}		// dock at current position		this.xfrotstart = this.dockposlist.get(this.curdockper);		this.isinit = true;		// for debug information		stringbuilder sb = new stringbuilder();		sb.append("backimagew:" + this.backimage.getwidth() + "\n");		sb.append("backimageh:" + this.backimage.getheight() + "\n");		sb.append("frotimagew:" + this.frotimage.getwidth() + "\n");		sb.append("frotimageh:" + this.frotimage.getheight() + "\n");		sb.append("xbackstart:" + xbackstart + "\n");		sb.append("ybackstart:" + ybackstart + "\n");		sb.append("xmarginleft:" + xmarginleft + "\n");		sb.append("ymargintop:" + ymargintop + "\n");		sb.append("xfrotinitp:" + xfrotinitpos + "\n");		sb.append("yfrotinitp:" + yfrotinitpos + "\n");		sb.append("xfrotstart:" + xfrotstart + "\n");		sb.append("yfrotstart:" + yfrotstart + "\n");		log.v("slipentity", sb.tostring());	}	/**	 * weather the front image reaches the max right of background image, if	 * true, set xfrotstart to max right.	 * 	 * @return	 */	public boolean isreachright() {		if (this.xfrotstart > this.dockposlist.get(dock_r)) {			this.curdockper = dock_r;			this.xfrotstart = this.dockposlist.get(dock_r);			return true;		} else {			return false;		}	}	/**	 * weather the front image reaches the max left of background image, if	 * true, set xfrotstart to max left.	 * 	 * @return	 */	public boolean isreachleft() {		if (this.xfrotstart < this.dockposlist.get(dock_l)) {			this.curdockper = dock_l;			this.xfrotstart = this.dockposlist.get(dock_l);			return true;		} else {			return false;		}	}	/**	 * weather the point(x,y) is in the area of back or front image	 * 	 * @param type	 *            flag_frot(front image) | flag_back(back image)	 * @param x	 *            x-coordinate of point	 * @param y	 *            y-coordinate of point	 * @return weather the point is in specified area	 */	public boolean ispointinimage(int type, float x, float y) {		float rpointx;		float rpointy;		switch (type) {		case flag_frot:			rpointx = this.xfrotstart + this.frotimage.getwidth();			rpointy = this.yfrotstart + this.frotimage.getheight();			if (x > this.xfrotstart &amp;&amp; y > this.yfrotstart &amp;&amp; x < rpointx					&amp;&amp; y < rpointy)				return true;			else				return false;		case flag_back:			rpointx = this.xbackstart + this.backimage.getwidth();			rpointy = this.ybackstart + this.backimage.getheight();			if (x > this.xbackstart &amp;&amp; y > this.ybackstart &amp;&amp; x < rpointx					&amp;&amp; y < rpointy)				return true;			else				return false;		default:			return false;		}	}	/**	 * is the current touch in some dock position	 * 	 * @return return dockper if in, or -1 while no match	 */	public float isdock() {		for (float dockper : this.dockposlist.keyset()) {			float dockpos = this.dockposlist.get(dockper);			if (this.xfrotstart > dockpos - micro_x					&amp;&amp; this.xfrotstart < dockpos + micro_x) {				this.curdockper = dockper;				return dockper;			}		}		return -1;	}	/**	 * get the current dock percentage in x-axis	 * 	 * @return	 */	public float getcurdockper() {		return this.curdockper;	}	/**	 * get the current dock position in x-axis	 * 	 * @return	 */	public float getcurdockpos() {		return this.dockposlist.get(this.curdockper);	}	/**	 * add dock position to the list	 * 	 * @param dockper	 *            dock percent should be between (0.0,1.0)	 */	public void adddockpos(float dockper) {		if (dockper > 0 &amp;&amp; dockper < 1) {			this.dockposlist.put(dockper, (float) 0.0);		}	}	/**	 * return width of background image	 * 	 * @return	 */	public float getbackwidth() {		return this.backimage.getwidth();	}	/**	 * return height of background image	 * 	 * @return	 */	public float getbackheight() {		return this.backimage.getheight();	}	/**	 * return width of front image	 * 	 * @return	 */	public float getfrotwidth() {		return this.frotimage.getwidth();	}	/**	 * return height of front image	 * 	 * @return	 */	public float getfrotheight() {		return this.frotimage.getwidth();	}	/**	 * dock at some position	 * 	 * @param curdockper	 */	public void setcurdockpos(float curdockper) {		this.curdockper = curdockper;	}	public bitmap getbackimage() {		return backimage;	}	public void setbackimage(bitmap backimage) {		this.backimage = backimage;	}	public bitmap getfrotimage() {		return frotimage;	}	public void setfrotimage(bitmap frotimage) {		this.frotimage = frotimage;	}	public float getxbackstart() {		return xbackstart;	}	public void setxbackstart(float xbackstart) {		this.xbackstart = xbackstart;	}	public float getybackstart() {		return ybackstart;	}	public void setybackstart(float ybackstart) {		this.ybackstart = ybackstart;	}	public float getxfrotstart() {		return xfrotstart;	}	public void setxfrotstart(float xfrotstart) {		this.xfrotstart = xfrotstart;	}	public float getyfrotstart() {		return yfrotstart;	}	public void setyfrotstart(float yfrotstart) {		this.yfrotstart = yfrotstart;	}	public float getxfrotinitpos() {		return xfrotinitpos;	}	public void setxfrotinitpos(float xfrotinitpos) {		this.xfrotinitpos = xfrotinitpos;	}	public float getyfrotinitpos() {		return yfrotinitpos;	}	public void setyfrotinitpos(float yfrotinitpos) {		this.yfrotinitpos = yfrotinitpos;	}	public float getxmarginleft() {		return xmarginleft;	}	public void setxmarginleft(float xmarginleft) {		this.xmarginleft = xmarginleft;	}	public float getymargintop() {		return ymargintop;	}	public void setymargintop(float ymargintop) {		this.ymargintop = ymargintop;	}	public map<float, float> getdockposlist() {		return dockposlist;	}	public void setdockposlist(map<float, float> dockposlist) {		this.dockposlist = dockposlist;	}	public boolean isinit() {		return isinit;	}	public void setinit(boolean isinit) {		this.isinit = isinit;	}}

slipview.java

package com.iaiai.activity;import android.content.context;import android.graphics.bitmap;import android.graphics.canvas;import android.graphics.drawable.bitmapdrawable;import android.util.attributeset;import android.util.log;import android.view.motionevent;import android.view.view;/** *  * <p> * title: slipview.java * </p> * <p> * e-mail: [e-mail] * </p> * <p> * qq: 176291935 * </p> * <p> * http: iaiai.iteye.com * </p> * <p> * create time: 2011-8-11 * </p> *  * @author 丸子 * @version 0.0.1 */public class slipview extends view {	private static final string tag = "slipview";	/** listen slip on the block, no matter the event is success or fail */	private onsliplistener onsliplistener;	/** slip entity to set the value about backimage, frontimage position */	private slipentity slipentity;	private float tmptouchx;	private float tmptouchgap;	public slipview(context context) {		super(context);		bitmap backimage = ((bitmapdrawable) getresources().getdrawable(				r.drawable.back5)).getbitmap();		bitmap frotimage = ((bitmapdrawable) getresources().getdrawable(				r.drawable.frot1)).getbitmap();		this.slipentity = new slipentity(backimage, frotimage);	}	public slipview(context context, attributeset attr) {		super(context, attr);		bitmap backimage = ((bitmapdrawable) getresources().getdrawable(				r.drawable.back5)).getbitmap();		bitmap frotimage = ((bitmapdrawable) getresources().getdrawable(				r.drawable.frot1)).getbitmap();		this.slipentity = new slipentity(backimage, frotimage);	}	public slipview(context context, slipentity slipentity) {		super(context);		this.slipentity = slipentity;	}	@override	protected void ondraw(canvas canvas) {		super.ondraw(canvas);		if (!this.slipentity.isinit) {			log.v(tag, "init slipentity");			this.slipentity.initslipentity(this.getwidth(), this.getheight());		}		canvas.drawbitmap(this.slipentity.getbackimage(),				this.slipentity.xbackstart, this.slipentity.ybackstart, null);		canvas.drawbitmap(this.slipentity.getfrotimage(),				this.slipentity.xfrotstart, this.slipentity.yfrotstart, null);	}	/**	 * listen touch events and notify listener	 */	@override	public boolean ontouchevent(motionevent event) {		log.v(tag, "touch position:" + event.getx());		switch (event.getaction()) {		case motionevent.action_down:			// log.v(tag, "down");			if (this.slipentity.ispointinimage(slipentity.flag_frot,					event.getx(), event.gety())) {				this.tmptouchx = event.getx();				this.tmptouchgap = event.getx() - this.slipentity.xfrotstart;			}			break;		case motionevent.action_move:			// log.v(tag, "move");			this.slipentity.isreachright();			this.slipentity.isreachleft();			// if point(x,y) is not in back image, front image will not move			if (this.slipentity.ispointinimage(slipentity.flag_back,					event.getx(), event.gety())) {				// log.v(tag, "move2");				this.slipentity.xfrotstart = event.getx() - this.tmptouchgap;			}			break;		case motionevent.action_up:			log.v(tag, "up");			int flaglr = 0;			if (event.getx() < this.tmptouchx)				flaglr = 1;			else				flaglr = 2;			float dockper = this.slipentity.isdock();			if (dockper != -1) {				// dock at some position				if (this.onsliplistener != null)					this.onsliplistener.slipdock(slipentity, event,							this.slipentity.getcurdockper());				if (event.getx() < this.tmptouchx) {					// slip: <==					if (dockper == 0.0) {						// reached						if (this.onsliplistener != null)							this.onsliplistener.slipleft(slipentity, event,									true);					} else {						// not reached						this.slipentity.xfrotstart = this.slipentity								.getcurdockpos();						if (this.onsliplistener != null)							this.onsliplistener.slipleft(slipentity, event,									false);					}				} else {					// slip: ==>					if (dockper == 1.0) {						// reached						if (this.onsliplistener != null)							this.onsliplistener.slipright(slipentity, event,									true);					} else {						// not reached						this.slipentity.xfrotstart = this.slipentity								.getcurdockpos();						if (this.onsliplistener != null)							this.onsliplistener.slipright(slipentity, event,									false);					}					break;				}			} else {				// no dock				this.slipentity.xfrotstart = this.slipentity.getcurdockpos();				if (flaglr == 1)					this.onsliplistener.slipleft(slipentity, event, false);				else					this.onsliplistener.slipright(slipentity, event, false);			}			// if (event.getx() < this.tmptouchx)			// {			// // slip: <== // if (this.slipentity.isreachleft())			// { // // reached			// if (this.onsliplistener != null)			// this.onsliplistener.slipleft(slipentity, event, true);			// }			// else			// {			// // not reached			// this.slipentity.xfrotstart = this.slipentity.getcurdockpos();			// if (this.onsliplistener != null)			// this.onsliplistener.slipleft(slipentity, event, false);			// }			// }			// else			// {			// // slip: ==>			// if (this.slipentity.isreachright())			// {			// // reached			// if (this.onsliplistener != null)			// this.onsliplistener.slipright(slipentity, event, true);			// }			// else			// {			// // not reached			// this.slipentity.xfrotstart = this.slipentity.getcurdockpos();			// if (this.onsliplistener != null)			// this.onsliplistener.slipright(slipentity, event, false);			// }			// break;			// }		}		this.invalidate();		return true;	}	/**	 * listener on slip event on slippery view author diydyq	 * 	 */	public interface onsliplistener {		/**		 * listen a slip after touch down and up, not including touch move		 * 		 * @param slipentity		 * @param event		 * @param issuccess		 */		public abstract void slipleft(slipentity slipentity, motionevent event,				boolean issuccess);		/**		 * listen a slip after touch down and up, not including touch move		 * 		 * @param slipentity		 * @param event		 * @param issuccess		 */		public abstract void slipright(slipentity slipentity,				motionevent event, boolean issuccess);		/**		 * listen some dock(more than dock_l,dock_r), normally need not		 * implement it unless more docks are needed.		 * 		 * @param slipentity		 * @param event		 * @param dockper		 */		public abstract void slipdock(slipentity slipentity, motionevent event,				float dockper);	}	public onsliplistener getonsliplistener() {		return onsliplistener;	}	public void setonsliplistener(onsliplistener onsliplistener) {		this.onsliplistener = onsliplistener;	}}

iaiaiactivity.java

package com.iaiai.activity;import android.app.activity;import android.graphics.bitmap;import android.graphics.drawable.bitmapdrawable;import android.os.bundle;import android.util.log;import android.view.motionevent;import com.iaiai.activity.slipview.onsliplistener;/** *  * <p> * title: iaiaiactivity.java * </p> * <p> * e-mail: [e-mail] * </p> * <p> * qq: 176291935 * </p> * <p> * http: iaiai.iteye.com * </p> * <p> * create time: 2011-8-11 * </p> *  * @author 丸子 * @version 0.0.1 */public class iaiaiactivity extends activity {	@override	public void oncreate(bundle savedinstancestate) {		super.oncreate(savedinstancestate);		// setcontentview(r.layout.main);		slipview view;		// 1.code		bitmap backimage = ((bitmapdrawable) getresources().getdrawable(				r.drawable.back5)).getbitmap();		bitmap frotimage = ((bitmapdrawable) getresources().getdrawable(				r.drawable.frot1)).getbitmap();		slipentity entity = new slipentity(backimage, frotimage);		entity.setcurdockpos(slipentity.dock_r);		entity.adddockpos((float) 0.5);		view = new slipview(this, entity);		// 2.code		// view = new slipview(this);		// 3.xml		// view = (slipview)this.findviewbyid(r.id.slipview);		setcontentview(view);		view.setonsliplistener(new onsliplistener() {			@override			public void slipleft(slipentity slipentity, motionevent event,					boolean issuccess) {				log.v("left", boolean.tostring(issuccess));			}			@override			public void slipright(slipentity slipentity, motionevent event,					boolean issuccess) {				log.v("right", boolean.tostring(issuccess));			}			@override			public void slipdock(slipentity slipentity, motionevent event,					float dockper) {				log.v("dock", "dockper:" + dockper);			}		});	}}

下面是用到的三张图片: