全国优秀共青团员,卡尔达舍夫,dnf土罐的黄金斗篷礼盒
用简书app的时候觉得这个view的弹出效果特别好，而且非常平滑，所以我就尝试写了一个，和简书app上的效果基本一致了:
下面开始讲解:
1.首先我们要知道这个页面有几个view？这个页面其实有四个view，self.view , 图中白色vc的view rootvc.view ,白色vc上的maskview maskview , 以及弹出的popview popview 。我们创建它们：
我要评论
self.view.backgroundcolor = [uicolor blackcolor];
_popview = ({
uiview * popview = [[uiview alloc]initwithframe:cgrectmake(0, [uiscreen mainscreen].bounds.size.height, [uiscreen mainscreen].bounds.size.width, [uiscreen mainscreen].bounds.size.height /2.0)];
popview.backgroundcolor = [uicolor graycolor];
//加个阴影
popview.layer.shadowcolor = [uicolor blackcolor].cgcolor;
popview.layer.shadowoffset = cgsizemake(0.5, 0.5);
popview.layer.shadowopacity = 0.8;
popview.layer.shadowradius = 5;
//关闭btn
uibutton * closebtn = [uibutton buttonwithtype:uibuttontypecustom];
closebtn.frame = cgrectmake(15, 0, 50, 40);
[closebtn settitle:@"关闭" forstate:uicontrolstatenormal];
[closebtn settitlecolor:[uicolor colorwithred:217/255.0 green:110/255.0 blue:90/255.0 alpha:1] forstate:uicontrolstatenormal];
[closebtn addtarget:self action:@selector(close) forcontrolevents:uicontroleventtouchupinside];
[popview addsubview:closebtn];
popview;
});
//添加vc的view的方法
_rootvc.view.frame = self.view.bounds;
_rootvc.view.backgroundcolor = [uicolor whitecolor];
_rootview = _rootvc.view;
[self addchildviewcontroller:_rootvc];
[self.view addsubview:_rootview];
//rootvc上的maskview
_maskview = ({
uiview * maskview = [[uiview alloc]initwithframe:self.view.bounds];
maskview.backgroundcolor = [uicolor colorwithwhite:0 alpha:0.5];
maskview.alpha = 0;
maskview;
});
[_rootview addsubview:_maskview];
2.然后要添加点击事件，这里为了方便我的弹出事件直接用的touchesbegan
- (void)show
{
[[uiapplication sharedapplication].windows[0] addsubview:_popview];
cgrect frame = _popview.frame;
frame.origin.y = self.view.frame.size.height/2.0;
[uiview animatewithduration:0.3 delay:0 options:uiviewanimationoptioncurveeaseinout animations:^{
[_rootview.layer settransform:[self firsttransform]];
} completion:^(bool finished) {
[uiview animatewithduration:0.3 delay:0 options:uiviewanimationoptioncurveeaseinout animations:^{
[_rootview.layer settransform:[self secondtransform]];
//显示maskview
[_maskview setalpha:0.5f];
//popview上升
_popview.frame = frame;
} completion:^(bool finished) {
}];
}];
}
这里要注意一下的就是popview是添加到window上面的:[[uiapplication sharedapplication].windows[0] addsubview:_popview];
然后关键的layer形变方法来了
- (catransform3d)firsttransform{
catransform3d t1 = catransform3didentity;
t1.m34 = 1.0/-900;
//带点缩小的效果
t1 = catransform3dscale(t1, 0.95, 0.95, 1);
//绕x轴旋转
t1 = catransform3drotate(t1, 15.0 * m_pi/180.0, 1, 0, 0);
return t1;
}
- (catransform3d)secondtransform{
catransform3d t2 = catransform3didentity;
t2.m34 = [self firsttransform].m34;
//向上移
t2 = catransform3dtranslate(t2, 0, self.view.frame.size.height * (-0.08), 0);
//第二次缩小
t2 = catransform3dscale(t2, 0.8, 0.8, 1);
return t2;
}
大家可以看到这，应该可以发现这里其实有两次形变
3.隐藏动画
- (void)close
{
_isshow = no;
cgrect frame = _popview.frame;
frame.origin.y += self.view.frame.size.height/2.0;
[uiview animatewithduration:0.3 delay:0 options:uiviewanimationoptioncurveeaseinout animations:^{
//maskview隐藏
[_maskview setalpha:0.f];
//popview下降
_popview.frame = frame;
//同时进行 感觉更丝滑
[_rootview.layer settransform:[self firsttransform]];
} completion:^(bool finished) {
[uiview animatewithduration:0.3 delay:0 options:uiviewanimationoptioncurveeaseinout animations:^{
//变为初始值
[_rootview.layer settransform:catransform3didentity];
} completion:^(bool finished) {
//移除
[_popview removefromsuperview];
}];
}];
}
最后，完整代码，已经封装好了，继承之后使用创建方法就行了
github:wzxhaha
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持移动技术网。
如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复
iOS 使用UITextField自定义搜索框 实现用户输入完之后“实时搜索”功能
网友评论