zoukankan      html  css  js  c++  java
  • andorid 自己定义SwitchButton

    因项目缘故需又一次定制SwitchButton,效果例如以下:

     

    步骤例如以下:

    1.圆角矩形的绘制

    2.字体绘制

    3.小圆绘制

    4.左右滑动动画效果绘制

    代码例如以下:

    package com.smart.view;
    
    import java.util.Timer;
    import java.util.TimerTask;
    
    import android.annotation.SuppressLint;
    import android.content.Context;
    import android.graphics.Canvas;
    import android.graphics.Color;
    import android.graphics.Paint;
    import android.graphics.Paint.FontMetrics;
    import android.graphics.Rect;
    import android.graphics.RectF;
    import android.util.AttributeSet;
    import android.view.MotionEvent;
    import android.view.View;
    
    public class MySwitchButton extends View{
    	
    	private int w, h;//组件宽高
    	private boolean flag_switch;//开关标志
    	private boolean flag_touch;//触摸标志
    	private String ON = "ON";
    	private String OFF = "OFF";
    	private float textSize = 40;//字体大小
    	private int color1 = 0xff999999;//关背景颜色
    	private int color2 = 0xff3e9edb;//开背景颜色
    	private int color_bg = color1;
    	private int circle_bg_nomal = Color.WHITE;//圆正常情况下的背景
    	private int circle_bg_touch = Color.YELLOW;//触摸时圆的背景
    	
    	//圆心
    	private float y;
    	private float x;
    	private float radius;//圆半径
    	private int distance = 10;//左右边距
    	
    	private OnCircleClickListner mOnCircleClickListner;
    
    	public MySwitchButton(Context context) {
    		super(context);
    		System.out.println("---MySwitchButton1---");
    	}
    
    
    	public MySwitchButton(Context context, AttributeSet attrs, int defStyleAttr) {
    		super(context, attrs, defStyleAttr);
    		System.out.println("---MySwitchButton2---");
    	}
    
    	public MySwitchButton(Context context, AttributeSet attrs) {
    		super(context, attrs);
    		System.out.println("---MySwitchButton3---");
    	}
    	
    	public void setOnCircleClickListner(OnCircleClickListner mOnCircleClickListner){
    		this.mOnCircleClickListner = mOnCircleClickListner;
    	}
    	
    	
    	
    	public boolean isFlag_switch() {
    		return flag_switch;
    	}
    
    	public void setChecked(boolean flag_switch) {
    		this.flag_switch = flag_switch;
    		if(flag_switch){
    			x = distance+radius;
    			color_bg = color2;
    		}else{
    			x = w-(distance+radius);
    			color_bg = color1;
    		}
    		circleMove();
    //		invalidate();
    		
    	}
    
    	@Override
    	public boolean onTouchEvent(MotionEvent event) {
    //		float x = event.getX();
    //		float y = event.getY();
    
    		switch (event.getAction()) {
    		case MotionEvent.ACTION_DOWN:
    			
    			flag_touch = true;
    			invalidate();
    			break;
    		case MotionEvent.ACTION_MOVE:
    			break;
    		case MotionEvent.ACTION_UP:
    			if(mOnCircleClickListner!=null){
    				mOnCircleClickListner.onClick(MySwitchButton.this,!flag_switch);
    			}
    			flag_touch = false;
    			invalidate();
    			break;
    		}
    
    		return true;
    	}
    	
    	@Override
    	protected void onSizeChanged(int w, int h, int oldw, int oldh) {
    		super.onSizeChanged(w, h, oldw, oldh);
    		
    		this.w = w;
    		this.h = h;
    		y = h/2;
    		radius =  h/2-distance;
    		x = distance+radius;
    		
    //		color_bg = color1;
    		circleMove();
    //		invalidate();
    		System.out.println("-----onSizeChanged----");
    //		System.out.println("x:"+x);
    //		System.out.println("w:"+w);
    //		System.out.println("h:"+h);
    	}
    	
    	
    	@Override
    	protected void onDraw(Canvas canvas) {
    		System.out.println("-----onDraw----");
    		Paint paint = new Paint();
    		paint.setAntiAlias(true);
    		canvas2RoundRect(canvas,paint);//圆角矩形
    		canvas2Text(canvas,paint);//字体
    		canvas2Circle(canvas,paint);//小圆
    		super.onDraw(canvas);
    		
    		
    	}
    	
    	public void canvas2RoundRect(Canvas canvas,Paint paint){
    		paint.setColor(color_bg);
    		RectF oval3 = new RectF(0, 0, w, h); 
            canvas.drawRoundRect(oval3, 45, 45, paint);
    		
    	}
    	
    	public void canvas2Circle(Canvas canvas,Paint paint){
    		if(flag_touch){
    			paint.setColor(circle_bg_touch);
    		}else{
    			paint.setColor(circle_bg_nomal);
    		}
    //		circleMove();
    //		System.out.println("drawX:"+x);
    		canvas.drawCircle(x, y, radius, paint);
    	}
    	
    	Timer timer; 
    	TimerTask task;
    	public void circleMove(){//小圆运动轨迹
    		final float startX =distance+radius; 
    		final float endX = w-(distance+radius);
    		final long upDataDistance = 10;
    		if(timer!=null){
    			task.cancel();
    			timer.cancel();
    			timer=null;
    			task=null;
    		}
    		timer = new Timer();
    		task = new TimerTask() {
    			
    			@Override
    			public void run() {
    				if(flag_switch){
    					x+=upDataDistance;//打开
    				}else{
    					x-=upDataDistance;//关闭
    					
    				}
    				if(x>=endX){
    					x=endX;
    					this.cancel();
    					timer.cancel();
    					timer =null;
    				}else if(x<startX){
    					x = startX;
    					this.cancel();
    					timer.cancel();
    					timer =null;
    				}
    				postInvalidate();
    			}
    		};
    		timer.schedule(task, 8, 8);
    		
    	}
    	
    	public void canvas2Text(Canvas canvas,Paint paint){
    		
    		paint.setTextSize(textSize);
    		paint.setColor(Color.WHITE);
    		Rect rect = new Rect();
    		if(flag_switch){
    			paint.getTextBounds(ON, 0, ON.length()-1, rect); 
    			int textHight = rect.height();
    			float textWight = paint.measureText(ON);
    			canvas.drawText(ON, (w/2-textWight)/2, (h+textHight)/2, paint);
    		}else{
    			paint.getTextBounds(OFF, 0, OFF.length()-1, rect); 
    			float textWight = paint.measureText(OFF);
    			int textHight = rect.height();
    			canvas.drawText(OFF, w/2+(w/2-textWight)/2, (h+textHight)/2, paint);
    		}
    	}
    	
    	public interface OnCircleClickListner{
    		
    		public void onClick(View v,boolean flag);
    	}
    
    }
    
       <com.example.test_myview.MySwitchButton
            android:id="@+id/msb"
            android:layout_width="70dp"
            android:layout_height="27dp"
            
            />

    监听接口时要调用public void setChecked(boolean flag_switch)该方法才干使小球左右滑动

  • 相关阅读:
    如何动态改变ALV状态栏(Status)中的按钮文本和图标(Icon)
    redux计算器
    原生js轮播图
    原生js实现tab切换
    lynx---CentOS终端访问IP
    centos 下安装jdk、tomcat 以及tomcat无法从外部访问的解决办法
    CentOS-7.0.中安装与配置Tomcat-7的方法
    CSS实现自适应不同大小屏幕的背景大图
    在ssm框架中前后台数据交互均使用json格式
    Mybatis动态查询语句
  • 原文地址:https://www.cnblogs.com/gcczhongduan/p/5093117.html
Copyright © 2011-2022 走看看