android 滚动条源码,Android编程实现可滑动的开关效果(附demo源码下载)

本文实例讲述了Android编程实现可滑动的开关效果。分享给大家供大家参考，具体如下：

闲着没事，把之前写的一个Demo放上来分享下。就是一个开关，实现可滑动和动画效果。不是图片切换。

好了，先上图：

完整实例代码点击此处本站下载。

直接把自定义的这个View代码放上来，有注释应该很好理解：

首先是布局：

android:id="@+id/sv_container"

android:layout_width="230dip"

android:layout_height="38dip"

android:background="@drawable/usage_list_dark" >

android:id="@+id/iv_switch_cursor"

android:layout_width="120dip"

android:layout_height="36dip"

android:layout_centerVertical="true"

android:layout_marginLeft="0.5dip"

android:layout_marginRight="0.5dip"

android:background="@drawable/usage_list_green" />

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:gravity="center" >

android:id="@+id/switch_text_true"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_weight="1"

android:gravity="center"

android:text="开" />

android:id="@+id/switch_text_false"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_weight="1"

android:gravity="center"

android:text="关" />

接着是这个View的代码，继承自LinearLayout ：

package com.lxb.switchdemo;

import android.content.Context;

import android.graphics.Color;

import android.os.Handler;

import android.os.Message;

import android.view.LayoutInflater;

import android.view.MotionEvent;

import android.view.View;

import android.view.View.OnClickListener;

import android.view.animation.Animation;

import android.view.animation.Animation.AnimationListener;

import android.view.animation.LinearInterpolator;

import android.view.animation.TranslateAnimation;

import android.widget.ImageView;

import android.widget.LinearLayout;

import android.widget.RelativeLayout;

import android.widget.TextView;

public class SwitchView extends LinearLayout implements OnClickListener {

private static final int FLAG_MOVE_TRUE = 1; // 向左滑动标识

private static final int FLAG_MOVE_FALSE = 2; // 向右滑动标识

private static final int HANDLE_LAYOUT_CURSOR = 100; // 处理调用开关的layout方法

private Context context; // 上下文对象

private RelativeLayout sv_container; // SwitchView的外层Layout

private ImageView iv_switch_cursor; // 开关邮标的ImageView

private TextView switch_text_true; // true的文字信息控件

private TextView switch_text_false; // false的文字信息控件

private boolean isChecked = true; // 是否已开

private boolean checkedChange = false; // isChecked是否有改变

private OnCheckedChangeListener onCheckedChangeListener; // 用于监听isChecked是否有改变

private int margin = 1; // 游标离边缘位置(这个值视图片而定, 主要是为了图片能显示正确)

private int bg_left; // 背景左

private int bg_right; // 背景右

private int cursor_left; // 游标左部

private int cursor_top; // 游标顶部

private int cursor_right; // 游标右部

private int cursor_bottom; // 游标底部

private Animation animation; // 移动动画

private int currentFlag = FLAG_MOVE_TRUE; // 当前移动方向flag

public SwitchView(Context context) {

super(context);

this.context = context;

initView();

}

@Override

protected void onLayout(boolean changed, int l, int t, int r, int b) {

super.onLayout(changed, l, t, r, b);

// 获取所需要的值

bg_left = sv_container.getLeft();

bg_right = sv_container.getRight();

cursor_left = iv_switch_cursor.getLeft();

cursor_top = iv_switch_cursor.getTop();

cursor_right = iv_switch_cursor.getRight();

cursor_bottom = iv_switch_cursor.getBottom();

}

private Handler mHandler = new Handler() {

@Override

public void handleMessage(Message msg) {

switch(msg.what) {

case HANDLE_LAYOUT_CURSOR:

iv_switch_cursor.layout(cursor_left, cursor_top, cursor_right, cursor_bottom);

break;

}

}

};

public void onClick(View v) {

// 控件点击时触发改变checked值

if(v == this) {

changeChecked(!isChecked);

}

}

/**

* 初始化控件

*/

private void initView() {

LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);

View view = inflater.inflate(R.layout.switch_view, this);

view.setOnClickListener(this);

sv_container = (RelativeLayout) view.findViewById(R.id.sv_container);

switch_text_true = (TextView) view.findViewById(R.id.switch_text_true);

switch_text_false = (TextView) view.findViewById(R.id.switch_text_false);

changeTextColor();

iv_switch_cursor = (ImageView) view.findViewById(R.id.iv_switch_cursor);

iv_switch_cursor.setClickable(false);

iv_switch_cursor.setOnTouchListener(new OnTouchListener() {

int lastX; // 最后的X坐标

public boolean onTouch(View v, MotionEvent event) {

switch(event.getAction()) {

case MotionEvent.ACTION_DOWN:

lastX = (int) event.getRawX();

cursor_left = v.getLeft();

cursor_top = v.getTop();

cursor_right = v.getRight();

cursor_bottom = v.getBottom();

break;

case MotionEvent.ACTION_MOVE:

int dx = (int) event.getRawX() - lastX;

cursor_left = v.getLeft() + dx;

cursor_right = v.getRight() + dx;

// 超出边界处理

if(cursor_left <= bg_left + margin) {

cursor_left = bg_left + margin;

cursor_right = cursor_left + v.getWidth();

}

if(cursor_right >= bg_right - margin) {

cursor_right = bg_right - margin;

cursor_left = cursor_right - v.getWidth();

}

v.layout(cursor_left, cursor_top, cursor_right, cursor_bottom);

lastX = (int) event.getRawX();

break;

case MotionEvent.ACTION_UP:

calculateIscheck();

break;

}

return true;

}

});

}

