Android滑动开关-ToggleButton(附源码)
我们先看下滑动开关的效果图:
我们先上代码:
这里是自定义控件ToggleButton.java:
package com.fay.toggle; import android.content.Context; import android.graphics.Bitmap; import android.graphics.BitmapFactory; import android.graphics.Canvas; import android.graphics.Matrix; import android.graphics.Paint; import android.util.AttributeSet; import android.util.Log; import android.view.MotionEvent; import android.view.View; /** * toggle the status * @since 2014/05/22 * @author Fay * {@link [email protected]} */ public class ToggleButton extends View { private String TAG = "ToggleButton"; //the bitmap of toggle on private Bitmap backgroudBitmap = null; //the bitmap of toggle flip private Bitmap slidingBitmap = null; //whether is button if is Sliding private boolean isSliding = false; //the previous state of the button private boolean previousState = false; private Paint mPaint = new Paint(); private Matrix mMatrix = new Matrix(); private OnToggleStateChangedListener mOnToggleStateChangedListener = null; //current X-Location which touched private float touchXLocation = 0; //the slidingBitmap inner margin the ToggleButton private float marginLeft = 0; public ToggleButton(Context context) { super(context); } public ToggleButton(Context context, AttributeSet attrs) { super(context, attrs); } public ToggleButton(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); } /** * set the background for the ToggleButton and sliding image resource * @param int backgroudResID * @param int flipResID */ public void setImageResource(int backgroudResID, int flipResID) { backgroudBitmap = BitmapFactory.decodeResource(getResources(), backgroudResID); slidingBitmap = BitmapFactory.decodeResource(getResources(), flipResID); } /** * set the initialize state of the view * @param boolean isOn */ public void setInitState(boolean isOn) { previousState = isOn; } @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { // TODO Auto-generated method stub super.onMeasure(widthMeasureSpec, heightMeasureSpec); } @Override protected void onDraw(Canvas canvas) { canvas.drawBitmap(backgroudBitmap, mMatrix, mPaint); if (isSliding) {//if sliding //to avoid slidingBitmap sliding out of the ToggleButton if (touchXLocation >= backgroudBitmap.getWidth() - slidingBitmap.getWidth() /2 || touchXLocation <= slidingBitmap.getWidth() /2) { if (touchXLocation >= backgroudBitmap.getWidth() - slidingBitmap.getWidth() /2) { marginLeft = backgroudBitmap.getWidth() - slidingBitmap.getWidth(); } else { marginLeft = 0; } } else { marginLeft = touchXLocation - slidingBitmap.getWidth() / 2; } canvas.drawBitmap(slidingBitmap, marginLeft, 0, mPaint); } else { if (previousState == true) {//on canvas.drawBitmap(slidingBitmap, backgroudBitmap.getWidth() - slidingBitmap.getWidth(), 0, mPaint); } else { canvas.drawBitmap(slidingBitmap, 0, 0, mPaint); } } super.onDraw(canvas); } @Override public boolean onTouchEvent(MotionEvent event) { switch (event.getAction()) { case MotionEvent.ACTION_DOWN: if (0 <= event.getX() && event.getX() <= backgroudBitmap.getWidth() && 0 <= event.getY() && event.getY() <= backgroudBitmap.getHeight() ) { touchXLocation = event.getX(); isSliding = true; } else { isSliding = false; } break; case MotionEvent.ACTION_MOVE: if (isSliding) {//to avoid change the state out of the toggle touchXLocation = event.getX(); } break; case MotionEvent.ACTION_UP: isSliding = false; if (touchXLocation > backgroudBitmap.getWidth() / 2) {//on //if previous state is off if (previousState == false) { mOnToggleStateChangedListener.changed(true); previousState = true; } } else if (touchXLocation < backgroudBitmap.getWidth() / 2) {//off //if previous state if on if (previousState == true) { mOnToggleStateChangedListener.changed(false); previousState = false; } } break; } invalidate(); return true; } /** * The Listener of this ToggleButton */ public interface OnToggleStateChangedListener { void changed(boolean isOn); } /** * set the Listener for the ToggleButton */ public void setOnStateChangedListener(OnToggleStateChangedListener mOnToggleStateChangedListener) { this.mOnToggleStateChangedListener = mOnToggleStateChangedListener; } }
然后我们看下这个活动的布局activity_main.xml:
<RelativeLayout 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" tools:context=".MainActivity" > <com.fay.toggle.ToggleButton android:id="@+id/toggle" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="50dp" android:layout_marginRight="50dp" > </com.fay.toggle.ToggleButton> </RelativeLayout>
然后我们这个活动对这个控件的使用MainActivity.java
package com.fay.toggle; import android.app.Activity; import android.os.Bundle; import android.widget.Toast; import com.fay.toggle.ToggleButton.OnToggleStateChangedListener; public class MainActivity extends Activity { private ToggleButton mToggleButton = null; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); mToggleButton = (ToggleButton) findViewById(R.id.toggle); mToggleButton.setInitState(false); mToggleButton.setImageResource(R.drawable.bkg_switch, R.drawable.btn_slip); mToggleButton.setOnStateChangedListener(new OnToggleStateChangedListener() { @Override public void changed(boolean isOn) { Toast.makeText(getApplicationContext(), isOn + "", 2000).show(); } }); } }
各位朋友可以看到,在MainActivity.java中对ToggleButton的使用是十分简单方便.这个控件通过集成View,重写里面的onDraw()方法进行绘图.以及设置监听器.由于用法十分简单,我就不需要啰嗦了.其中有不妥之处,希望各位道友及时给我您宝贵的建议!
下载链接：http://files.cnblogs.com/yinweiliang/ToggleButton.rar