滑动开关

滑动开关--------

效果展示；

自定义控件步骤：

测量：onMeasure  设置自己显示在屏幕上的宽高

布局：onLayout   设置自己显示在屏幕上的位置(只有在自定义ViewGroup中才用到)

绘制：onDraw     控制显示在屏幕上的样子(自定义viewgroup时不需要这个)

View和ViewGroup的区别

1.他们都需要进行测量操作

2.ViewGroup主要是控制子view如何摆放，所以必须实现onLayout

  View没有子view，所以不需要onLayout方法，但是必须实现onDraw

UI特效大全网站：http://www.23code.com/

 最美锁屏

图片资料下载：

项目构造图如下：

代码展示如下；

1、布局文件

<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.bwei.togglebutton.Togglebutton
        android:id="@+id/togglebutton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true" />

</RelativeLayout>

2、MainActivity.class文件

import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.widget.Toast;

import com.bwei.togglebutton.Togglebutton.OnToggleStateChangeListner;
import com.bwei.togglebutton.Togglebutton.ToggleState;

public class MainActivity extends Activity {

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		// 初始化控件
		Togglebutton togglebutton = (Togglebutton) findViewById(R.id.togglebutton);
		togglebutton.setSlideBackgroudResource(R.drawable.slide_button_background);
		togglebutton.setSwitchBackgroudResource(R.drawable.switch_background);
		togglebutton.setToggleState(ToggleState.Open);
		
		togglebutton.setOnToggleStateChangeListener(new OnToggleStateChangeListner() {
			@Override
			public void onToggleStateChange(ToggleState state) {
				Toast.makeText(MainActivity.this, state==ToggleState.Open?"开启":"关闭", 0).show();
			}
		});
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.main, menu);
		return true;
	}

}

3、创建Togglebutton.class类

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;

public class Togglebutton extends View{

	private ToggleState toggleState = ToggleState.Open;//开关的状态
	private Bitmap slideBg;
	private Bitmap switchBg;
	private boolean isSliding = false;
	
	private int currentX;//当前触摸点x坐标

	/**
	 * 如果你的view只是在布局文件中使用，只需要重写这个构造方法
	 * @param context
	 * @param attrs
	 */
	public Togglebutton(Context context, AttributeSet attrs) {
		super(context, attrs);
	}

	/**
	 * 如果你的 view需要在java代码中动态new出来，走的是这个构造方法
	 * @param context
	 */
	public Togglebutton(Context context) {
		super(context);
	}
	
	public enum ToggleState{
		Open,Close
	}

	/**
	 * 设置滑动块的背景图片
	 * @param slideButtonBackground
	 */
	public void setSlideBackgroudResource(int slideButtonBackground) {
		slideBg = BitmapFactory.decodeResource(getResources(), slideButtonBackground);
	}

	/**
	 * 设置滑动开关的背景图片
	 * @param switchBackground
	 */
	public void setSwitchBackgroudResource(int switchBackground) {
		switchBg = BitmapFactory.decodeResource(getResources(), switchBackground);
	}

	/**
	 * 设置开关的状态
	 * @param open
	 */
	public void setToggleState(ToggleState state) {
		toggleState = state;
	}
	
	/**
	 * 设置当前控件显示在屏幕上的宽高
	 */
	@Override
	protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
		super.onMeasure(widthMeasureSpec, heightMeasureSpec);
		setMeasuredDimension(switchBg.getWidth(), switchBg.getHeight());
	}
	
	/**
	 * 绘制自己显示在屏幕时的样子
	 */
	@Override
	protected void onDraw(Canvas canvas) {
		super.onDraw(canvas);
		//1.绘制背景图片
		//left: 图片的左边的x坐标
		//top: 图片顶部的y坐标
		canvas.drawBitmap(switchBg, 0, 0, null);
		
		//2.绘制滑动块的图片
		if(isSliding){
			int left = currentX - slideBg.getWidth()/2;
			if(left<0)left = 0;
			if(left>(switchBg.getWidth() - slideBg.getWidth())){
				left = switchBg.getWidth() - slideBg.getWidth();
			}
			canvas.drawBitmap(slideBg, left, 0, null);
		}else {
			//此时抬起，根据state去绘制滑动块的位置
			if(toggleState==ToggleState.Open){
				canvas.drawBitmap(slideBg, switchBg.getWidth()-slideBg.getWidth(), 0, null);
			}else {
				canvas.drawBitmap(slideBg, 0, 0, null);
			}
		}
		
	}
	
	
	@Override
	public boolean onTouchEvent(MotionEvent event) {
		currentX = (int) event.getX();
		switch (event.getAction()) {
		case MotionEvent.ACTION_DOWN:
			isSliding = true;
			break;
		case MotionEvent.ACTION_MOVE:
			break;
		case MotionEvent.ACTION_UP:
			isSliding = false;
			
			int centerX = switchBg.getWidth()/2;
			if(currentX>centerX){
				//open
				if(toggleState!=ToggleState.Open){
					toggleState = ToggleState.Open;
					if(listner!=null){
						listner.onToggleStateChange(toggleState);
					}
				}
			}else {
				//close
				if(toggleState!=ToggleState.Close){
					toggleState = ToggleState.Close;
					if(listner!=null){
						listner.onToggleStateChange(toggleState);
					}
				}
			}
			break;
		}
		invalidate();
		return true;
	}

	private OnToggleStateChangeListner listner;
	public void setOnToggleStateChangeListener(OnToggleStateChangeListner listner){
		this.listner = listner;
	}
	public interface OnToggleStateChangeListner{
		void onToggleStateChange(ToggleState state);
	}

}