通过更改宽度和高度为矩形设置动画

Posted 2023-02-16

【中文标题】通过更改宽度和高度为矩形设置动画

【英文标题】：Animate rectangle by change width and height

【发布时间】：2015-12-09 12:07:14

【问题描述】：

我的UIViewController 中有ImageView：

我想为这个图像设置动画，定期改变宽度和高度。如果您单击“扫码”，您可以在 Iphone 上的 Apple Wallet 应用程序中看到相同的动画。我尝试了很多，但我的代码工作不正确或应用程序在 3-5 分钟后开始滞后...

这是我最后的代码：

class ViewController: UIViewController 
    @IBOutlet weak var focusImage: UIImageView!
    override func viewDidAppear(animated: Bool) 
        super.viewDidAppear(animated)
        self.resizeFocusImageUp()
    
    func resizeFocusImageUp() 
        UIView.animateWithDuration(2.0, delay: 0.0, options: UIViewAnimationOptions.CurveEaseIn, animations: 
            self.focusImage.frame = CGRectMake(
                self.focusImage.frame.origin.x+50,
                self.focusImage.frame.origin.y-50,
                self.focusImage.frame.size.width-50,
                self.focusImage.frame.size.height+50
            )
            self.view.layoutIfNeeded()
            self.view.bringSubviewToFront(self.focusImage)
            , completion: (Bool) in
                self.resizeFocusImageDown()
            )
    

    func resizeFocusImageDown() 
        UIView.animateWithDuration(2.0, delay: 0.0, options: UIViewAnimationOptions.CurveEaseOut, animations: 
            self.focusImage.frame = CGRectMake(
                self.focusImage.frame.origin.x-50,
                self.focusImage.frame.origin.y+50,
                self.focusImage.frame.size.width+50,
                self.focusImage.frame.size.height-50
            )
            self.view.layoutIfNeeded()
            self.view.bringSubviewToFront(self.focusImage)

            , completion: (Bool) in
                self.resizeFocusImageUp()
        )
    

另外，对于我的ImageView，我使用了约束：

【问题讨论】：

如果你使用自动布局，你应该动画你的约束而不是框架

【参考方案1】：

正如另一位海报所说，如果您使用的是 AutoLayout，那么您需要为约束设置动画，而不是框架。

为视图的高度和宽度创建约束，并在需要在动画中移动它时定位。然后从您的 CONSTRAINTS 控制并拖动到您的视图控制器的标题中以创建出口。

然后在你的动画块中改变每个约束的常量值，然后调用 layoutIfNeeded 来触发动画。 （关键部分是对 layoutIfNeeded 的调用需要在动画块内。似乎实际上是什么导致了约束改变视图的大小/位置。）

话虽如此，对于像您在帖子中展示的线条图，最好使用 CAShapeLayer 并为图层的路径设置动画。你会得到看起来更清晰的形状，并且动画非常流畅。

【讨论】：

但是当视图消失并再次出现时如何停止和重置动画。

如果您添加一个 CAShapeLayer 作为视图的子层，那么当您移除视图时，它也会移除该层（及其动画）。或者，您可以将removeAllAnimations 消息发送到图层。

【参考方案2】：

//下面的 Objective-C 代码在我的应用程序中正常工作。按照你的要求做你的事情。

注意：如果您对该对象（图像视图）使用 autoalyout，则在视图中添加以下两行代码确实加载方法。

  imageView.translatesAutoresizingMaskIntoConstraints = YES;
  imageView.frame = CGRectMake(x, y, width, height);

//Method For Zoom IN Animations Of View
-(void)ZoomInAnimationOfView

       imageView.transform = CGAffineTransformScale(CGAffineTransformIdentity, 0.01, 0.01);

    [UIView animateWithDuration:1.0 animations:^
        imageView.transform = CGAffineTransformScale(CGAffineTransformIdentity, 1.0, 1.0);
     completion:^(BOOL finished) 
        imageView.transform = CGAffineTransformIdentity;

    ];

//缩小动画的方法

-(void)ZoomOutAnimationOfView

      imageView.transform = CGAffineTransformScale(CGAffineTransformIdentity, 1.0, 1.0);

    [UIView animateWithDuration:1.0 animations:^
        imageView.transform = CGAffineTransformScale(CGAffineTransformIdentity, 0.001, 0.001);
     completion:^(BOOL finished) 
        imageView.transform = CGAffineTransformIdentity;
    ];

【讨论】：

@Arti，此链接也遵循相同的场景。请查看：-***.com/questions/11261618/…