首页
学习
活动
专区
工具
TVP
发布
您找到你想要的搜索结果了吗?
是的
没有找到

Android自定义view实现水波进度条控件

通过自定义view实现了一个水滴滴落到水波面,溅起水花并且水波流动上涨的进度条控件。...之前看到过好多水波流动的进度条,感觉欠缺些东西,就想到了水滴到水平面,溅起水花然后水流动上涨的进度条效果,于是自己动手写了出来。效果如下,视频录制有些卡顿,实际会流畅很多。 ?...一.用法 1.布局文件中添加WaveProgressView,circleColor属性为圆环颜色,waterColor属性为水波水滴的颜色,progress属性为初始的进度 <com.yhongm.wave_progress_view.WaveProgressView...二.本文实现的逻辑 1,画水波流动,通过三阶贝塞尔曲线画波形,通过不断的改变waveOffsetX和waveOffsetY的值实现流动的效果 /** * 生成水波流动 * * @param...begin 水波形开始的位置 * @param waveLength 水波的长度 * @param waveOffsetX 水波水平的偏移 * @param waveOffsetY

72520

自定义View实现横向的双水波进度

[HorizontalWaveProgressView.GIF] 网上垂直的水波进度条很多,但横向的很少,将垂直的水波纹改为水平的还遇到了些麻烦,现在完善后发布出来,希望遇到的人少躺点坑。...思路分析 整体效果可分为三个,绘制圆角背景和圆角矩形,绘制第一条和第二条水波浪,根据自定义进度变化效果。...\ path的起始点为(0,0)可根据进度动态改变,然后循环画曲线,长度是有几个波浪就是多长,然后连接到view高度的位置,最后到(0,0),形成一个封闭的区域,这样就实现了一个填充的水波效果。...secondWavePath.lineTo(0, waveActualSizeHeight); secondWavePath.close(); return secondWavePath; } 3.设置动画使进度水波纹变化.../** * 设置进度 * * @param currentProgress 进度 * @param duration 达到进度需要的时间 */ public void setProgress

67720

Android 自定义球型水波纹带圆弧进度效果(实例代码)

需求 如下,实现一个圆形水波纹,带进度,两层水波纹需要渐变显示,且外围有一个圆弧进度。 ? 思路 外围圆弧进度:可以通过canvas.drawArc()实现。...水波纹的实现:直接使用贝塞尔曲线Path.quadTo()实现,通过拉伸水平直线绘制波浪效果。可以通过控制拉伸点(waveAmplitude)距离水平线的高度,达到波浪高度的控制。...园形的实现:绘制一个完整的圆形,然后通过Path.op()合并裁剪水波纹path。注意点就是Android6有个坑,使用该方法会有明显的抖动,为了解决该问题,我的做法是多画一层圆弧以掩盖此抖动。...percent = 0 set(value) { field = value waveWaterLevelRatio = value / 100f //y = -4 * x2 + 4x抛物线计算振幅,水波纹振幅规律更加真实...centerX.toFloat(), centerY.toFloat(), innerRadius, bgCirclePaint ) } } 总结 以上所述是小编给大家介绍的Android 自定义球型水波纹带圆弧进度效果

1.1K20

自定义View实现横向的双水波进度

HorizontalWaveProgressView.GIF 网上垂直的水波进度条很多,但横向的很少,将垂直的水波纹改为水平的还遇到了些麻烦,现在完善后发布出来,希望遇到的人少躺点坑。...思路分析 整体效果可分为三个,绘制圆角背景和圆角矩形,绘制第一条和第二条水波浪,根据自定义进度变化效果。...path的起始点为(0,0)可根据进度动态改变,然后循环画曲线,长度是有几个波浪就是多长,然后连接到view高度的位置,最后到(0,0),形成一个封闭的区域,这样就实现了一个填充的水波效果。...secondWavePath.lineTo(0, waveActualSizeHeight); secondWavePath.close(); return secondWavePath; } 3.设置动画使进度水波纹变化.../** * 设置进度 * * @param currentProgress 进度 * @param duration 达到进度需要的时间 */ public void setProgress

63920

水波模拟算法

一、理论依据 水波的物理学模型便是理论依据。水波有如下特性: 扩散:水波总是从被扰动的中心向外扩散。在水波扩散过程中每个点都在得到能量后以自己为中心震动,并向四周传播能量。...衰减:水波在传播过程中能量会逐渐的衰减,因为水的震荡是有阻尼的。 折射:由于水波表面各处有不同程度的倾斜,由于折射,将会看到水底景物的不同程度的偏移,看起来是变形的。...反射:由于水波表面的凹凸不平,比起平静时期的水面,水面上各点反光程度将会不同程度的受到影响,从而改变了自己的亮度,颜色。 水波还有衍射等特性。但是考虑问题的核心在于能量传递或者能量扩散。...因为背景图像按照波能偏移显示,得到水波效果。 在考虑了反射的情况下(无论是否考虑了折射),不论是否使用了背景图像,都会有水波效果,因为水面各点的亮度按照波能进行加强和减弱。...当然,两者考虑的情况下水波最为逼真。 这就相当于对一池清水,没有反射光的时候就算有扰动,也看不到波形;而如果有水底背景,只要有折射存在,也能感到有水波存在。形成水波最主要的还是反射因素。

