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()方法进行绘图.以及设置监听器.由于用法十分简单,我就不需要啰嗦了.其中有不妥之处,希望各位道友及时给我您宝贵的建议!

Android滑动开关-ToggleButton,布布扣,bubuko.com

时间: 2024-12-22 13:12:17

Android滑动开关-ToggleButton的相关文章

Android 自定义ToggleButton+用SharedPreferences保存用户配置

布局文件: <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/LinearLayout1" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@dr

Android的ToggleButton和Switch以及AnalogColok和DigitalColok的用法-android学习之旅(二十)

ToggleButton 和Switch简介 ToggleButton 和Switch都是继承了Button,所以他们的属性设置和Button差不多. 分别支持的属性 ToggleButton 的属性: Switch的属性: analogColok和DigitalColok简介 digitalColok继承了text,但是它的setText方法不能使用,能够显示精确到秒,作为数字的表,analogColok则是继承了View,进行了几何的重绘,不能显示秒. analogColok和Digital

android ——滑动开关

一 :效果图 开启时: 关闭时: 二:步骤: 1. 写一个类SlippingBtn继承View,并实现OnTouchListener接口.重写父类两个构造函数(一个参数的,二个参数的) 2. 初始化滑块的背景图片并记录滑动块处于开启和关闭时的位置,注册setOnTouchListener事件 开启时: 滑动块左边坐标:bg_on的宽度减去bg_slipping的宽度   滑动块上面坐标:0   滑动块右面坐标:bg_on的宽度   滑动块下面坐标:bg_slipping的高度关闭时:   滑动块

Android——图片视图(ImageView)、状态开关按钮(ToggleButton)、时钟

xml <?xml version="1.0" encoding="utf-8"?> <!--滚动视图--> <ScrollView xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_pare

Android控件——ToggleButton多状态按钮(实现灯泡的开关)

思路:通过点击根据按钮的选择状态与false状态设置图片的路径  1.布局文件: <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height=&qu

android控件之ToggleButton(多状态按钮)

一.概述 ToggleButton有两种状态:选中状态和没选中状态(类似一个开关),并且需要为不同的状态设置不同的显示文本 二.ToggleButton属性 android:checked = "true"  ——按钮的状态(true为选中(textOn),false为没有选中(textOff)) android:textOff = "关" android:textOn = "开" 三.代码演示 1.先将下面两个图片放入到资源文件中(分别命名为o

Android——图片视图(ImageView)、状态开关按钮(ToggleButton)、时钟、图片透明度、滚动和时间选择器

activity_ui1.xml dth="wrap_content" android:layout_height="wrap_content" android:textOn=" " android:textOff=" " android:background="@drawable/qq" android:id="@+id/tob1"/> <AnalogClock andro

6.Android之switch和togglebutton按钮学习

Switch和ToggleButton按钮在手机上也经常看到,比如手机设置里面wlan,蓝牙,gps开关等. 首先在工具上拖进一个switch和togglebutton开关按钮,如图 生成xml代码如下: 1 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 2 xmlns:tools="http://schemas.android.com/tools" 3 a

android基础二之ToggleButton

//activity_main.xml <LinearLayout 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_