本文实例为大家分享了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运动步数效果相关推荐

  1. 自定义View - 仿QQ运动步数效果

    今天我们实现下面这样的效果: 首先自定义属性: <?xml version="1.0" encoding="utf-8"?> <resourc ...

  2. 自定义View | 仿QQ运动步数进度效果

    项目GitHub地址 思路 固定不动的蓝色大圆弧 动画变动的红色小圆弧 中间的步数文字显示 相关的自定义属性 比如固定不动的大圆弧, 我们不能写死他的蓝色颜色属性, 要提供一个颜色的自定义属性给用户自 ...

  3. 自定义View 仿QQ运动步数进度效果

    1. 概述   我记得QQ之前是有一个,运动步数的进度效果,今天打开QQ一看发现没有了.具体效果我也不清楚了,我就按照自己大概的印象写一下,这一期我们主要是熟悉Paint画笔的使用:    2. 效果 ...

  4. 自定义View之仿QQ运动步数进度效果

    前言 今天接着上一篇来写关于自定义View方面的东西,我是近期在学习整理这方面的知识点,所以把相关的笔记都放到这个Android自定义View的专栏里了,方便自己下次忘记的时候能回来翻翻,今天的内容是 ...

  5. android 自定义园动画,Android 自定View实现仿QQ运动步数圆弧及动画效果

    在之前的Android超精准计步器开发-Dylan计步中的首页用到了一个自定义控件,和QQ运动的界面有点类似,还有动画效果,下面就来讲一下这个View是如何绘制的. 1.先看效果图 2.效果图分析 功 ...

  6. Android自定义View之仿QQ运动步数进度效果

    文章目录 前言 先看效果图 ![在这里插入图片描述](https://img-blog.csdnimg.cn/6e4ddec17933496ea4830fa08d8ffbe5.png?x-oss-pr ...

  7. android 自定义view实现仿QQ运动步数进度效果

    最近公司在策划一个新的项目,原型还没出来,再说这公司人都要走没了,估计又要找工作了,所以必须要学习,争取每个写个关于自定义view方面的,这样几个月积累下来,也能学习到东西,今天就带来简单的效果,就是 ...

  8. 【Android自定义View实战】之仿QQ运动步数圆弧及动画,Dylan计步中的控件StepArcView

    转载请注明出处:http://blog.csdn.net/linglongxin24/article/details/52936609 [DylanAndroid的csdn博客] 在之前的Androi ...

  9. 自定义View学习之仿QQ运动步数进度效果

    自定义View学习的小记录之第一篇 自定义View学习之QQ计步器 如何实现 1.分析想要得到什么效果 2.确定自定义属性,编写attrs.xml 3.在布局中使用 4.在自定义View中获取自定义属 ...

最新文章

  1. 区块链挖矿的钱从哪来 区块链挖矿怎么挣钱
  2. 怎么从Android App Bundle (.aab)提取和转换apks文件(从AAB到APKs的转换和提取)
  3. c语言fgetpos的参数,C语言fgetpos()函数:获得当前文件的读写指针(转)
  4. requests模拟登陆 验证码
  5. 4、Java Swing JLable:标签组件
  6. python连接access 参数太少_带参数的PypyODBC:[ODBC Microsoft Access Driver]参数太少。预期4...
  7. idea如何反编译字节码指令_美团点评:Java字节码增强技术,线上问题诊断利器...
  8. LeetCode-----斐波那契数列
  9. 服务器组件架构,tomcat组件图解 一个web服务器的架构演化史
  10. 标准化工作导则2020_夯实标准化工作——标准化工作导则GB/T 1.12020培训会在水发兴业能源顺利举办...
  11. ps制作2寸照片教程蓝底,ps怎么p二寸照片详细步骤
  12. JsBarcode 安装、使用、生成条形码的容器 及 参数配置options。 还存在的问题:条形码总体的宽度设置问题
  13. 日常记账后,图表查看账目类别
  14. 如何下载可爱随意字体KISS ME
  15. 什么是安全性测试(security testing)?
  16. 虚拟现实内容开发收费标准
  17. 获取本周周一和周末日期、上周周一和周末、下周周一和周末
  18. 无人驾驶汽车横向控制模型
  19. 取消ctrl+alt+left旋转桌面
  20. Canny边缘检测原理及C++实现

热门文章

  1. 转载:分布式Session共享:tomcat+memcached实现session共享
  2. 实现jQuery下拉选单的选取值
  3. MFC 108问题
  4. 5个很少被提到但能提高NLP工作效率的Python库
  5. 怎样在php中退出登录,php如何实现退出登录功能
  6. GPT4论文翻译 by GPT4 and Human
  7. 详解视频中动作识别模型与代码实践
  8. 东芝发布全系列消费级硬盘
  9. hist seg, find peaks, tps, pava单调拟合, isotonic-regression,REGULARIZED DISCRETE OPTIMAL TRANSPORT
  10. 无为电缆工业学校计算机,芜湖电缆工业学校(无为县职教中心)2020年宿舍条件怎么样?...