自定义View

最新推荐文章于 2024-09-12 17:47:02 发布

bianshaopeng

最新推荐文章于 2024-09-12 17:47:02 发布

阅读量301

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/bianshaopeng/article/details/48572353

本文详细介绍了自定义时钟、进度条等组件的实现原理及代码解析，包括使用Canvas绘制时钟指针、进度条动画效果，以及不同类型的进度条实现方式，如圆形、矩形和环形进度条。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

时钟

public class MyView extends View {
    private int width;
    private int height;
    private Paint mPaintLine;
    private Paint mPaintCircle;
    private Paint mPaintText;
    private Calendar mCanlender;
    private Handler handler=new Handler(){
        @Override
        public void handleMessage(Message msg) {
            super.handleMessage(msg);
            switch (msg.what){
                case 0x23:
                    mCanlender=Calendar.getInstance();
                    invalidate();
                    handler.sendEmptyMessageDelayed(0x23,1000);
                    break;
            }
        }
    };
    public MyView(Context context) {
        super(context);
    }

    public MyView(Context context, AttributeSet attrs) {
        super(context, attrs);

        //划线
        mPaintLine=new Paint();
        mPaintLine.setColor(Color.RED);//设置线的颜色
        mPaintLine.setStrokeWidth(10);//设置线的宽度
        mPaintLine.setAntiAlias(true);//设置抗锯齿

        //画圆
        mPaintCircle=new Paint();
        mPaintCircle.setColor(Color.BLUE);
        mPaintCircle.setStrokeWidth(10);
        mPaintCircle.setAntiAlias(true);//设置抗锯齿
        mPaintCircle.setStyle(Paint.Style.STROKE);//设置为空心圆

        //文本
        mPaintText=new Paint();
        mPaintText.setColor(Color.RED);
        mPaintText.setTextSize(30);
        mPaintText.setTextAlign(Paint.Align.CENTER);
        handler.sendEmptyMessage(0x23);//发送消息
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        width=getDefaultSize(getSuggestedMinimumWidth(),widthMeasureSpec);
        height=getDefaultSize(getSuggestedMinimumHeight(),heightMeasureSpec);
        setMeasuredDimension(width,height);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
       // canvas.drawLine(0,0,400,500,mPaintLine);
       // canvas.drawCircle(400,500,200,mPaintCircle);
        canvas.drawCircle(width/2,height/2,300,mPaintCircle);
        canvas.drawCircle(width/2,height/2,10,mPaintLine);
        for (int i=1;i<=12;i++){
            canvas.rotate(360/12,width/2,height/2);
            canvas.drawLine(width/2,height/2-300,width/2,height/2-300+30,mPaintLine);
            canvas.drawText(""+i,width/2,height/2-240,mPaintText);

        }
       // mCanlender=Calendar.getInstance();
        int minute=mCanlender.get(Calendar.MINUTE);
        int hour=mCanlender.get(Calendar.HOUR);
        int second=mCanlender.get(Calendar.SECOND);
        //分针
        float minutedegree=minute/60f*360;
        canvas.save();
        canvas.rotate(minutedegree,width/2,height/2);
        canvas.drawLine(width/2,height/2-150,width/2,height/2+20,mPaintLine);
        canvas.restore();
        //时针
        float hourdegree=(hour*60+minute)/12f/60*360;
        canvas.save();
        canvas.rotate(hourdegree,width/2,height/2);
        canvas.drawLine(width/2,height/2-120,width/2,height/2+20,mPaintLine);
        canvas.restore();
        //秒针
        float seconddegree=second*6f;
        canvas.save();
        canvas.rotate(seconddegree,width/2,height/2);
        canvas.drawLine(width/2,height/2-180,width/2,height/2+20,mPaintLine);
        canvas.restore();
    }
}

这里写图片描述

自定义进度条

public class MyProgresbar extends View {
    private int width;
    private int height;
    private Paint mPaintGrond;
    private Paint mPaintText;
    private Paint mPaintCurrent;
    public int progress;

