动画 UIView 没有按预期工作

Posted 2023-02-23

【中文标题】动画 UIView 没有按预期工作

【英文标题】：Animating UIView doesn't working as expected

【发布时间】：2014-10-29 13:50:32

【问题描述】：

在我的应用程序中，我使用了UIView，其中包括UITableView、Buttons 和Labels。它使用Storyboard 创建。当用户单击导航栏按钮UIView 时，将出现从顶部到某个高度的动画，如果再次单击它，它会隐藏带有动画的 UIView（从该高度到顶部）。 和UIActionView一样。

如果UITableView 中没有记录，它可以正常工作。但如果它有任何记录，则在调用[self hideBasket] 时，UIView 会从视图底部显示到顶部（未隐藏）。

// 隐藏购物篮代码

-(void)hideBasket
    /*Finished Hiding the Basket
     [self.view sendSubviewToBack:_shoppingCartView];
     [_shoppingCartView setHidden:YES];
     _isShoppingCartSeen = NO;*/

    CGRect basketFrame = _shoppingCartView.frame;
    basketFrame.origin.y = -basketFrame.size.height;

    [UIView animateWithDuration:1.0 delay:0.0 options:UIViewAnimationOptionCurveEaseOut animations:^
        _shoppingCartView.frame = basketFrame;
     completion:^(BOOL finished) 
        // Finished Hiding the Basket
        //[self.view sendSubviewToBack:_shoppingCartView];
       // [_shoppingCartView setHidden:YES];
        _isShoppingCartSeen = NO;
]; 

// 显示购物篮代码

-(void)showBasket

    /*[self.view bringSubviewToFront:_shoppingCartView];
    [_shoppingCartView setHidden:NO];
    _isShoppingCartSeen = YES;*/

    CGRect basketFrame = _shoppingCartView.frame;
    basketFrame.origin.y = 0;

    [UIView animateWithDuration:1.0 delay:0.0 options:UIViewAnimationOptionCurveEaseOut animations:^
        _shoppingCartView.frame = basketFrame;
     completion:^(BOOL finished) 
        // Finished Showing the Basket
        [self.view bringSubviewToFront:_shoppingCartView];
        [_shoppingCartView setHidden:NO];
        _isShoppingCartSeen = YES;
    ];

我在这里做错了什么？

【问题讨论】：

故事板上是否选择了自动布局？

@JimTierney 是的

【参考方案1】：

使用自动布局，您应该为约束设置动画，而不是更改对象的框架。

我已经模拟了一个从哪里开始使用约束的粗略示例，这应该可以解决您的问题

首先您需要设置购物篮视图的约束

每个对象必须至少设置 4 个约束才能正确设置。

请看下面的截图，按下我选择的视图底部的约束图标来设置视图的宽度和高度，加上左边的距离约束。

然后您需要将空间设置为超级视图的顶部，请参阅第二个屏幕截图。

将约束设置为超级视图的顶部

一旦你设置了约束，你设置 CTRL 将顶部空间拖到 superview 属性到你的头文件，如下面的屏幕截图。 （您还需要在视图中设置约束以适应您的表对象等），

现在已经设置好了，请将您的代码替换为以下代码，它应该可以正常工作

-(void)hideBasket

self.topVerticalSpaceConstraint.constant = -312;

[UIView animateWithDuration:1.0 delay:0.0 options:UIViewAnimationOptionCurveEaseOut animations:^

    [self.view layoutIfNeeded];

 completion:^(BOOL finished) 

];

-(void)showBasket

self.topVerticalSpaceConstraint.constant = 0;

    [UIView animateWithDuration:1.0 delay:0.0 options:UIViewAnimationOptionCurveEaseOut animations:^
        [self.view layoutIfNeeded];

     completion:^(BOOL finished) 

    ];

请注意，我只是在此处手动将常量设置为我制作的虚拟视图的大小，尽管您当然可以将其更改为视图的大小等。

请记住，理想情况下，您的每个视图/对象都应设置其约束，尤其是下拉视图中的 UITableview。在 UIView 中设置表格的高度、宽度和顶部和左侧空间约束就足够了。

如果您希望在第一次加载时隐藏视图，请使用 viewDidload 将约束设置为 -valueOfHeightOfBasket

我希望这会有所帮助。

【讨论】：

+1 非常感谢您花时间和精力复制它。我会尝试您的建议，并会回复您。

完美工作顺利。谢谢

太棒了，非常感谢。