您的位置:首页 > 移动开发 > IOS开发

iOS为有约束的空间添加动画

2015-12-03 19:16 393 查看
最近公司经营了一个新的项目,项目的宗旨是做一个交友的app,在项目开发过程中本人负责个人主页等相关页面。

因为是一个娱乐性的交友app,免不了界面要鲜艳、有吸引力,尤其是在个人主页这一块,要多一些小动画,可以让个人主页免于显得过于单调。

由于本项目的个人主页设计类似于微博的的个人主页,所以就擅自作主加了类似其的动画。即点击头像可以放大。

刚开始做动画的时候代码的逻辑是这样的,请看一下代码:

- (void)showBigImgAnimation{

/*隐藏子控件*/

[self
animationHideView];

[UIView
animateWithDuration:.25
animations:^{

_userHeadImgVIew.x =
0;

_userHeadImgVIew.y =
0;

_userHeadImgVIew.width =
SCREEN_WIDTH;

_userHeadImgVIew.height =
HeadViewDefaultH +
tabH;
}
completion:^(BOOL finished) {

isHaveScaled = YES;
}];

}
- (void)hideBigImgAnimation{

/*显示子控件*/

[self
animationShowView];

[UIView
animateWithDuration:.25
animations:^{
_userHeadImgVIew.x = initX;
_userHeadImgVIew.y = initY;

_userHeadImgVIew.width =
initImgW;

_userHeadImgVIew.height =
initImgH;
}
completion:^(BOOL finished) {

isHaveScaled = NO;;
}];
}

弄好了之后发现动画不是预料中的样子,各种调试之后还是没有达到理想的效果。最后突然想到我的界面是用xib拖拽的,而且添加了约束,就把相关的约束条件链接到 .m文件里。然后在动画中修改约束。结果真的成功了。成功之后的代码如下所示:

- (void)showBigImgAnimation{

_userHeadImgVIew.layer.cornerRadius =0;

_userHeadImgVIew.layer.borderWidth =
0;

_userHeadImgVIew.layer.borderColor = [[UIColor
clearColor]
CGColor];

_userHeadImgVIew.layer.masksToBounds =
YES;

//隐藏控件

[self
animationHideView];

_imgViewWidth.constant =
SCREEN_WIDTH;

_imgViewHeight.constant =
HeadViewDefaultH + tabH;

_imgViewTopMargin.constant =
0;

[UIView
animateWithDuration:.3
animations:^{

[_userHeadImgVIew.superview
layoutIfNeeded];
}
completion:^(BOOL finished) {

isHaveScaled = YES;

[self
showSaveImgView];
}];

}

- (void)hideBigImgAnimation{

[self
hideSaveImgView];

_imgViewWidth.constant =
initImgW;

_imgViewHeight.constant =
initImgH;

_imgViewTopMargin.constant =
initImgTopMarginValue;

[UIView
animateWithDuration:.3
animations:^{

[_userHeadImgVIew.superview
layoutIfNeeded];
}
completion:^(BOOL finished) {

isHaveScaled = NO;

_userHeadImgVIew.layer.cornerRadius =
_userHeadImgVIew.width/2;

_userHeadImgVIew.layer.borderWidth =
2.5;

_userHeadImgVIew.layer.borderColor
= [[UIColor
colorWithHexString:@"#ffffff"
withAlpha:0.5]
CGColor];

_userHeadImgVIew.layer.masksToBounds =
YES;

[self
animationShowView];

}];
}
至于为什么用[_useHeadImgView.superView layoutIfNeeded];
可以查阅一下layoutIfNeeded的调用机制。有空的话我也会认真学习一下layoutIfNeeded调用机制 并分享给大家
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: