在使用自动布局下动画/移动视图

Posted 2023-03-12

【中文标题】在使用自动布局下动画/移动视图

【英文标题】：Animating/Moving views under usage of Autolayout

【发布时间】：2012-12-06 13:46:53

【问题描述】：

我想将视图从一个位置移动到另一个位置，我可以使用

来实现它

self.view.center = CGPointMake(100, 200);

但是，如果项目使用 Autolayout，那么运行后视图会回到原来的位置：

[self.view.superview setNeedsLayout];

那么如何将视图实际移动到新位置？

【参考方案1】：

启用AutoLayout 后，我们应该FORGET FRAMES 并且只有CONSIDER CONSTRAINTS。是的，对于动画，您也不能再更改框架或中心，视图将在调用布局时恢复到其原始位置。

相反，您应该consider changing the constant value of the constraint 以获得相同的效果。

考虑如下图所示的用户界面。我有一个带有20 points leading space from it's superview 的图像视图，这意味着它的超级视图具有水平空间约束。此外，我还有三个附加到该图像视图的约束，顶部，宽度和高度。

我将向您展示我们如何将图像从左到右设置为动画，如图所示。

为我们需要动画的约束创建 IBOutlet。这里我们只采用水平空间约束，这足以让这个视图从左向右移动。

@property (weak, nonatomic) IBOutlet UIImageView *imageView;
@property (weak, nonatomic) IBOutlet NSLayoutConstraint *horizontalSpaceConstraint;

在Go Away 动作中，我们需要更新这个约束的常量值。

- (IBAction)moveFrontAction:(id)sender 
    self.horizontalSpaceConstraint.constant = 220;

    [UIView animateWithDuration:0.5 animations:^
         [self.imageView layoutIfNeeded];
    ];

现在视图应该移动到右端。我只是在动画块内这样做，这样我们就可以从左到右看到漂亮的动画，反之亦然。在生产中，我们不应该硬编码像这样的价值观。只是在这里做是为了让概念清晰。

在Come Back 动作中，我们再次将常量重置为其原始值，因此您可以看到橙色图像动画回到原始位置。

- (IBAction)moveBackAction:(id)sender 
    self.horizontalSpaceConstraint.constant = 20;

    [UIView animateWithDuration:0.5 animations:^
        [self.imageView layoutIfNeeded];
    ];

【讨论】：

嘿 user1687717 想要使用视图的触摸方法滚动视图，而不是使用动画样式..

在改变约束的常数之前，最好调用[self.imageView layoutIfNeeded] 。在这里它没有任何影响，但在实际项目中可能有其他动画正在运行。所以你的 imageview 必须在动画之前知道你的最后一帧。-(IBAction)moveBackAction:(id)sender [self.imageView layoutIfNeeded]; self.horizontalSpaceConstraint.constant = 20; [UIView animateWithDuration:0.5 animations:^ [self.imageView layoutIfNeeded]; ];

【参考方案2】：

如果您使用自动布局，则必须更改约束。建议的方法是在约束的视图控制器中创建一个出口，然后更改约束的常量。如果你有时间，我肯定会推荐going here 并观看“Auto Layout by Example”或“Best Practices for Mastering Auto Layout”。他们帮了我很多。我想要带走的一点是，使用自动布局，您不再考虑框架。因此，设置中心不适用于自动布局。关键在于视图之间如何相互关联。

【讨论】：

听起来使用自动布局比使用框架移动视图更难，因为我应该得到该视图的所有出口

一开始比较难，但实际上我开始更喜欢它了。你可以用它做更多的事情

这里是第二个@ClintWarner：Autolayout 最初的设置可能需要付出更多的努力，但它在维护和可读性方面带来了巨大的好处。现在我已经习惯了实现约束，使用框架数学似乎很乏味和令人沮丧。

我一直在寻找这个答案。你拯救了我的一天！

下面的答案是正确的。如果您没有时间观看视频，请查看以下答案。