1.2K90

图像水波特效

:/Users/xpp/Desktop/Lena.png') rows,cols=img.shape[:2] dst=np.zeros((rows,cols,3),dtype="uint8") #定义水波特效参数...wavelength=20 amplitude=30 phase=math.pi/4 #获取中心点 centreX=0.5 centreY=0.5 radius=min(rows,cols)/2 #设置水波覆盖面积...icentreX=cols*centreX icentreY=rows*centreY #图像水波特效 for i in range(rows): for j in range(cols):...cv2.imshow('original',img) cv2.imshow('result',dst) cv2.waitKey() cv2.destroyAllWindows() 算法:图像水波特效是围绕水波中心点进行波纹涟漪传递...如图,红轴表示水面,蓝色椭圆表示水波。 对于某个点x,其运动轨迹上的每个点都可以分解为与视线平行和垂直的2个方向上的位移,计算出垂直视线的位移y,即计算出水波导致像素点偏移位移。

37730

水波扩散效果(shader)

水波扩散是一个比较好看的交互效果,特别是在某些以水为故事发生场景的游戏中,扩散的水波会让场景更加栩栩如生 ?...demo 实现思路 如果水波静止,我们看到的其实是像素点围绕着某个中心点的拉伸效果,我们只需让每个像素点叠加上它和中心点的向量差,就能够呈现出画面上的所有像素围绕中心点的拉伸感。...周期性往外涌 这种呼吸灯式的涌动其实和我们的最终效果有很大区别,因为它永远在循环涌动,但是我们的水波是从中心扩散出去之后,中间部分就不再动了的,怎么让中间的像素不再多次涌动呢?...如果把一圈水波比作圆,那水波的扩散行为其实就是这个圆的半径在不断的增大,圆外面的波纹有效,圆里面的波纹静止。...未调优效果 接下来的就是参数的调试,主要是三角函数的采样那里,我们希望水波能够产生多个波动,所以我们需要乘上一定的倍数,让函数的作用范围足够大,才能有足够多的波峰谷底。

2.1K20

Android开发笔记(一百三十一)水波图形与水波动画

水波图形RippleDrawable RippleDrawable是Android在5.0之后新增的图形类,它的作用是在点击时展示水波动画,从而提示用户在这里按压了屏幕。...具体的水波样式主要有三种,说明如下: 1、没有边界限制的水波,这意味着允许水波动画充满整个视图,xml定义如下: <ripple xmlns:android="http://schemas.android.com...<em>水波</em>动画RippleView RippleDrawable只支持Android5.0以后的系统,如果想在4.*系统上也能展示<em>水波</em>动画效果,就得自己编写<em>水波</em>动画的控件了。...<em>水波</em>动画的实现思路不难,主要是以触摸点为圆心,间隔很短时间不停地向外画圆圈,从而产生<em>水波</em>荡漾的动画效果。...; 4、随着<em>水波</em>扩散与消失,<em>水波</em>图案的颜色应当逐渐变淡,这样才符合现实生活中的情况; 5、对于按钮等控件,点击操作应延迟若干时长(如0.5秒)再处理具体事务,以便留出充裕时间播放<em>水波</em>动画; 下面是自定义<em>水波</em>动画的截图

96240

【Flutter 专题】133 图解自定义 ACEWaterButton 水波纹按钮

和尚想自定义一个水波纹按钮,即默认向外扩散的水波样式;实现方式有很多种,和尚尝试最基本的 AnimationController 逐层绘制来处理,和尚简单记录一下尝试过程; ACEWaterButton...; 和尚预期水波纹不仅范围逐渐变大,并且在扩散过程中透明度逐渐降低,至外围最大范围为止消失;和尚采用最基本的 CustomPainter 自定义 Canvas.drawCircle,根据时间进度来逐层绘制水波纹...; 2.1 透明度 和尚使用 Paint 绘制时根据 AnimationController.value 进度逐步设置 color.withOpacity 透明度逐渐变低; Paint _paint..._paint..color = color.withOpacity(1.0 - progress); 2.2 外围圆 外围圆主要是根据 AnimationController.value 进度逐步进行半径的更新...AnimationController.value 进度范围; // 中心点扩展 double _radius = innerSize * 0.5 * progress; // 增大扩展范围 double

72630

Android 5.0 实现水波扩散效果

本文实例为大家分享了Android 5.0 实现水波扩散效果的具体代码,供大家参考,具体内容如下 该效果是通过自定义界面来实现的 1、首先自定义属性,attrs.xml代码如下: <?...2、自定义RippleView类继承RelativeLayout布局,也可以由需求所定继承于其它类,实现水波扩散效果主要的有两点:水波扩散的绘制和动画 1)水波的绘制其实就是绘制一个圆形 canvas.drawCircle...private float mMaskAlpha;// 遮掩透明度 private float mRippleAlpha;// 水波透明度 private int mRippleTime;// 水波动画时间...private ObjectAnimator mRippleAnim;// 显示水波动画 private float mRadius;// 当前的半径 private float mMaxRadius...;// 水波最大半径 private float mDownX; // 记录手指按下的位置 private float mDownY; private boolean mIsMask; private

66820
领券