翻转受自动布局约束的圆形 UIView答案

【问题标题】：Flip circular UIView that is constrained with Auto Layout翻转受自动布局约束的圆形 UIView
【发布时间】：2015-07-05 11:58:53
【问题描述】：

我有一个 UIView，我按以下方式制作了圆形。

view.layer.cornerRadius = view.frame.size.width / 2;
view.clipsToBounds = YES;

我在视图中有一个 UIImageView 填充视图。

UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, view.frame.size.width, view.frame.size.height)];
imageView.contentMode = UIViewContentModeScaleAspectFill;
[view addSubview: imageView];

视图具有以下约束：

水平居中
固定宽度/高度
底部空间 = -50

我想通过翻转视图来为视图设置动画。我尝试了两种方法来做到这一点。

方法一：使用 transitionWithView:

这会导致在翻转动画时显示完整的图像（图像丢失了方面填充，看起来好像图像在视图中而不是视图本身被翻转）。

[UIView transitionWithView:view duration:1.0 options:UIViewAnimationOptionTransitionFlipFromRight | UIViewAnimationOptionShowHideTransitionViews animations:^{
} completion:nil];

方法 2：应用层变换

这会导致一个非常错误的动画，其中一半的视图控制器被切断。我相信这可能是由于自动布局中的限制。

[UIView animateWithDuration:1.0 animations:^{
    view.layer.transform = CATransform3DMakeRotation(M_PI,0.0,1.0,0.0);
}];

如何实现视图的平滑翻转动画，同时牢记视图的约束和图像子视图？

使用方法 1 的屏幕截图

这是带有子视图的原始视图

这是翻转动画中间的样子

使用方法 2 的屏幕截图

视图内的图像被切成两半，仍然可见的一半翻转。

UIView 和 UIImageView 的约束

【问题讨论】：

您能否为方法 2 添加屏幕截图。因为我已经尝试过该方法并为相同的方法提供解决方案。
添加方法2的截图@None
您是否添加了 UIImageView 约束，就像我在屏幕截图中显示的那样？
是的，我有@None i.stack.imgur.com/5jz7Q.png

标签： ios objective-c uiview autolayout uiviewanimation

【解决方案1】：

UIImageView 约束存在问题。为了在UIView 中获得完整的UIImageView，您需要设置以下约束。

输出是：

希望对您有所帮助。

【讨论】：

我试过这个，但我得到了同样的结果——子视图稍微扩大并翻转（我可以看到子视图的边缘）。似乎正在翻转子视图而不是主视图。
@Sudeep，请您添加您的屏幕截图。您面临的问题
@Sudeep，你能告诉我你的 UIView 约束吗？
更新了我的帖子@None
让我们continue this discussion in chat.

【解决方案2】：

这对我有用。确保在 viewDidLayoutSubviews 中调用它。

- (void)viewDidLayoutSubviews
{
    [super viewDidLayoutSubviews];
    [self makeImageRound]; // call it here to make perfect circle
}


- (void)makeImageRound
{
    self.profileView.layer.cornerRadius = self.profileView.frame.size.width / 2;
    self.profileView.layer.borderWidth = 0.0f;
    self.profileView.layer.borderColor = [UIColor whiteColor].CGColor;
    self.profileView.clipsToBounds = YES;
    self.profileView.layer.masksToBounds = true;
}

【讨论】：