android自定义计步器形状,Android自定义View仿QQ运动步数效果
本文实例为大家分享了Android QQ运动步数的具体代码,供大家参考,具体内容如下
今天我们实现下面这样的效果:
首先自定义属性:
自定义View代码如下:
/**
* Created by Michael on 2019/11/1.
*/
public class MyQQStep extends View {
private int out_color;
private int inner_color;
private float width;
private float textSize;
private int color;
private int width01;
private int height01;
private Paint outPaint;
private Paint innerPaint;
private Paint textPaint;
private float percent;
private int step;
public MyQQStep(Context context) {
this(context,null);
}
public MyQQStep(Context context, @Nullable AttributeSet attrs) {
this(context, attrs,0);
}
public MyQQStep(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
TypedArray array = context.obtainStyledAttributes(attrs,R.styleable.MyQQStep);
out_color = array.getColor(R.styleable.MyQQStep_out_color, Color.BLACK);
inner_color = array.getColor(R.styleable.MyQQStep_inner_color, Color.RED);
width = array.getDimension(R.styleable.MyQQStep_border_width,10);
textSize = array.getDimensionPixelSize(R.styleable.MyQQStep_text_size,20);
color = array.getColor(R.styleable.MyQQStep_text_color, Color.GREEN);
array.recycle();
initPaint();
percent = 0;
step = 5000;
}
private void initPaint() {
outPaint = new Paint();
outPaint.setAntiAlias(true);
outPaint.setStyle(Paint.Style.STROKE);
outPaint.setStrokeWidth(width);
outPaint.setColor(out_color);
outPaint.setStrokeCap(Paint.Cap.ROUND);
innerPaint = new Paint();
innerPaint.setAntiAlias(true);
innerPaint.setStrokeWidth(width);
innerPaint.setStyle(Paint.Style.STROKE);
innerPaint.setColor(inner_color);
innerPaint.setStrokeCap(Paint.Cap.ROUND);
textPaint = new Paint();
textPaint.setAntiAlias(true);
textPaint.setColor(color);
textPaint.setStyle(Paint.Style.STROKE);
textPaint.setTextSize(textSize);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
//super.onMeasure(widthMeasureSpec, heightMeasureSpec);
int widthMode = MeasureSpec.getMode(widthMeasureSpec);
int heightMode = MeasureSpec.getMode(heightMeasureSpec);
if (widthMode == MeasureSpec.AT_MOST){
}else{
width01 = MeasureSpec.getSize(widthMeasureSpec);
}
if (heightMode == MeasureSpec.AT_MOST){
}else{
height01 = MeasureSpec.getSize(heightMeasureSpec);
}
setMeasuredDimension((width01>height01?height01:width01)
,(width01>height01?height01:width01));
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
int realWidth = getWidth()>getHeight()?getHeight():getWidth();
int realHeight = getWidth()>getHeight()?getHeight():getWidth();
RectF r1 = new RectF(width/2,width/2,realWidth-width/2
,realHeight-width/2);
canvas.drawArc(r1,135,270,false,outPaint);
canvas.drawArc(r1,135,270*percent,false,innerPaint);
Rect r = new Rect();
String s = step+"";
textPaint.getTextBounds(s,0,s.length(),r);
int textWidth = r.width();
int textHeight = r.height();
Paint.FontMetricsInt fontMetricsInt = new Paint.FontMetricsInt();
int dy = (fontMetricsInt.bottom-fontMetricsInt.top)/2-fontMetricsInt.bottom;
int baseLine = textHeight/2+dy+realHeight/2-textHeight/2;
int x0 = realWidth/2-textWidth/2;
canvas.drawText(s,x0,baseLine,textPaint);
}
public void setPercent(float percent,float value){
this.percent = percent;
this.step = (int) value;
invalidate();
}
}
最后在布局以及MainActivity中调用:
android:id="@+id/qq_step"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:out_color="@color/colorAccent"
app:border_width="10dp"
app:inner_color="@color/colorPrimary"
app:text_size="20sp"
app:text_color="@color/colorPrimaryDark"
/>
private void initView() {
final MyQQStep qq_view = findViewById(R.id.qq_step);
ValueAnimator animator = ValueAnimator.ofFloat(0,5000);
animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
float p = animation.getAnimatedFraction();
qq_view.setPercent(p,5000*p);
}
});
animator.setDuration(10000);
animator.start();
}
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
android自定义计步器形状,Android自定义View仿QQ运动步数效果相关推荐
- 自定义View - 仿QQ运动步数效果
今天我们实现下面这样的效果: 首先自定义属性: <?xml version="1.0" encoding="utf-8"?> <resourc ...
- 自定义View | 仿QQ运动步数进度效果
项目GitHub地址 思路 固定不动的蓝色大圆弧 动画变动的红色小圆弧 中间的步数文字显示 相关的自定义属性 比如固定不动的大圆弧, 我们不能写死他的蓝色颜色属性, 要提供一个颜色的自定义属性给用户自 ...
- 自定义View 仿QQ运动步数进度效果
1. 概述 我记得QQ之前是有一个,运动步数的进度效果,今天打开QQ一看发现没有了.具体效果我也不清楚了,我就按照自己大概的印象写一下,这一期我们主要是熟悉Paint画笔的使用: 2. 效果 ...
- 自定义View之仿QQ运动步数进度效果
前言 今天接着上一篇来写关于自定义View方面的东西,我是近期在学习整理这方面的知识点,所以把相关的笔记都放到这个Android自定义View的专栏里了,方便自己下次忘记的时候能回来翻翻,今天的内容是 ...
- android 自定义园动画,Android 自定View实现仿QQ运动步数圆弧及动画效果
在之前的Android超精准计步器开发-Dylan计步中的首页用到了一个自定义控件,和QQ运动的界面有点类似,还有动画效果,下面就来讲一下这个View是如何绘制的. 1.先看效果图 2.效果图分析 功 ...
- Android自定义View之仿QQ运动步数进度效果
文章目录 前言 先看效果图 ![在这里插入图片描述](https://img-blog.csdnimg.cn/6e4ddec17933496ea4830fa08d8ffbe5.png?x-oss-pr ...
- android 自定义view实现仿QQ运动步数进度效果
最近公司在策划一个新的项目,原型还没出来,再说这公司人都要走没了,估计又要找工作了,所以必须要学习,争取每个写个关于自定义view方面的,这样几个月积累下来,也能学习到东西,今天就带来简单的效果,就是 ...
- 【Android自定义View实战】之仿QQ运动步数圆弧及动画,Dylan计步中的控件StepArcView
转载请注明出处:http://blog.csdn.net/linglongxin24/article/details/52936609 [DylanAndroid的csdn博客] 在之前的Androi ...
- 自定义View学习之仿QQ运动步数进度效果
自定义View学习的小记录之第一篇 自定义View学习之QQ计步器 如何实现 1.分析想要得到什么效果 2.确定自定义属性,编写attrs.xml 3.在布局中使用 4.在自定义View中获取自定义属 ...
最新文章
- 区块链挖矿的钱从哪来 区块链挖矿怎么挣钱
- 怎么从Android App Bundle (.aab)提取和转换apks文件(从AAB到APKs的转换和提取)
- c语言fgetpos的参数,C语言fgetpos()函数:获得当前文件的读写指针(转)
- requests模拟登陆 验证码
- 4、Java Swing JLable:标签组件
- python连接access 参数太少_带参数的PypyODBC:[ODBC Microsoft Access Driver]参数太少。预期4...
- idea如何反编译字节码指令_美团点评:Java字节码增强技术,线上问题诊断利器...
- LeetCode-----斐波那契数列
- 服务器组件架构,tomcat组件图解 一个web服务器的架构演化史
- 标准化工作导则2020_夯实标准化工作——标准化工作导则GB/T 1.12020培训会在水发兴业能源顺利举办...
- ps制作2寸照片教程蓝底,ps怎么p二寸照片详细步骤
- JsBarcode 安装、使用、生成条形码的容器 及 参数配置options。 还存在的问题:条形码总体的宽度设置问题
- 日常记账后,图表查看账目类别
- 如何下载可爱随意字体KISS ME
- 什么是安全性测试(security testing)?
- 虚拟现实内容开发收费标准
- 获取本周周一和周末日期、上周周一和周末、下周周一和周末
- 无人驾驶汽车横向控制模型
- 取消ctrl+alt+left旋转桌面
- Canny边缘检测原理及C++实现
热门文章
- 转载:分布式Session共享:tomcat+memcached实现session共享
- 实现jQuery下拉选单的选取值
- MFC 108问题
- 5个很少被提到但能提高NLP工作效率的Python库
- 怎样在php中退出登录,php如何实现退出登录功能
- GPT4论文翻译 by GPT4 and Human
- 详解视频中动作识别模型与代码实践
- 东芝发布全系列消费级硬盘
- hist seg, find peaks, tps, pava单调拟合, isotonic-regression,REGULARIZED DISCRETE OPTIMAL TRANSPORT
- 无为电缆工业学校计算机,芜湖电缆工业学校(无为县职教中心)2020年宿舍条件怎么样?...