3

我正在尝试创建一个类似于 snapchat 的自定义弹出过渡,当您在故事上向下滑动时,视图开始缩小,并且可以在背景中看到前一个视图控制器。

我不需要它那么花哨,一个缩小的圈子就是我想要的。我已经设法创建了一个自定义推送转换,可以“缩小”要推送的视图控制器,可以这么说,来自本教程。要流行,我基本上只是想扭转它。我的自定义推送动画代码基本上是这样的:

  func animateTransition(transitionContext: UIViewControllerContextTransitioning) {

  //1
  self.transitionContext = transitionContext

  //2
  var containerView = transitionContext.containerView()
  var fromViewController = transitionContext.viewControllerForKey(UITransitionContextFromViewControllerKey) as! ViewController
  var toViewController = transitionContext.viewControllerForKey(UITransitionContextToViewControllerKey) as! ViewController
  var button = fromViewController.button

  //3
  containerView.addSubview(toViewController.view)

  //4
  var circleMaskPathInitial = UIBezierPath(ovalInRect: button.frame)
  var extremePoint = CGPoint(x: button.center.x - 0, y: button.center.y - CGRectGetHeight(toViewController.view.bounds))
  var radius = sqrt((extremePoint.x*extremePoint.x) + (extremePoint.y*extremePoint.y))
  var circleMaskPathFinal = UIBezierPath(ovalInRect: CGRectInset(button.frame, -radius, -radius))

  //5
  var maskLayer = CAShapeLayer()
  maskLayer.path = circleMaskPathFinal.CGPath
  toViewController.view.layer.mask = maskLayer

  //6
  var maskLayerAnimation = CABasicAnimation(keyPath: "path")
  maskLayerAnimation.fromValue = circleMaskPathInitial.CGPath
  maskLayerAnimation.toValue = circleMaskPathFinal.CGPath
  maskLayerAnimation.duration = self.transitionDuration(transitionContext)
  maskLayerAnimation.delegate = self
  maskLayer.addAnimation(maskLayerAnimation, forKey: "path")
}

我也可以以同样的方式弹出,但我想要一个放大而不是缩小的遮罩圈......

到目前为止,我已尝试反转掩码,类似于此(stackoverflow /questions/14411765/ios-invert-mask-in-drawrect)和此(stackoverflow /questions/16512761/calayer-with-transparent-hole-in-it ),但我一辈子都无法让它正常工作。

这个github 项目似乎有我想要的东西,但我无法重新创建他所做的。这个星球大战项目(github /Yalantis/StarWars.iOS)似乎也做了一些与我想要的类似的事情(从 Darth Vader 回到 Anakin),但我认为它使用的屏幕截图并不是我真正想做的。

此外,如果我可以让过渡跟随用户的手指并且无论他们在哪里抬起过渡都会继续,而不是仅仅跳到完成,这就是 raywenderlich 的示例所做的,那将是非常酷的。

对于奇怪的链接,我很抱歉,我还没有足够的声誉来放置超过 2 个链接。

我将非常感谢任何人的帮助或输入!!!

tl;dr:当您在快照故事中向下滑动时,类似 snapchat 的流行过渡。

4

1 回答 1

4

我刚刚创建了一个示例项目,用于使用圆形遮罩以交互方式向下拖动以关闭视图控制器。检查此github以获取示例项目。

在此处输入图像描述

于 2016-04-26T13:43:37.383 回答