Android自定义控件实现球赛比分条效果
程序员文章站
2022-08-20 16:09:28
本文实例为大家分享了android实现球赛比分条效果的具体代码,供大家参考,具体内容如下
效果图如下所示:
该控件需要输入两个参数,左边的得分数和右边的的分数...
本文实例为大家分享了android实现球赛比分条效果的具体代码,供大家参考,具体内容如下
效果图如下所示:
该控件需要输入两个参数,左边的得分数和右边的的分数
然后根据两边的得分的比例绘制中间的比分条
首先将控件的宽度平均分配为10分,第一份和最后一份分别绘制左边的比分数字和右边的比分数字
中间的8分宽度绘制比分条
根据左右两个比分所占的比例,绘制两个两条首位相连的线段即可
完整代码如下:
public class customscorebar extends view { private context context; private typedvalue typedvalue; private static final int degree =10; private int mcolorleft, mcolorright; private int mscoreleft, mscoreright; //各种画笔 private paint paintbar =new paint(); private paint painttext=new paint(); public customscorebar(context context) { super(context); this.context=context; init(); } public customscorebar(context context, attributeset attrs) { super(context, attrs); this.context=context; init(); } public customscorebar(context context, attributeset attrs, int defstyleattr) { super(context, attrs, defstyleattr); this.context=context; init(); } private void init() { //初始化数据,默认属性 mcolorleft = color.rgb(95, 112, 72); mcolorright = color.rgb(69, 91, 136); mscoreleft =5; mscoreright =8; typedvalue=new typedvalue(); context.gettheme().resolveattribute(r.attr.maintextclor,typedvalue,true); } @override protected void ondraw(canvas canvas) { super.ondraw(canvas); float width=getwidth(); float height=getheight(); //文字画笔设置 painttext.reset(); painttext.setantialias(true); //文字的大小取控件宽度的十分之一和高度的二分之一的最小值 painttext.settextsize(math.min(width / degree, height) / 2); painttext.setcolor(getresources().getcolor(typedvalue.resourceid)); /*paint.align.center:the text is drawn centered horizontally on the x,y origin*/ painttext.settextalign(paint.align.center); //绘制中间的横线的画笔 paintbar.reset(); paintbar.setantialias(true); paintbar.setstyle(paint.style.stroke); //画笔的高度为控件高度的十分之一 paintbar.setstrokewidth(height/10); //测量字体 paint.fontmetrics fontmetrics = painttext.getfontmetrics(); float textbaselineoffset = (fontmetrics.bottom - fontmetrics.top) / 2 - fontmetrics.bottom; //绘制左边的比分文字 //把控件宽度分为10份,第一份和第十份分别绘制左边和右边的文字 //中间的8份宽度绘制比分条 canvas.drawtext("" + mscoreleft, width / degree / 2, height / 2 + textbaselineoffset, painttext); paintbar.setcolor(mcolorleft); // drawline(float startx, float starty, float stopx, float stopy,paint paint)*/ //按照比例绘制左边比分对应长度的比分条 canvas.drawline(width / degree, height / 2, width / degree + width * (degree - 2) / degree * mscoreleft / (mscoreleft + mscoreright), height / 2, paintbar); //测量右边的比分文字 fontmetrics = painttext.getfontmetrics(); textbaselineoffset = (fontmetrics.bottom - fontmetrics.top) / 2 - fontmetrics.bottom; //在控件宽度的最后十分之一绘制右边的比分数字 canvas.drawtext("" + mscoreright, width-width / degree / 2, height / 2 + textbaselineoffset,painttext); paintbar.setcolor(mcolorright); //绘制右边的比分对应长度的比分条 canvas.drawline(width/ degree +width*(degree -2)/ degree * mscoreleft /(mscoreleft + mscoreright),height/2,width*(degree -1)/ degree,height/2, paintbar); } public void setscores(int score1, int score2) { this.mscoreleft =score1; this.mscoreright =score2; invalidate(); } }
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
上一篇: Android自定义控件实现带数值和动画的圆形进度条
下一篇: 乘坐飞机前的饮食