Question

我试图在App上创建交互式滑动转换。

目标是在视图控制器从底部拖动时（不是从底部边缘，因此它不会与控制中心发生冲突）呈现uiview，并且将部分覆盖主视图控制器（就像iOS控制中心）。转换应该是交互式的，即根据用户的拖动。

很高兴听到有关可用API的想法。

Answer 1

下面的代码将执行在Xcode 8中测试的简单的slideView动画代码并且工作..

 import UIKit

class ViewController: UIViewController,UIGestureRecognizerDelegate {

// I am using VisualView as a slideView
@IBOutlet weak var slideView: UIVisualEffectView!

//Button to open slideView
@IBOutlet weak var button: UIBarButtonItem!

override func viewDidLoad() {
    super.viewDidLoad()
    // Do any additional setup after loading the view, typically from a nib.

    // setting background for sideView
       slideView.backgroundColor = UIColor(patternImage: UIImage(named: "original.jpg")!)

    //Initial hide so it won't show.when the mainView loads...
      slideView.isHidden = true

    // DownSwipe to hide slideView
       let downSwipe = UISwipeGestureRecognizer(target: self, action: #selector(ViewController.handleSwipes(_:)))
       downSwipe.direction = .down
       view.addGestureRecognizer(downSwipe)
    }

   // set UIButton to open slideVie...(I am using UIBarButton)
     @IBAction func sdrawButton(_ sender: AnyObject) {

      self.slideView.isHidden = false
      slideView.center.y += view.frame.height

      UIView.animate(withDuration: 0.7, delay: 0, options: UIViewAnimationOptions.curveEaseIn, animations:{
        self.slideView.center.y -= self.view.frame.height
        self.button.isEnabled = false
        }, completion: nil)  
}

   func handleSwipes(_ sender:UISwipeGestureRecognizer) {
    if (sender.direction == .down) {
        print("Swipe Down")

        self.slideView.isHidden = true

        self.slideView.center.y -= self.view.frame.height
        UIView.animate(withDuration: 0.7, delay: 0, options: UIViewAnimationOptions.curveEaseOut, animations:{
            self.slideView.center.y += self.view.frame.height
            self.button.isEnabled = true
            }, completion: nil)
  }  
  }
  }

让我知道代码适合你...

Answer 2

很抱歉，如果这个问题有点旧。您可以子类化UIView并覆盖touchesBegan（_，with）以保存原始触摸位置

override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
  guard let  touch = touches.first else { print("No touch"); return }
      startPoint = touch.location(in: self)
      startHeight = heightConstraint.constant
      slideDirection = .none
      super.touchesBegan(touches, with: event)
   }

}

和touchesMoved（_，with）在手指滑动视图时更新高度约束。

override func touchesMoved(_ touches: Set<UITouch>, with event: UIEvent?) {
  guard let touch = touches.first else { print("touchesMovedno touches"); return }

  let endPoint = touch.location(in: self)
  let diff = endPoint.y - startPoint.y

  // This causes the view to move along the drag
  switch anchorLocation {
  case .top :
     heightConstraint.constant = startHeight + diff
  case .bottom :
     heightConstraint.constant = startHeight - diff
  }
  self.layoutIfNeeded()

  // Update direction
  if diff == 0.0 {
     self.slideDirection = .none
  } else {
     self.slideDirection = (diff > 0) ? .down : .up
  }
  super.touchesMoved(touches, with: event)

}

如果您愿意，可以覆盖touchesEnded（_，with）添加动画

override func touchesEnded(_ touches: Set<UITouch>, with event: UIEvent?) {

  self.modifyHeightConstraints()
  self.animateViewTransition(duration: animDuration, delay: animDelay, clearance: animClearance, springDampingRatio: animSpringDampingRatio, initialSpringVelocity: animInitialSpringVelocity, complete: {
     self.slideDirection = .none
  })
  super.touchesEnded(touches, with: event)

}

我创建了一个可能具有您想要的功能的组件。该组件包括可调节的动画弹跳。您可以在故事板中的视图上布局和设计子视图。

查看GitHub中的链接

https://github.com/narumolp/NMPAnchorOverlayView

Swift中类似Control Center的滑动视图实现

2 个答案: