Question

想象一个高大的薄视图L（比如，它看起来像一个梯子）。

说它高100，我们将它设置为屏幕的整个高度。所以，在伪代码中..

func expandLadder() {
view.layoutIfNeeded()
UIView.animate(withDuration: 4 ...
  ladderTopToTopOfScreenConstraint = 0
  ladderBottomToBottomOfScreenConstraint = 0
  view.layoutIfNeeded()
}

没问题。现在说我们沿着这些线在layoutSubviews中绘制梯子。

@IBDesignable class LadderView: UIView {
override func layoutSubviews() {
  super.layoutSubviews()
  setup()
}

func setup() {
  heightNow = frame size height
  print("I've recalculated the height!")
  shapeLayer ...
  topPoint = (0, 0)
  bottomPoint = (0, heightNow)
  p.addLines(between: [topPoint, bottomPoint])
  shapeLayer!.path = p
  shapeLayer add a CABasicAnimation or whatever
  layer.addSublayer(shapeLayer!)
}

没问题。

所以我们只是制作一条填充高度的线p＆＃34; heightNow＆＃34;观点。

问题当然是，当你这样做时......

func expandLadder() {
view.layoutIfNeeded()
UIView.animate(withDuration: 4 ...
  ladderToTopOfScreenConstraint = 0
  ladderBottomOfScreenConstraint = 0
  view.layoutIfNeeded()
}

...当你这样做时，LayoutSubviews（或setBounds，或者绘制#rect，或者你能想到的任何其他东西）只被称为＆＃34;＆＃34;之前和之后UIView.animate动画。这真的很痛苦。

（在示例中，＆＃34;实际＆＃34;梯形图，shapeLayer，在您将视图L的大小设置为动画或动画之前，将跳转到下一个值。即，＆＃34; I＆＃ 39;重新计算了高度！＆＃34;在UIView.animate动画之前和之后只调用一次。假设你没有剪辑子视图，你会看到错误的，即将到来的＆＃34 ;每个动画长度为L之前的大小。）

解决方案是什么？

当然，顺便说一下（可以这么说）你可以使用draw＃rect和自己设置动画，即使用CADisplayLink（如Josh所提到的）。这很好。当然，使用图层/路径绘制形状等非常容易：我的问题是如何在UIView的每一步中运行代码（即上面的setup（）中的代码）有问题的视图约束的动画？

Answer 1

您描述的行为与iOS动画的工作方式有关。特别是当您在UIAnimation块中设置视图的帧时（它是layoutIfNeeded所做的 - 它会根据自动布局规则强制同步重新计算帧）视图的帧立即< / strong>更改新值，即动画结束时的表观值（在layoutIfNeeded之后添加一个print语句，您可以看到这是真的）。顺便说一下，在调用layoutIfNeeded之前，更改约束并不会做任何事情，因此您甚至不需要将约束更改放在动画块中。

然而，在动画期间，系统显示表示层而不是背景层，并且它在动画持续时间内将表示层中帧的值从初始值插值到最终值。这使得它看起来像视图正在移动，即使检查该值将显示视图已经已经占据其最终位置。

因此，如果您想要在动画播放时屏幕图层的实际坐标，则必须使用view.layer.presentationLayer来获取它们。请参阅：https://developer.apple.com/reference/quartzcore/calayer/1410744-presentationlayer

这并不能完全解决你的问题，因为我认为你要做的就是随着时间的推移产生更多的层。如果您不能使用简单插值，那么最好在开始时生成所有图层，然后使用关键帧动画在动画进行时以特定间隔打开它们。您可以将您的图层位置基于view.layer.presentationLayer.bounds（您的子图层位于其超级图层坐标中，因此不要使用框架）。在不知道你想要完成什么的情况下提供精确的解决方案很困难。

另一种可能的解决方案是使用带有CADisplayLink的drawRect，它允许您根据需要重绘每个帧，因此它更适合于无法在帧与帧之间轻松插入的内容（即游戏或在您添加的情况下） /删除动画几何图形作为时间的函数。）

编辑：这是一个示例Playground，显示如何与视图并行地为图层设置动画。

//: Playground - noun: a place where people can play import UIKit import PlaygroundSupport class V: UIViewController { var a = UIView() var b = CAShapeLayer() var constraints: [NSLayoutConstraint] = [] override func viewDidLoad() { view.addSubview(a) a.translatesAutoresizingMaskIntoConstraints = false constraints = [ a.topAnchor.constraint(equalTo: view.topAnchor, constant: 100), a.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 100), a.widthAnchor.constraint(equalToConstant: 200), a.heightAnchor.constraint(equalToConstant: 200) ] constraints.forEach {$0.isActive = true} a.backgroundColor = .blue } override func viewDidAppear(_ animated: Bool) { b.path = UIBezierPath(ovalIn: a.bounds).cgPath b.fillColor = UIColor.red.cgColor a.layer.addSublayer(b) constraints[3].constant = 400 constraints[2].constant = 400 let oldBounds = a.bounds UIView.animate(withDuration: 3, delay: 0, options: .curveLinear, animations: { self.view.layoutIfNeeded() }, completion: nil) let scale = a.bounds.size.width / oldBounds.size.width let animation = CABasicAnimation(keyPath: "transform.scale") animation.fromValue = 1 animation.toValue = scale animation.duration = 3 b.add(animation, forKey: "scale") b.transform = CATransform3DMakeScale(scale, scale, 1) } } let v = V() PlaygroundPage.current.liveView = v

Answer 2

plugins { id "net.ltgt.apt" version "0.5" } apply plugin: 'java' apply plugin: 'idea' ... dependencies { compile 'com.google.dagger:dagger:2.10' apt 'com.google.dagger:dagger-compiler:2.10' }仅在需要时才会致电layoutIfNeeded()。我在您的代码中看不到layoutSubviews()。这就是在没有约束的情况下它是如何完成的！如果您有约束，则应调用setNeedsLayout()并在animationBlock setNeedsUpdateConstraints()中调用。

layoutIfNeeded

在UIView.animate期间动画形状图层类型自定义UIViews？

2 个答案: