本文实例为大家分享了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 比分牌效果,Android自定义控件实现球赛比分条效果相关推荐

  1. 自定义控件android特效,Android自定义控件eBook实现翻书效果实例详解

    本文实例讲述了Android自定义控件eBook实现翻书效果的方法.分享给大家供大家参考,具体如下: 效果图: Book.java文件: package com.book; import androi ...

  2. android 语音搜索动画,Android自定义控件实现UC浏览器语音搜索效果

    最近项目上要实现语音搜索功能,界面样式要模仿一下UC浏览器的样式,UC浏览器中有一个控件,会随着声音大小浮动,然后寻思偷个懒,百度一下,结果也没有找到类似的,只能自己动手了. 先上图看我实现的效果: ...

  3. android+ebook控件,Android 自定义控件 eBook 翻书效果

    Book.java文件: package com.book; import Android.app.Activity; import android.os.Bundle; import android ...

  4. android+广告栏效果,Android自定义控件之广告条滚动效果

    在一些电子商务网站上经常能够看到一些滚动的广告条,许多软件在首次使用时也有类似的广告条,如图: 其实在github上有实现这种效果的控件,不过这东西做起来也是很简单,我们今天就来看看该怎么做. 先来看 ...

  5. Android 自定义控件实现刮刮卡效果

    1简易画板的实现 我们的刮刮卡需要掌握绘图,当然了这里不要求你有美术天分,会瞎涂鸦就可以了~~ 下面开始我们的一个简易的画板,其实就是可以在上面画点线条,当然你也可以签个名,我们的View的叫做Gua ...

  6. Android 自定义控件实现刮刮卡效果 真的就只是刮刮卡么

    转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/40162163 , 本文出自:[张鸿洋的博客] 很久以前也过一个html5的刮刮卡 ...

  7. android 红包雨源代码,Android 红包雨效果自定义控件

    WX20201231-181616@2x.png 思路:利用Path绘制动画轨迹,再使用PathMeasure获取轨迹中的坐标位置实时改变view的坐标完成红包动画. 封装一个红包容器view用于管理 ...

  8. android小球移动代码,Android自定义圆形View实现小球跟随手指移动效果

    本文实例为大家分享了Android实现小球跟随手指移动效果的具体代码,供大家参考,具体内容如下 一. 需求功能 手指在屏幕上滑动,红色的小球始终跟随手指移动. 实现的思路: 1)自定义View,在on ...

  9. android自定义组件属性,android自定义控件并添加属性的方法以及示例

    安卓系统为我们提供了丰富的控件,但是在实际项目中我们仍然需要重新通过布局来实现一些效果,比如我们需要一个上面图标,下面文字的button,类似于下面这样的: 最直接的解决办法是通过将imageview ...

最新文章

  1. 【全网之最】JavaScript中字符串以特定字符分隔开之后,获取最后一个分割出来的字符串,多用于获取文件的后缀名(格式)
  2. vector操作小结
  3. 在nginx下配置PATH_INFO的方法,包含新老版本的设置方法,以及$_SERVER[PATH_INFO]和phpinfo()函数的使用方法...
  4. 【MySQL】按平均成绩从高到低显示所有学生的所有课程的成绩以及平均成绩
  5. python使用get和post方法_python爬虫中get和post方法介绍以及cookie作用
  6. 使用iText来生成PDF
  7. 读称题写出执行结果html,C++(II)13-14(2)试题B - 往年试卷
  8. [.NET] EF LINQ 按时间对数据分类汇总
  9. 计算机中常用的三种码制,码制
  10. 硬件工程师成长之路(2)——电路设计
  11. 波士顿大学 计算机专业,波士顿大学计算机科学专业波士顿大学计算机科学专业.pdf...
  12. 推荐几个常用的Python扩展工具包
  13. 假AI?如何辨识 AI 界的snake oil
  14. 剑网三客户端修复连接服务器失败,剑网3客户端异常 无法打开处理解决办法
  15. 不要女程序员,公司都爱招男性程序员,这是为什么?
  16. overflow and underflow
  17. ROSIntegration ROSIntegrationVision与虚幻引擎4(Unreal Engine 4)的配置
  18. 与体育行业有关的e–r图_体育产业与相关产业的产业关联度研究
  19. Akka Dispatchers和Routers
  20. 转:中国移动宽带光猫F663路由模式改桥接模式

热门文章

  1. 【vue 项目】表单正则表达式校验1-32位,中文、英文、数字及特殊字符_-,必须以中文或英文字符开头等
  2. Java与模式学习笔记 —— 合成(Composite)模式
  3. 有关软件测试的问答(转)
  4. 广为流传的免费报表软件究竟是什么呢?
  5. 你最大的敌人,是惯性思维
  6. 千万分词词库网盘下载
  7. 车床主传动系统设计、臂架优化设计、组合机床设计、风力发电机传动机构的设计、立式数控雕刻机、上下料机械手设计、抹灰机设计、LS型螺旋输送机设计、X-Y数控工作台设计、磨床液压传动系统设计……
  8. DDoS攻击——漫画版
  9. C++ openssl ECDSA签名
  10. javascript 代码优化