仿写淘宝个人中心上面的波纹效果

简介: 双十一买东西的时候突然发现淘宝的顶部有一个微小的动画效果,感觉很炫。 实现这个效果的方案就是在一个View上面添加两个View 一个是sin函数图,另一个是cos函数图

DoubleWaves

一个正弦&&余弦波纹图

创作来源

双十一买东西的时候突然发现淘宝的顶部有一个微小的动画效果,感觉很炫。 实现这个效果的方案就是在一个View上面添加两个View 一个是sin函数图,另一个是cos函数图

使用方法

DoubleWaves *doubleWaves = [[DoubleWaves alloc]initWithFrame:CGRectMake(0, 0, self.view.bounds.size.width, 26)]; 

[self.view addSubview:doubleWaves];

就是最简单的创建视图的方法就可以了。

参数

CGFloat waveA;//水纹振幅
CGFloat waveW ;//水纹周期
CGFloat offsetX1; //位移
CGFloat currentK; //当前波浪高度Y
CGFloat offsetX2; //位移
CGFloat wavesSpeed;//水纹速度
CGFloat WavesWidth; //水纹宽度

可以根据自己项目的需求,去调整相应的参数,实现相应的效果。

github:https://github.com/cAibDe/DoubleWaves

相关文章
|
3月前
|
定位技术 开发工具 Python
代码让微信开屏地球转起来
这段内容介绍了如何使用Python制作一个动态旋转的地球图像,类似于微信启动画面中的地球。文章详细描述了所需准备的三个素材(地球表面、云图和微信地球的抠图),并解释了通过调整云层和地面的旋转速度来实现自然的相对运动效果的基本原理。文中还提供了一个GIF压缩工具的链接,以及部分代码示例。此外,文章最后提到了一些Python学习资源,包括学习路线、开发工具、视频教程、实战案例、练习题和面试资料。
49 0
|
5月前
|
JavaScript
vue 组件封装 | 图片放大镜(同天猫、淘宝、京东等商品图片放大浏览效果)
vue 组件封装 | 图片放大镜(同天猫、淘宝、京东等商品图片放大浏览效果)
74 6
|
6月前
鬼刀画风扁平化粒子炫动引导页美化源码
鬼刀画风扁平化粒子炫动引导页美化源码
45 5
鬼刀画风扁平化粒子炫动引导页美化源码
|
前端开发
如何用canvas实现刮刮乐自助
如何用canvas实现刮刮乐自助
|
程序员 定位技术 容器
ChatGPT工作提效之使用百度地图在首都为六一儿童节献爱心(多边形覆盖物、文本标注、自动获取经纬度、爱心函数)
ChatGPT工作提效之使用百度地图在首都为六一儿童节献爱心(多边形覆盖物、文本标注、自动获取经纬度、爱心函数)
128 0
|
编解码 前端开发 定位技术
腾讯位置服务:拾取坐标的四种开发方式
腾讯位置服务:拾取坐标的四种开发方式
1362 0
五款炫酷精美动态登录页面,彩虹气泡动态云层深海灯光水母炫酷星空蛛网HTMLCSS源码
五款炫酷精美动态登录页面,彩虹气泡动态云层深海灯光水母炫酷星空蛛网HTMLCSS源码
156 0
|
安全
在淘宝养神兽|这种小鸟比大熊猫还稀少,你竟供养了14只?
在淘宝养神兽|这种小鸟比大熊猫还稀少,你竟供养了14只?
159 0
在淘宝养神兽|这种小鸟比大熊猫还稀少,你竟供养了14只?
|
缓存 小程序 前端开发
【零基础微信小程序】基于百度大脑人像分割的证件照换底色小程序实战开发
通过小程序配合百度的人体分割接口进行简单的照片渲染,本期做一个小工具,对学生党、工作人员、打印店铺以及涉及到求职简历办公等需求的人员都很有用,这个项目由于一些原因不再做维护了,于是打算出个教程将证件照小程序分享给大家,这里采用百度AI接口是因为现在网上开源的py脚本对边缘计算不是很优秀,会有很多模糊点没办法处理,识别人体的轮廓范围,与背景进行分离,适用于拍照背景替换、照片合成、身体特效等场景。输入正常人像图片,返回分割后的二值结果图、灰度图、透明背景的人像图(png格式);并输出画面中的人数、人体坐标信息,
550 0
【零基础微信小程序】基于百度大脑人像分割的证件照换底色小程序实战开发
|
人工智能 算法 数据可视化
淘宝首页那些“辣眼睛”的图去哪了?
小叽导读:在淘宝这个平台上,消费者每天都在浏览着琳琅满目的图片,图片是消费者与商品交互的第一媒介。图片的质量会极大影响消费者的消费体验和转化效果,高质量的图片会让消费者怦然心动,流连忘返,而低质量的“辣眼睛”图片会让消费者望而却步。在淘宝首页猜你喜欢(以下简称首猜)场景下,由于图片数量太多,让人工来审核所有图片是不现实的。作为阿里技术人,我们的使命就是使用技术手段过滤掉低质量的图片,将高质量的图片和素材呈现给消费者。
3066 0
淘宝首页那些“辣眼睛”的图去哪了?