android多个水波球,android球形水波百分比控件代码

本文主要介绍的是一个球形水波的百分比控件,市面上有各种形形色色的百分比控件,我一直觉得水波是最炫的,UI给了我这个机会,然而网上搜了一大堆,不是太复杂,代码太多(反正我是调不出效果来),就是有瑕疵的,所以只好自己写了,这里开源出来,方便大家。有什么问题或者建议大家留言指出。

先看效果,这里动态图不好截取,就贴张静态的

07cde25e6986f6eb77599bfe53f82a5b.png

对于水波百分比控件实现方法有如下几种

- 画好水波形状的bitmap,利用属性动画进行平移

- 利用曲线精确绘制目标水波

- 利用大范围曲线与容器做交集

第一种比较烦,网上有这种思路实现的,代码量比较庞大。bitmap移动时要注意的问题很多,一不小心就bug一堆了。第二种代码量小,但需要几何功底。很丢脸的说我算了好久。才算出公式(年代久远,都忘了),不过这种方法计算量大,绘制时遍历的点少。第三种方法,代码量极少,计算量几乎没有,遍历的点是第二种方法的两倍以上。考虑到遍历的消耗和计算的复杂度,选择第三种。

这里我们选择正弦曲线和圆做交集。

for (int i = left; i < length; i++) {

int x = i;

int y = (int) (Math.sin(Math.toRadians(x + mTranX) / 2) * mRadius / 4);

path2.lineTo(x, mH + y);

}

sin函数,x横坐标,y纵坐标,mTranX每次偏移量, 波形起伏mRadius / 4,

核心代码

利用圆的path与我们之前绘制的曲线做交集

Path pc = new Path();

pc.addCircle(mCentrePoint.x, mCentrePoint.y, mRadius, Path.Direction.CCW);

canvas.clipPath(pc, Region.Op.INTERSECT);

canvas.drawPath(path2, mWavePaint);

canvas.restore();

水位上升和水波起伏

while (isDraw) {

if (mWaterLevel > mNowHeight) {

mNowHeight = mNowHeight + mUpSpeed;

}

if (mStart) {

if (mTranX > mRadius) {

mTranX = 0;

}

mTranX = mTranX - mWaveSpeed;

}

drawUI();

}

这里由于动画效果比较细腻,更新UI界面比较平凡,所以我们采用surfaceView来实现(用view实现发现有卡顿,影响体验)

完整代码

就一个waveview类直接布局中引用

注释写的应该算比较清楚了。有什么疑问的可以留言

package com.aibaide.test;

import android.content.Context;

import android.graphics.Canvas;

import android.graphics.Color;

import android.graphics.Paint;

import android.graphics.Path;

import android.graphics.PixelFormat;

import android.graphics.Point;

import android.graphics.Region;

import android.util.AttributeSet;

import android.view.SurfaceHolder;

import android.view.SurfaceView;

/**

* gengqiquan

* 2016年6月2日16:16:48

* 水波显示百分比控件

*/

public class WaveView extends SurfaceView implements SurfaceHolder.Callback {

Point mCentrePoint;

int mNowHeight = 0;//当前水位

int mRadius = 0;

boolean mStart = false;//是否开始

float mTextSise = 60;//文字大小

Context mContext;

int mTranX = 0;//水波平移量

private Paint mCirclePaint;

private Paint mOutCirclePaint;

private Paint mWavePaint;

private Paint mTextPaint;

private SurfaceHolder holder;

private RenderThread renderThread;

private boolean isDraw = false;// 控制绘制的开关

private int mCircleColor = Color.parseColor("#ff6600");//背景内圆颜色

private int mOutCircleColor = Color.parseColor("#f5e6dc");//背景外圆颜色

private int mWaveColor = Color.parseColor("#ff944d");//水波颜色

private int mWaterLevel;// 水目标高度

private int flowNum = 60;//水目标占百分比这里是整数。

private int mWaveSpeed = 5;//水波起伏速度

private int mUpSpeed = 2;//水面上升速度

/**

* @param context

*/

public WaveView(Context context) {

super(context);

// TODO Auto-generated constructor stub

mContext = context;

init(mContext);

}

/**

* @param context

* @param attrs

*/

public WaveView(Context context, AttributeSet attrs) {

super(context, attrs);

// TODO Auto-generated constructor stub

mContext = context;

init(mContext);

}

/**

* @param context

* @param attrs

* @param defStyleAttr

*/

public WaveView(Context context, AttributeSet attrs, int defStyleAttr) {

super(context, attrs, defStyleAttr);

// TODO Auto-generated constructor stub

mContext = context;

init(mContext);

}

private void init(Context context) {

mContext = context;

setZOrderOnTop(true);

holder = this.getHolder();

holder.addCallback(this);

holder.setFormat(PixelFormat.TRANSLUCENT);

renderThread = new RenderThread();

mCirclePaint = new Paint();

mCirclePaint.setColor(mCircleColor);

mCirclePaint.setStyle(Paint.Style.FILL);

mCirclePaint.setAntiAlias(true);

mOutCirclePaint = new Paint();

mOutCirclePaint.setColor(mOutCircleColor);

mOutCirclePaint.setStyle(Paint.Style.FILL);

mOutCirclePaint.setAntiAlias(true);

mWavePaint = new Paint();

mWavePaint.setStrokeWidth(1.0F);

mWavePaint.setColor(mWaveColor);

mWavePaint.setStyle(Paint.Style.FILL);

mWavePaint.setAntiAlias(true);

mTextPaint = new Paint();

mTextPaint.setStrokeWidth(1.0F);

mTextPaint.setColor(Color.WHITE);

mTextPaint.setTextSize(mTextSise);

mTextPaint.setTextAlign(Paint.Align.CENTER);

mTextPaint.setStyle(Paint.Style.FILL);

mTextPaint.setAntiAlias(true);

}

@Override

public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) {

mRadius = (int) (0.5 * width * 0.92);

mCentrePoint = new Point(width / 2, height / 2);

mWaterLevel = (int) (2 * mRadius * flowNum / 100f);//算出目标水位高度

}

