android 仿ios開關控制項，androidios開關控制項

android 仿ios開關控制項，androidios開關控制項

ios一些控制項還是挺漂亮的,但是對android程式員來說可能比較苦逼,因為ios一些看起來簡單的效果對android來說可能就沒那麼簡單了,但是沒辦法很多產品都是拿ios的一些控制項叫android開發人員來照著做,今天就來做一個設定中常見的開關效果,

思路：

1：準備二張圖片 一個是包含開和關二種狀態的圖片,一個是上面滑動的按鈕圖片

2：這些圖片肯定是不能通過原生態的控制項顯示上去的,要通過canvas畫上去

3:要解決點擊和滑動的事件衝突,因為點擊包含 按下 離開,而滑動包含按下  移動 離開,

下面看代碼邏輯首先是布局檔案,很簡單

<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"    >    <com.example.toggle.ui.MyToggleView        android:layout_width="wrap_content"        android:layout_height="wrap_content"      android:layout_centerInParent="true"       /></RelativeLayout>

MyToggleView.java 自訂的控制項

package com.example.toggle.ui;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;import com.example.toggle.R;/** * 一個view從建立到顯示要經曆的過程 * 1：建構函式 執行個體初始化 * 2：測量 onMeasure * 3:如果當前view是ViewGroup 還要義務測量它孩子(子view) * 4：指定控制項的大小和位置 (onLayout) * 如果當前view是ViewGroup 還要義務指定它孩子的大小和位置(子view) * 5：繪製(就是畫出來再螢幕上可見)onDraw(Canvas canvas) * @author Administrator *  * 點擊事件包含點擊 和 離開  而這個離開剛好和移動中的up事件一樣 * */public class MyToggleView extends View implements View.OnClickListener {private static final String TAG = "MyToggleView";Paint paint ;private Bitmap bg_bitmap;private Bitmap sliding_bitmap;private float slidingLeft = 0;private int slideLeftMax;/** * 自訂樣式用它 * @param context * @param attrs * @param defStyleAttr */public MyToggleView(Context context, AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);}/** * 在布局時候用它 * @param context * @param attrs */public MyToggleView(Context context, AttributeSet attrs) {super(context, attrs);initView();}private void initView() {paint = new Paint();bg_bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.switch_background);sliding_bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.slide_button);slideLeftMax = bg_bitmap.getWidth() - sliding_bitmap.getWidth();setOnClickListener(this);}/** * 在代碼new的時候用它 * @param context */public MyToggleView(Context context) {super(context);}/** * 測量 */@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {/** * 這是父類去測量子view的大小 而我們可以不要父類去測量 *///super.onMeasure(bg_bitmap.getWidth(), bg_bitmap.getHeight());/** * 人為指定控制項測量大小 (就是說沒有測量) */setMeasuredDimension(bg_bitmap.getWidth(), bg_bitmap.getHeight());}@Overrideprotected void onDraw(Canvas canvas) {canvas.drawBitmap(bg_bitmap, 0, 0, paint);canvas.drawBitmap(sliding_bitmap, slidingLeft , 0, paint);}private boolean isOpened = false;/** * isClickenble為true表示點擊事件生效 但觸摸事件無效 * isClickenble 為false表示點擊事件失效 觸摸事件有效 */private boolean isClickenble = false;@Overridepublic void onClick(View v) {if(isClickenble){isOpened = !isOpened;if(isOpened){slidingLeft = bg_bitmap.getWidth()-sliding_bitmap.getWidth();}else{slidingLeft = 0;}invalidate();}}private float startX = 0;//手指剛觸動時候的x軸座標private float lastX = 0;//手指剛觸動時候的x軸座標@Overridepublic boolean onTouchEvent(MotionEvent event) { super.onTouchEvent(event);//執行父類的方法switch (event.getAction()) {//判斷滑動的動作 是剛按下 還是拖動 還是手指 抬起case MotionEvent.ACTION_DOWN :lastX = startX = event.getX();//這是距離 這個控制項的x軸座標值isClickenble = true;break;case MotionEvent.ACTION_MOVE :float endX = event.getX();int distanceX = (int) Math.abs(endX - lastX);if(distanceX > 5){isClickenble = false;}refreshView(endX);startX = event.getX();//重新計算初始值break;case MotionEvent.ACTION_UP :if(slidingLeft>slideLeftMax/2){ //開isOpened = true;slidingLeft = slideLeftMax;}else{//關isOpened = false;slidingLeft = 0;}invalidate();break;}return true;//表示自己處理 不需要調用父類的方法}private void refreshView(float endX) {float distance  = (endX - startX) ; slidingLeft+=distance;if(slidingLeft<0){slidingLeft = 0;}if(slidingLeft>slideLeftMax){slidingLeft = slideLeftMax;}invalidate();}}

：