    public void setProgress(int progress) {
        this.progress = progress;
    }

    public int getProgress() {
        return progress;
    }

    public MyProgresbar(Context context) {
        super(context);
    }

    public MyProgresbar(Context context, AttributeSet attrs) {
        super(context, attrs);
        //文本
        mPaintText=new Paint();
        mPaintText.setColor(Color.GREEN);
        mPaintText.setAntiAlias(true);
        mPaintText.setTextAlign(Paint.Align.CENTER);
        mPaintText.setTextSize(60);
        //外圆
        mPaintGrond=new Paint();
        mPaintGrond.setAntiAlias(true);
        mPaintGrond.setColor(Color.BLACK);
        mPaintGrond.setStyle(Paint.Style.STROKE);
        //内圆
        mPaintCurrent=new Paint();
        mPaintCurrent.setAntiAlias(true);
        mPaintCurrent.setColor(Color.BLUE);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        width=getDefaultSize(getSuggestedMinimumWidth(),widthMeasureSpec);
        height=getDefaultSize(getSuggestedMinimumHeight(), heightMeasureSpec);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.drawCircle(width / 2, height / 2, 300, mPaintGrond);
        canvas.drawCircle(width/2,height/2,getProgress(),mPaintCurrent);
        float degree=getProgress()/300f*100;
        canvas.drawText(degree+"%",width/2,height/2,mPaintText);
    }
}

//MainActivity
public class MainActivity extends AppCompatActivity {
    private Button mButtonDown;
    private MyProgresbar myProgresbar;
    private int progress;
    private Handler handler=new Handler(){
        @Override
        public void handleMessage(Message msg) {
            super.handleMessage(msg);
            switch (msg.what){
                case 0x23:
                    progress++;
                    myProgresbar.invalidate();
                    if (progress<=300){
                        myProgresbar.setProgress(progress);
                        handler.sendEmptyMessageDelayed(0x23,100);
                    }
                    break;
            }
        }
    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        myProgresbar= (MyProgresbar) findViewById(R.id.myprogresbar);
        mButtonDown= (Button) findViewById(R.id.button_download);
        mButtonDown.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                progress=0;
                handler.sendEmptyMessage(0x23);
            }
        });
    }
}

这里写图片描述

矩形进度条

public class MygrogresbarRect extends View {
    private int width;
    private int height;
    private Paint mPaintRect;
    private Paint mPaintRectChange;
    private Paint mPaintLine;
    private Paint mPaintText;
    private int progress;

    public void setProgress(int progress) {
        this.progress = progress;
    }

    public int getProgress() {
        return progress;
    }

    public MygrogresbarRect(Context context) {
        super(context);
    }

    public MygrogresbarRect(Context context, AttributeSet attrs) {
        super(context, attrs);
        //文本
        mPaintText=new Paint();
        mPaintText.setColor(Color.BLACK);
        mPaintText.setTextAlign(Paint.Align.CENTER);
        mPaintText.setTextSize(60);
        //线条
        mPaintLine=new Paint();
        mPaintLine.setColor(Color.RED);//设置线的颜色
        mPaintLine.setStrokeWidth(10);//设置线的宽度
        mPaintLine.setAntiAlias(true);//设置抗锯齿

        //矩形
        mPaintRect=new Paint();
        mPaintRect.setAntiAlias(true);
        mPaintRect.setColor(Color.GREEN);
        mPaintRect.setStrokeWidth(10);
        //变化矩形
        mPaintRectChange=new Paint();
        mPaintRectChange.setAntiAlias(true);
        mPaintRectChange.setColor(Color.RED);
        mPaintRectChange.setStrokeWidth(10);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        width=getDefaultSize(getSuggestedMinimumWidth(),widthMeasureSpec);
        height=getDefaultSize(getSuggestedMinimumHeight(),heightMeasureSpec);
        setMeasuredDimension(width,height);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.drawRect(200,120,400,400,mPaintRect);
        canvas.drawRect(200,400-getProgress(),400,400,mPaintRectChange);
        canvas.drawText((getProgress()/280f)*100+"%",300,260,mPaintText);

    }
}

              //MainActivity

