自定义仿 IPhone 开关控件

极力推荐文章:欢迎收藏
Android 干货分享

阅读五分钟,每日十点,和您一起终身学习,这里是程序员Android

本篇文章主要介绍 Android 开发中的部分知识点,通过阅读本篇文章,您将收获以下内容:

  1. 自定义View类实现
  2. 自定义View 布局
  3. 自定义View 素材
  4. Activity使用自定义View

自定义ItemToggleView 常用于Settings中,主要控制开关的开启与关闭。

自定义ItemToggleView实现效果如下:

开启.png

关闭.png

1. 自定义View类实现

public class SwitchControlView extends View implements OnTouchListener {
	private Bitmap bg_on, bg_off, slipper_btn;
	private float downX, nowX;

	private boolean onSlip = false;

	private boolean nowStatus = false;

	private OnChangedListener listener;

	public SwitchControlView(Context context) {
		super(context);
		init();
	}

	public SwitchControlView(Context context, AttributeSet attrs) {
		super(context, attrs);
		init();
	}

	public void init() {
		bg_on = BitmapFactory.decodeResource(getResources(), R.drawable.on_btn);
		bg_off = BitmapFactory.decodeResource(getResources(),
				R.drawable.off_btn);
		slipper_btn = BitmapFactory.decodeResource(getResources(),
				R.drawable.white_btn);
		setOnTouchListener(this);
	}

	protected void onDraw(Canvas canvas) {
		super.onDraw(canvas);
		Matrix matrix = new Matrix();
		Paint paint = new Paint();
		float x = 0;
		if (bg_on != null && bg_off != null) {
			if (nowX < (bg_on.getWidth() / 2)) {
				canvas.drawBitmap(bg_off, matrix, paint);
			} else {
				canvas.drawBitmap(bg_on, matrix, paint);
			}
		}

		if (onSlip) {
			if (nowX >= bg_on.getWidth())
				x = bg_on.getWidth() - slipper_btn.getWidth() / 2;
			else
				x = nowX - slipper_btn.getWidth() / 2;
		} else {
			if (nowStatus) {
				x = bg_on.getWidth() - slipper_btn.getWidth();
			} else {
				x = 0;
			}
		}

		if (x < 0) {
			x = 0;
		} else if (x > bg_on.getWidth() - slipper_btn.getWidth()) {
			x = bg_on.getWidth() - slipper_btn.getWidth();
		}

		canvas.drawBitmap(slipper_btn, x, 0, paint);
	}

	@Override
	public boolean onTouch(View v, MotionEvent event) {
		switch (event.getAction()) {
		case MotionEvent.ACTION_DOWN: {
			if (event.getX() > bg_off.getWidth()
					|| event.getY() > bg_off.getHeight()) {
				return false;
			} else {
				onSlip = true;
				downX = event.getX();
				nowX = downX;
			}
			break;
		}
		case MotionEvent.ACTION_MOVE: {
			nowX = event.getX();
			break;
		}
		case MotionEvent.ACTION_UP: {
			onSlip = false;
			if (event.getX() >= (bg_on.getWidth() / 2)) {
				nowStatus = true;
				nowX = bg_on.getWidth() - slipper_btn.getWidth();
			} else {
				nowStatus = false;
				nowX = 0;
			}

			if (listener != null) {
				listener.OnChanged(SwitchControlView.this, nowStatus);
			}
			break;
		}
		}
		invalidate();
		return true;
	}

	public void setOnChangedListener(OnChangedListener listener) {
		this.listener = listener;
	}

	public void setChecked(boolean checked) {
		if (checked) {
			nowX = bg_off.getWidth();
		} else {
			nowX = 0;
		}
		nowStatus = checked;
	}

	public interface OnChangedListener {
		public void OnChanged(SwitchControlView wiperSwitch, boolean checkState);
	}

}

2.自定义View 布局

    <com.programandroid.CustomView.SwitchControlView
        android:id="@+id/switch_control_view"
        android:layout_width="100dp"
        android:layout_height="50dp"
        android:layout_gravity="center_vertical" />

3. 自定义View 素材

toggle_off.png
toggle_on.png

4. Activity使用自定义View

		/**
	 * InitSwitchView 自定义滑动开关实现
	 */
	private void InitSwitchView() {
		// TODO Auto-generated method stub
		SwitchControlView wiperSwitch = (SwitchControlView) findViewById(R.id.switch_control_view);
		wiperSwitch.setChecked(true);
		wiperSwitch.setOnChangedListener(new OnChangedListener() {

			@Override
			public void OnChanged(SwitchControlView wiperSwitch,
					boolean checkState) {
				// TODO Auto-generated method stub

				if (checkState) {
					Toast.makeText(CustomViewMethods.this, "开启", 1).show();

				} else {
					Toast.makeText(CustomViewMethods.this, "关闭", 1).show();
				}
			}
		});
	}

至此,本篇已结束,如有不对的地方,欢迎您的建议与指正。同时期待您的关注,感谢您的阅读,谢谢!

微信关注公众号:  程序员Android,领福利

posted @ 2019-08-06 17:59  程序员Android  阅读(332)  评论(0编辑  收藏  举报