@Override

public void surfaceCreated(SurfaceHolder holder) {

isDraw = true;

if (renderThread != null && !renderThread.isAlive())

renderThread.start();

}

@Override

public void surfaceDestroyed(SurfaceHolder holder) {

isDraw = false;

}

/**

* 绘制界面的线程

*

* @author Administrator

*/

private class RenderThread extends Thread {

@Override

public void run() {

// 不停绘制界面,这里是异步绘制,不采用外部通知开启绘制的方式,水波根据数据更新才会开始增长

while (isDraw) {

if (mWaterLevel > mNowHeight) {

mNowHeight = mNowHeight + mUpSpeed;

}

if (mStart) {

if (mTranX > mRadius) {

mTranX = 0;

}

mTranX = mTranX - mWaveSpeed;

}

drawUI();

}

super.run();

}

}

/**

* 界面绘制

*/

public void drawUI() {

Canvas canvas = holder.lockCanvas();

try {

drawCanvas(canvas);

} catch (Exception e) {

e.printStackTrace();

} finally {

if (canvas != null)

holder.unlockCanvasAndPost(canvas);

}

}

private void drawCanvas(Canvas canvas) {

//画背景圆圈

canvas.drawCircle(mCentrePoint.x, mCentrePoint.y, mRadius / 0.92f, mOutCirclePaint);

canvas.drawCircle(mCentrePoint.x, mCentrePoint.y, mRadius, mCirclePaint);

if (mStart) {

//计算正弦曲线的路径

int mH = mCentrePoint.y + mRadius - mNowHeight;

int left = - mRadius / 2;

int length = 4 * mRadius;

Path path2 = new Path();

path2.moveTo(left, mH);

for (int i = left; i < length; i++) {

int x = i;

int y = (int) (Math.sin(Math.toRadians(x + mTranX) / 2) * mRadius / 4);

path2.lineTo(x, mH + y);

}

path2.lineTo(length, mH);

path2.lineTo(length, mCentrePoint.y + mRadius);

path2.lineTo(0, mCentrePoint.y + mRadius);

path2.lineTo(0, mH);

canvas.save();

//这里与圆形取交集,除去正弦曲线多画的部分

Path pc = new Path();

pc.addCircle(mCentrePoint.x, mCentrePoint.y, mRadius, Path.Direction.CCW);

canvas.clipPath(pc, Region.Op.INTERSECT);

canvas.drawPath(path2, mWavePaint);

canvas.restore();

//绘制文字

canvas.drawText(flowNum + "%", mCentrePoint.x, mCentrePoint.y, mTextPaint);

}

}

public void setFlowNum(int num) {

flowNum = num;

mStart = true;

}

public void setTextSise(float s) {

mTextSise = s;

mTextPaint.setTextSize(s);

}

//设置水波起伏速度

public void setWaveSpeed(int speed) {

mWaveSpeed = speed;

}

//设置水面上升速度

public void setUpSpeed(int speed) {

mUpSpeed = speed;

}