public class MainActivity extends AppCompatActivity {
    private Button mButtonStart;
    private MygrogresbarRect mygrogresbarRect;
    private int progress;
    private Handler handler=new Handler(){
        @Override
        public void handleMessage(Message msg) {
            super.handleMessage(msg);
            switch (msg.what){
                case 0x23:
                    progress++;
                    mygrogresbarRect.invalidate();
                    if (progress<=280){
                        mygrogresbarRect.setProgress(progress);
                        handler.sendEmptyMessageDelayed(0x23,50);
                    }

                    break;
            }
        }
    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mygrogresbarRect= (MygrogresbarRect) findViewById(R.id.myprogressbar);
        mButtonStart= (Button) findViewById(R.id.button_start);
        mButtonStart.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                progress=0;
                handler.sendEmptyMessage(0x23);
            }
        });
    }

}

这里写图片描述

环形进度条

public class MyprogressRing extends View {
    private int width;
    private int height;
    private Paint mPaintLine;
    private Paint mPaintText;
    private Paint mPaintGroud;
    private Paint mPaintInside;
    private int progress;

    public void setProgress(int progress) {
        this.progress = progress;
    }

    public int getProgress() {
        return progress;
    }

    public MyprogressRing(Context context) {
        super(context);
    }

    public MyprogressRing(Context context, AttributeSet attrs) {
        super(context, attrs);
        //线
        mPaintLine=new Paint();
        mPaintLine.setAntiAlias(true);
        mPaintLine.setColor(Color.RED);
        mPaintLine.setStrokeWidth(2);
        //文本
        mPaintText=new Paint();
        mPaintText.setTextAlign(Paint.Align.CENTER);
        mPaintText.setAntiAlias(true);
        mPaintText.setColor(Color.RED);
        mPaintText.setTextSize(60);
        //外圆
        mPaintGroud=new Paint();
        mPaintGroud.setAntiAlias(true);
        mPaintGroud.setColor(Color.GRAY);
        mPaintGroud.setStyle(Paint.Style.STROKE);
        //内圆
        mPaintInside=new Paint();
        mPaintInside.setAntiAlias(true);
        mPaintInside.setColor(Color.GREEN);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        width=getDefaultSize(getSuggestedMinimumWidth(),widthMeasureSpec);
        height=getDefaultSize(getSuggestedMinimumHeight(),heightMeasureSpec);
        setMeasuredDimension(width,height);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.drawCircle(width/2,height/2,300,mPaintGroud);
        canvas.drawCircle(width/2,height/2,200,mPaintInside);
        canvas.drawText(progress/360f*100+"%",width/2,height/2,mPaintText);
        for (int i=1;i<=progress;i++){
            canvas.rotate(1,width/2,height/2);
            canvas.drawLine(width/2,height/2-300,width/2,height/2-200,mPaintLine);

        }

    }
}

            //MainActivity

 public class MainActivity extends AppCompatActivity {
    private Button mButton;
    private MyprogressRing myprogressRing;
    private int progress;
    private Handler handler=new Handler(){
        @Override
        public void handleMessage(Message msg) {
            super.handleMessage(msg);
            switch (msg.what){
                case 0x23:
                    progress++;
                    myprogressRing.invalidate();
                    if (progress<=360)
                    myprogressRing.setProgress(progress);
                    handler.sendEmptyMessageDelayed(0x23,50);
                    break;
            }
        }
    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        myprogressRing= (MyprogressRing) findViewById(R.id.myprogressring);
        mButton= (Button) findViewById(R.id.button);
        mButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                progress=0;
                handler.sendEmptyMessage(0x23);
            }
        });
    }

}

这里写图片描述