背景
用过很多APP了吧,很多一开始启动的时候总是显示一页广告,停着好几秒@( ̄- ̄)@……然后想关的话,还得手动地去向右上角那小小的、一点点的关闭按钮,只要稍微点错一点点就进入了广告,简直ZZ(╯‵□′)╯︵┻━┻。
这样的情景,真的是烦@( ̄- ̄)@哎……真不知道产品经理是怎么样的,比如像我这样的人,一想到打开一个APP就要看好几秒广告,就不想打开这个APP了@( ̄- ̄)@。所以这样的设计真的是反效果。
做不能一个漂亮的启动界面吗?这样用户看了之后觉得赏心悦目,打开APP的主动性也会高很多吧。
刚好最近在和导师撕逼ᐠ( ᐢ ᵕ ᐢ )ᐟ (用力怼,出奇迹~),闲得无聊地瞎搞APP,便搞出了一个控件,总之先放个GIF图看看效果~
这个效果调了好久,同事看了之后都觉得不错喵的说~
而且可以通过jitpack可以很方便地在Android Studio里添加依赖喵的说~
(迷之音:“不来一发star吗少年”,并且向你扔出了一个地址:https://github.com/dotomato/FringeLaunchView
代码/原理:
本质上是一个完全自定义的View,所有效果在onDraw()里画出来。
首先定义一个Fringe类,用来帮助我们画单个的条纹。
class Fringe {
...
private float randF(){
return (float) Math.random();
}
//初始化的时候要输入这个条纹的开始的横坐标、结束的横坐标,纵坐标,第几个条纹(虽然现在并没什么卵用),第几组条纹
Fringe(int x1, int x2, int y, int fringeIndex, int groupIndex){
this.x1 = x1;
this.x2 = (int) (x2+ randF()*150);
this.y = y;
h = (int) (fringeHeight*(Math.random()*0.5+0.5));
if (groupIndex==1){
color = HSBtoRGB(mainH1+(randF()-0.5f)*0.1f, 0.3f+ randF()*0.2f, 0.8f+ randF()*0.2f);
}
else if (groupIndex==2) {
color = HSBtoRGB(mainH2+(randF()-0.5f)*0.1f, 0.7f + randF() * 0.2f, 0.8f + randF() * 0.2f);
}
t1 = -Math.random()*0.3;
ts = 0.8f+Math.random()*0.2f;
}
由于整个效果是分成上下两层条纹的,所以在初始化的时候需要传递一些信息进去。
处于下层的条纹要暗一些,就比较符合视觉效果。然后每个条纹在需要对自条的高度、进入的延时、速度巴拉巴拉的做一下随机化,每个条纹的个性就出来了~这些参数在之后计算坐标的时候会用到。
然后是比较关键的绘制部分代码:
private void drawFront(Canvas canvas, float t){
double k = t*ts/enterDuration + t1;
k = Math.max(0, k);
k = Math.min(1, k);
double k1 = Math.cos(Math.pow(k,1.3)*3*Math.PI);
double k2 = (Math.cos(Math.pow(k,0.2)*Math.PI)+1)/2;
double k3 = 1-k1*k2;
double m &#