public void setColor(int waveColor, int circleColor, int outcircleColor) {

mWaveColor = waveColor;

mCircleColor = circleColor;

mOutCircleColor = outcircleColor;

mWavePaint.setColor(mWaveColor);

mCirclePaint.setColor(mCircleColor);

mOutCirclePaint.setColor(mOutCircleColor);

}

//精确算法,每次正弦曲线从曲线与圆的交集处开始

// private int getX(double h) {

// int x = 0;

// int R = mRadius;

// if (h < R) {

// double t = 2 * R * h - h * h;

// x = (int) (R - Math.abs(Math.sqrt(t)));

// } else {

// double t = -2 * R * h + h * h;

// x = (int) (R - Math.abs(Math.sqrt(t)));

// }

// return x;

// }

}

最后奉上本文的源码:源码下载

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/502736.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

python数据去重的函数_python pandas dataframe 去重函数的具体使用

今天笔者想对pandas中的行进行去重操作&#xff0c;找了好久&#xff0c;才找到相关的函数 先看一个小例子 from pandas import Series, DataFrame data DataFrame({k: [1, 1, 2, 2]}) print data IsDuplicated data.duplicated() print IsDuplicated print type(IsDuplicate…

合信达 机器人_【中信建投 通信】拓邦股份:中报电话会议干货纪要

原标题&#xff1a;【中信建投 通信】拓邦股份&#xff1a;中报电话会议干货纪要一中信建投通信行业分析师 闫慧辰首先非常感谢大家参加我们举办的拓邦股份2017年中报解读电话会议。拓邦股份是我们5月份开始重点推荐的标的之一。我们观察到了公司业绩的爆发增长&#xff0c;同时…

android 3.0单元测试,Android Studio 3.0 gradle 3.0.0-beta2打破了Kotlin单元测试覆盖率?

我有一个简单的Kotlin课程,如下所示class MyClass {fun justSayHello(yes: Boolean): String {if (yes) {return "Hello"} else {return "Sorry"}}}我有我的测试(这里用Java编写,也可以在Kotlin中)public class MyClassTest {private MyClass myClass new…

c++ 二维数组_【技术篇】C指针与二维数组深度辨析

一、源代码/*第01行*/ CLion 2019.3.4 x64中编写的源代码截图二、深度辨析CLion 2019.3.4 x64中编译的结果截图zippo[4][2]是一个四行二列的int型二维数组①不论一维数组还是二维数组&#xff0c;数组名就是指向数组首个元素的指针&#xff0c;也即数组名就是数组首个元素的…

numberformate php_php number_format函数怎么用?

number_format函数是PHP中的一个内置函数&#xff0c;用于格式化一个包含数千个分组的数字&#xff0c;其语法是“string number_format ( $number, $decimals, $decimalpoint, $sep )”。本篇文章主要给大家介绍php number_format用法&#xff0c;希望对需要的朋友有所帮助&am…

android 脚本模拟点击屏幕,android 脚本模拟点击屏幕,android模拟

android 脚本模拟点击屏幕&#xff0c;android模拟对低概率问题&#xff0c;需要多次测试以复现问题&#xff0c;使用脚本更容易实现&#xff0c;避免频繁人工操作首先要了解手机的众多输入设备&#xff1a;命令&#xff1a;adb shell cat /proc/bus/input/devices/I: Bus0000 …

shiro启动之后页面访问不了_java:shiro入门——4

【7】测试【7.1】启动点击apply然后点击OK【7.2】登录过滤访问http://localhost:8080/platform/home的时候&#xff0c;会被【7.3】角色过滤使用“admin”用户登录&#xff0c;密码&#xff1a;123根据SecurityServiceImpl我们可以知道使用admin账号登录成功之后&#xff1a;此…

Android如何分析native代码,使用android-ndk-profiler对native代码进行性能分析

android-ndk-profiler需要使用gcc进行编译&#xff0c;从NDK r13b 起NDK使用的默认编译器从gcc换成了clang&#xff0c;官方提供了Simpleperf工具进行性能分析&#xff0c;具体情况可以参考https://developer.android.google.cn/ndk/guides/simpleperf 。下载使用编译方面的改动…

python模板语言_django的模板语言

Django模板语言1.基础语法:return render(request,qwe.html,{obj:obj}),render的最后的字典可以以键值对的形式传入多个值,在django模板中只用到两种符号变量相关:{{变量名}} 逻辑相关:{% %}1)变量相关:a: 变量名有字母数字和下划线组成,(.)用来获取对象的属性值,ls.0 --> …

oreo另一个意思_记一次有意思的统计(部分大宗商品价格指数相关性统计)