/**

* 计算处于true或是false区域, 并做改变处理

*/

private void calculateIscheck() {

float center = (float) ((bg_right - bg_left) / 2.0);

float cursor_center = (float) ((cursor_right - cursor_left) / 2.0);

if(cursor_left + cursor_center <= center) {

changeChecked(true);

} else {

changeChecked(false);

}

}

/**

* 改变checked, 根据checked移动游标

* @param isChecked

*/

private void changeChecked(boolean isChecked) {

if(this.isChecked != isChecked) {

checkedChange = true;

} else {

checkedChange = false;

}

if(isChecked) {

currentFlag = FLAG_MOVE_TRUE;

} else {

currentFlag = FLAG_MOVE_FALSE;

}

cursorMove();

}

/**

* 游标移动

*/

private void cursorMove() {

// 这里说明一点, 动画本可设置animation.setFillAfter(true)

// 令动画进行完后停在最后位置. 但这里使用这样方式的话.

// 再次拖动图片会出现异常(具体原因我没找到)

// 所以最后只能使用onAnimationEnd回调方式再layout游标

animation = null;

final int toX;

if(currentFlag == FLAG_MOVE_TRUE) {

toX = cursor_left - bg_left - margin;

animation = new TranslateAnimation(0, -toX, 0, 0);

} else {

toX = bg_right - margin - cursor_right;

animation = new TranslateAnimation(0, toX, 0, 0);

}

animation.setDuration(100);

animation.setInterpolator(new LinearInterpolator());

animation.setAnimationListener(new AnimationListener() {

public void onAnimationStart(Animation animation) {

}

public void onAnimationRepeat(Animation animation) {

}

public void onAnimationEnd(Animation animation) {

// 计算动画完成后游标应在的位置

if(currentFlag == FLAG_MOVE_TRUE) {

cursor_left -= toX;

cursor_right = cursor_left + iv_switch_cursor.getWidth();

} else {

cursor_right = bg_right - margin;

cursor_left = cursor_right - iv_switch_cursor.getWidth();

}

// 这里不能马上layout游标正确位置, 否则会有一点点闪屏

// 为了美观, 这里迟了一点点调用layout方法, 便不会闪屏

mHandler.sendEmptyMessageDelayed(HANDLE_LAYOUT_CURSOR, 5);

// 这里是根据是不是改变了isChecked值进行一些操作

if(checkedChange) {

isChecked = !isChecked;

if(onCheckedChangeListener != null) {

onCheckedChangeListener.onCheckedChanged(isChecked);

}

changeTextColor();

}

}

});

iv_switch_cursor.startAnimation(animation);

}

