自定义控件-滑动旋钮的实现

自定义控件---滑动按钮的实现

package cn.flyaudio.android;import android.content.Context;import android.content.res.TypedArray;import android.graphics.Bitmap;import android.graphics.Canvas;import android.graphics.Paint;import android.graphics.PixelFormat;import android.graphics.Rect;import android.graphics.drawable.Drawable;import android.util.AttributeSet;import android.view.MotionEvent;import android.view.View;import android.view.View.OnTouchListener;public class SlipButton extends View implements OnTouchListener {private String TAG = "SlipButton";private boolean onSlip = false;//记录用户是否在滑动的变量private float downX, nowX, oldX;//按下时的x,当前的xprivate Bitmap slip_btn_down, slip_btn_thumb, slip_btn_up, slip_btn_bg;//图片private Rect slip_thumb_rect;//矩形public SlipButton(Context context, AttributeSet attrs, int defStyle) {super(context, attrs, defStyle);// TODO Auto-generated constructor stubinit(context, attrs);}public SlipButton(Context context, AttributeSet attrs) {super(context, attrs);// TODO Auto-generated constructor stubinit(context, attrs);}//初始化private void init(Context context, AttributeSet attrs) { // 跟values/attrs.xml里面定义的属性绑定TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.SlipButton);slip_btn_down = drawableToBitmap(a.getDrawable(R.styleable.SlipButton_slip_btn_down)); //按下图片slip_btn_thumb = drawableToBitmap(a.getDrawable(R.styleable.SlipButton_slip_btn_thumb));//滑动图片slip_btn_up = drawableToBitmap(a.getDrawable(R.styleable.SlipButton_slip_btn_up)); //为按下的图片//返回一个绑定结束的信号给资源a.recycle();slip_btn_bg = slip_btn_up;slip_thumb_rect = new Rect(0, 0, slip_btn_bg.getWidth(), slip_btn_bg.getHeight());setOnTouchListener(this);// 设置监听器}//绘制部分@Overrideprotected void onDraw(Canvas canvas) {// TODO Auto-generated method stubsuper.onDraw(canvas);Paint paint = new Paint();canvas.drawBitmap(slip_btn_bg, 0, 0, paint);if(!onSlip){//在没有滑动的情况下if(nowX <= slip_btn_bg.getWidth()/2){canvas.save();//记录原来的canvas状态canvas.clipRect(slip_thumb_rect);canvas.drawBitmap(slip_btn_thumb,slip_btn_bg.getWidth()-slip_btn_thumb.getWidth(),0,paint); canvas.restore();//恢复canvas状态}else if(nowX > slip_btn_bg.getWidth()/2){canvas.save();//记录原来的canvas状态canvas.clipRect(slip_thumb_rect);canvas.drawBitmap(slip_btn_thumb,0, 0,paint); canvas.restore();//恢复canvas状态}}else if(onSlip){//在滑动的情况下canvas.save();//记录原来的canvas状态canvas.clipRect(slip_thumb_rect);if(nowX < oldX){//向左滑的时候if((nowX-oldX) > slip_btn_bg.getWidth()-slip_btn_thumb.getWidth()){canvas.drawBitmap(slip_btn_thumb,nowX-oldX, 0,paint); }else{canvas.drawBitmap(slip_btn_thumb,slip_btn_bg.getWidth()-slip_btn_thumb.getWidth(), 0,paint); }}else if(nowX > oldX ){//向右滑的时候if((slip_btn_bg.getWidth()-slip_btn_thumb.getWidth()) +(nowX - oldX) <0){canvas.drawBitmap(slip_btn_thumb,(slip_btn_bg.getWidth()-slip_btn_thumb.getWidth()) +(nowX - oldX), 0,paint); }else{canvas.drawBitmap(slip_btn_thumb,0, 0,paint); }}canvas.restore();//恢复canvas状态}}//逻辑控制部分@Overridepublic boolean onTouch(View v, MotionEvent event) {// TODO Auto-generated method stub           switch(event.getAction())//根据动作来执行代码           {          case MotionEvent.ACTION_MOVE://滑动        if(event.getX()>slip_btn_bg.getWidth()||event.getY()>slip_btn_bg.getHeight() || event.getX()<0 || event.getY()<0)                  return false;         slip_btn_bg = slip_btn_down;            nowX = event.getX();  //得到的是触摸点相对于按钮的坐标            onSlip = true;              break;          case MotionEvent.ACTION_DOWN://按下           if(event.getX()>slip_btn_bg.getWidth()||event.getY()>slip_btn_bg.getHeight() || event.getX()<0 || event.getY()<0)              return false;          slip_btn_bg = slip_btn_down;            downX = event.getX();              nowX = downX;              oldX = downX;            break;          case MotionEvent.ACTION_UP://松开           slip_btn_bg = slip_btn_up;            onSlip = false;              break;          default:          }          invalidate();//重画控件           return true;      }          //将drawable转换为bitmap    public static Bitmap drawableToBitmap(Drawable drawable) {          // 取 drawable 的长宽          int w = drawable.getIntrinsicWidth();          int h = drawable.getIntrinsicHeight();          // 取 drawable 的颜色格式          Bitmap.Config config = drawable.getOpacity() != PixelFormat.OPAQUE ? Bitmap.Config.ARGB_8888                  : Bitmap.Config.RGB_565;          // 建立对应 bitmap          Bitmap bitmap = Bitmap.createBitmap(w, h, config);          // 建立对应 bitmap 的画布          Canvas canvas = new Canvas(bitmap);          drawable.setBounds(0, 0, w, h);          // 把 drawable 内容画到画布中          drawable.draw(canvas);          return bitmap;      }      }?

今天在公司写了一个自定义控件，主要是一个可以实现左右滑动的自定义按钮。

里面的涉及到的一些知识点主要有：

1、自定义控件的属性的设置；

2、自定义控件怎么继承View这个父类来写控件；

首先是自定义控件属性的设置：

<?xml version="1.0" encoding="utf-8"?> <resources> <declare-styleable name="SlipButton"><!-- 控件名称-->  <!-- 属性名称，类型-->  <attr name="slip_btn_down" format="reference"/>  <attr name="slip_btn_thumb" format="reference"/>  <attr name="slip_btn_up" format="reference"/> </declare-styleable></resources>

控件属性与XML定义绑定： // 跟values/attrs.xml里面定义的属性绑定TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.SlipButton);slip_btn_down = drawableToBitmap(a.getDrawable(R.styleable.SlipButton_slip_btn_down)); //按下图片slip_btn_thumb = drawableToBitmap(a.getDrawable(R.styleable.SlipButton_slip_btn_thumb));//滑动图片slip_btn_up = drawableToBitmap(a.getDrawable(R.styleable.SlipButton_slip_btn_up)); //为按下的图片//返回一个绑定结束的信号给资源a.recycle();

 //将drawable转换为bitmap    public static Bitmap drawableToBitmap(Drawable drawable) {          // 取 drawable 的长宽          int w = drawable.getIntrinsicWidth();          int h = drawable.getIntrinsicHeight();          // 取 drawable 的颜色格式          Bitmap.Config config = drawable.getOpacity() != PixelFormat.OPAQUE ? Bitmap.Config.ARGB_8888                  : Bitmap.Config.RGB_565;          // 建立对应 bitmap          Bitmap bitmap = Bitmap.createBitmap(w, h, config);          // 建立对应 bitmap 的画布          Canvas canvas = new Canvas(bitmap);          drawable.setBounds(0, 0, w, h);          // 把 drawable 内容画到画布中          drawable.draw(canvas);          return bitmap; 

??????????? TypedArray其实就是一个存放资源的Array，首先从上下文中获取到

R.styleable.SlipButton这个属性资源的资源数组。attrs是构造函数传进来，应该就是对应attrs.xml文件。a.getString(R.styleable.SlipButton_slip_btn_thumb);这句代码就是获取attrs.xml中定义的属性，并将这个属性的值传给本控件的slip_btn_thumb.最后，返回一个绑定结束的信号给资源：a.recycle()；绑定结束。在xml中对控件赋初始值：<?xml version="1.0" encoding="utf-8"?><!-- 一定要声明命名空间 --><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:flyaudio="http://schemas.android.com/apk/res/cn.flyaudio.android"    android:orientation="vertical"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    > <cn.flyaudio.android.SlipButton        android:id = "@+id/slipBtn"          android:layout_width="wrap_content"           android:layout_height="wrap_content"          android:layout_marginLeft = "100sp"           flyaudio:slip_btn_thumb="@drawable/slip_btn_thumb"        flyaudio:slip_btn_down="@drawable/slip_btn_down"        flyaudio:slip_btn_up="@drawable/slip_btn_up"    />  </LinearLayout>红色部分首先声明命名空间。命名空间为fsms.路径是http://schemas.android.com/apk/res/这一部分是不变的，后面接的是R的路径:cn.flyaudio.android。然后在自定义控件的xml描述中就可以这样使用flyaudio:slip_btn_thumb="@drawable/slip_btn_thumb"。这样就实现了自定义控件的初始化赋值。

?