最近闲来无事&#xff0c;对部分大宗商品近十年的价格涨幅做了个统计&#xff0c;发现有些有意思的现象&#xff1a;大多资产价格走势如果放到一个足够长得时间维度里&#xff0c;那其实整体走势是比较一致的&#xff1b;有些资产价格走势高度相关&#xff0c;但是在某个时间段…

android左右耳机声音大小不一样,AirPods左右两边声音大小不同怎么办 单侧无声和两侧音量不同解决方法...

AirPods连接 iPhone 后如果出现了左右两边声音大小不一样&#xff0c;或者单侧无声的问题&#xff0c;可能是软件导致的暂时性故障&#xff0c;也有可能是硬件问题。当耳机音量出现异常时&#xff0c;可以通过以下几种方式尝试恢复。单侧无声和两侧音量不同解决方法&#xff1a…

laravel 任务队列_Laravel5.5之事件监听、任务调度、队列

流程&#xff1a;1.1 创建eventphp artisan make:event UserLoginLoginController.php/*** The user has been authenticated.** param IlluminateHttpRequest $request* param mixed $user* return mixed*/protected function authenticated(Request $request, $user){eve…

pytorch微调bert_小版BERT也能出奇迹:最火的预训练语言库探索小巧之路

选自Medium作者&#xff1a;Victor Sanh机器之心编译参与&#xff1a;魔王过去一段时间&#xff0c;大模型层出不穷。在大家纷纷感叹「大力出奇迹」的时候&#xff0c;作为调用预训练语言模型最流行的库&#xff0c;HuggingFace 尝试用更少的参数量、更少的训练资源实现同等的性…

android 应用无法安装程序,朋友android设备无法安装我的Android应用程序,我甚至不能为我自己做...

我最近上传了我的android应用程序到市场https://market.android.com/details?idcom.DGNT&#xff0c;但我的朋友们不能将它安装在他们的设备上(说他们的手机不兼容)。该网站甚至说我自己的手机与我的应用程序不兼容&#xff0c;即使我已经通过eclipse编译了它&#xff0c;并成…

qsub 指定节点_PBS,QSUB常用命令

1、后台提交作业qsub语法: qsub [-a date_time] [-A account_string] [-e path] [-h] [-I] [-jjoin] [-k keep] [-l resource_list] [-m mail_options] [-nNode_allocation_Method [-L v1,[v2,[v3,[v4]]]]] [-M user_list] [-Nname] [-o path] [-p priority] [-q pool] [-r y|n…

if test 多条件_秒懂Python编程中的if __name__ == #39;main#39; 作用和原理

在大多数编排得好一点的脚本或者程序里面都有这段if __name__ main:1 这段代码的功能一个python的文件有两种使用的方法&#xff1a;第一是直接作为脚本执行&#xff0c;第二是import到其他的python脚本中被调用(模块重用)执行。因此if __name__ main: 的作用就是控制这两种情…

android复杂列表滑动卡顿,Android 列表滑动性能优化总结

列表滑动性能优化是一个老生常谈的问题&#xff0c;最近在做项目的时候又遇到了列表滑动卡顿的问题&#xff0c;我在经过多次思考和尝试后&#xff0c;终于找到了滑动卡顿的元凶&#xff0c;于是将经验总结下来。ViewHolder先说说最常规的ViewHolder。ViewHolder的出现是为了解…

php淘客发单_如何使用PHP的curl函数调用维易淘客接口

《如何使用PHP的curl函数调用维易淘客接口》要点&#xff1a;使用curl调用维易淘客接口高佣转链维易淘客接口是用GET方式调用的&#xff0c;直接用GET调用即可&#xff0c;以下用PHP为例&#xff1a;使用curl调用维易淘客接口高佣转链&#xff1a;$apihttp://api.vephp.com/hca…

python背景颜色怎么随机_Python中的随机颜色

我同意TigerhawkT3&#xff08;1&#xff09;你教授对pick_color()的实现是垃圾。但我不认为random.choice()&#xff0c;或者你教授滥用random.shuffle()的方式是最好的选择。两者的问题是&#xff0c;在连续调用时可以获得相同的颜色&#xff0c;这是在正方形内绘制正方形时不…

python 解决手机拍的书籍图片发灰的问题

老师给发的作业经常是手机拍的&#xff0c;而不是扫描&#xff0c;背景发灰&#xff0c;如果二次打印就没有看了&#xff0c;象这样&#xff1a; 如果使用photoshop 处理&#xff0c;有些地方还是扣不干净&#xff0c;不如python 做的好&#xff0c;处理后如下&#xff1a; 具体…