/**

* 改变字体显示颜色

*/

private void changeTextColor() {

if(isChecked) {

switch_text_true.setTextColor(Color.WHITE);

switch_text_false.setTextColor(Color.GRAY);

} else {

switch_text_true.setTextColor(Color.GRAY);

switch_text_false.setTextColor(Color.WHITE);

}

}

/**

* layout游标

*/

private void layoutCursor() {

if(isChecked) {

cursor_left = bg_left + margin;

cursor_right = bg_left + margin + iv_switch_cursor.getWidth();

} else {

cursor_left = bg_right - margin - iv_switch_cursor.getWidth();

cursor_right = bg_right - margin;

}

iv_switch_cursor.layout(cursor_left, cursor_top, cursor_right, cursor_bottom);

}

/**

* isChecked值改变监听器

*/

public interface OnCheckedChangeListener {

void onCheckedChanged(boolean isChecked);

}

public boolean isChecked() {

return isChecked;

}

public void setChecked(boolean isChecked) {

if(this.isChecked != isChecked) {

this.isChecked = isChecked;

if(onCheckedChangeListener != null) {

onCheckedChangeListener.onCheckedChanged(isChecked);

}

layoutCursor();

}

}

public void setOnCheckedChangeListener(

OnCheckedChangeListener onCheckedChangeListener) {

this.onCheckedChangeListener = onCheckedChangeListener;

}

}

最后是Activity使用这个View:

package com.lxb.switchdemo;

import android.app.Activity;

import android.os.Bundle;

import android.view.View;

import android.view.View.OnClickListener;

import android.widget.Button;

import android.widget.LinearLayout;

import android.widget.TextView;

import android.widget.Toast;

import com.lxb.switchdemo.SwitchView.OnCheckedChangeListener;

public class Switch_demoActivity extends Activity implements OnClickListener {

private LinearLayout layout;

private TextView tv_showcheck;

private SwitchView sv;

private Button btn_set_true;

private Button btn_set_false;

private Button btn_getstate;

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.main);

layout = (LinearLayout) findViewById(R.id.layout);

tv_showcheck = (TextView) findViewById(R.id.tv_showcheck);

sv = new SwitchView(this);

tv_showcheck.setText("当前状态: " + getState(sv.isChecked()));

sv.setOnCheckedChangeListener(new OnCheckedChangeListener() {

public void onCheckedChanged(boolean isChecked) {

tv_showcheck.setText("当前状态: " + getState(isChecked));

}

});

layout.addView(sv);

btn_set_true = (Button) findViewById(R.id.btn_set_true);

btn_set_false = (Button) findViewById(R.id.btn_set_false);

btn_getstate = (Button) findViewById(R.id.btn_getstate);

btn_set_true.setOnClickListener(this);

btn_set_false.setOnClickListener(this);

btn_getstate.setOnClickListener(this);

}

public void onClick(View v) {

switch(v.getId()) {

case R.id.btn_set_true:

sv.setChecked(true);

break;

case R.id.btn_set_false:

sv.setChecked(false);

break;

case R.id.btn_getstate:

Toast.makeText(Switch_demoActivity.this,

sv.isChecked() + "", Toast.LENGTH_SHORT).show();

break;

}

}

private String getState(boolean state) {

if(state) {

return "开";

}

return "关";

}

}

实现起来还是很简单的，主要还是坐标什么的需要计算与调整。

当然可能还会有一些BUG存在，有需要的可以下下来自行修改，也可以和我讨论。

希望本文所述对大家Android程序设计有所帮助。