外星人源码论坛 首页 编程经验 仿写淘宝个人中心上面的波纹效果

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

2018-3-6 11:32
原作者: 外星人源码网 来自: 外星人源码网 收藏 分享 邀请

DoubleWaves 一个正弦&&余弦波纹图 创作来源 双十一买东西的时候突然发现淘宝的顶部有一个微小的动画效果,感觉很炫。 实现这个效果的方案就是在一个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

1

鲜花

握手

雷人

路过

鸡蛋

刚表态过的朋友 (1 人)

该文章已有0人参与评论

请发表评论

全部评论

粉丝 阅读2078 回复0
上一篇:
前端面试回顾(2)---类型检测发布时间:2018-03-06
下一篇:
深入浅出基于“依赖收集”的响应式原理发布时间:2018-03-06
推荐资讯
阅读排行
国内最专业的源码技术交流社区
全国免费热线电话

0373-5171417

周一至周日9:00-23:00

反馈建议

admin@eenot.com 在线QQ咨询

扫描二维码关注我们