想呈现模态视图但是如何使其部分占据屏幕?

时间:2018-09-15 20:45:33

标签: ios swift swift4

我有两个视图控制器。 (请参阅附件)左侧的Viewcontroller称为“ ViewController”,右侧的Modal viewController被称为“ draggableViewController”。当我运行此应用程序时,右侧的蓝色视图对象将接管第一个viewController。右侧模态viewController上的蓝色视图对象应该滑过第一个viewController的顶部,但是我没有动画地显示该视图,因此它将看起来好像蓝色视图一直位于第一个ViewController的顶部。

我想要实现的是只显示1/3的蓝色视图,我希望它停留在屏幕底部1/3上。我不知道如何设置蓝色视图的位置 以仅在屏幕底部1/3上显示它。

这是每个viewController的源代码。

1:ViewController:

class ViewController: UIViewController {

    override func viewDidAppear(_ animated: Bool) {
        let newView = self.storyboard!.instantiateViewController(withIdentifier: "draggableViewController") as! draggableViewController
        newView.modalPresentationStyle = UIModalPresentationStyle.overFullScreen
        self.present(newView, animated: false, completion: nil)
    }

}

2:draggableViewController:

class draggableViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        self.view.frame = CGRect(x: 0, y: 300, width: self.view.frame.width, height: self.view.frame.height)

        let panGestureRecognizer = UIPanGestureRecognizer(target: self, action: #selector(panGestureRecognizerAction(_:)))

        self.view.addGestureRecognizer(panGestureRecognizer)
    }

    @objc func panGestureRecognizerAction(_ gestureRecognizer: UIPanGestureRecognizer){

        // 1. use these values to restrict the left and right sides so the orangeImageView won't go beyond these points
        let leftSideRestrction = self.view.frame.minX
        let rightSideRestriction = self.view.frame.maxX
        let topRestriction = 0

        // 2. use these values to redraw the orangeImageView's correct size in either Step 6 or Step 8 below
        let imageViewHeight = self.view.frame.size.height
        let imageViewWidth = self.view.frame.size.width

         if gestureRecognizer.state == .changed || gestureRecognizer.state == .began {

            let translation: CGPoint = gestureRecognizer.translation(in: self.view)

            gestureRecognizer.view!.center = CGPoint(x: gestureRecognizer.view!.center.x  + translation.x, y: gestureRecognizer.view!.center.y + translation.y)

            gestureRecognizer.setTranslation(CGPoint.zero, in: self.view)     
            /*
             3.
             -get the the upper left hand corner of the imageView's X and Y origin to get the current location of the imageView as it's dragged across the screen.
             -you need the orangeImageView.frame.origin.x value to make sure it doesn't go beyond the left or right edges
             -you need the orangeImageView.frame.origin.y value to redraw it in Steps 6 and 8 at whatever Y position it's in when it hits either the left or right sides
             */
            var imageViewCurrentOrginXValue = self.view.frame.origin.x
            var imageViewCurrentOrginYValue = self.view.frame.origin.y

            print("origin x: \(imageViewCurrentOrginXValue)")
            print("origin y: \(imageViewCurrentOrginYValue)")

            // 4. get the right side of the orangeImageView. It's computed using the orangeImageView.frame.origin.x + orangeImageView.frame.size.width
            let imageViewRightEdgePosition = imageViewCurrentOrginXValue + imageViewWidth


            // 5. if the the orangeImageView.frame.origin.x touches the left edge of the screen or beyond it proceed to Step 6
            if imageViewCurrentOrginXValue <= leftSideRestrction {

                // 6. redraw the orangeImageView's frame with x: being the far left side of the screen and Y being where ever the current orangeImageView.frame.origin.y is currently positioned at
                if imageViewCurrentOrginYValue <= 0 {

                    // 6. redraw the orangeImageView's frame with x: being the far left side of the screen and Y being where ever the current orangeImageView.frame.origin.y is currently positioned at
                    imageViewCurrentOrginYValue = 0

                    self.view.frame = CGRect(x: leftSideRestrction, y: imageViewCurrentOrginYValue, width: imageViewWidth, height: imageViewHeight)    
                }

                if imageViewCurrentOrginYValue >= self.view.frame.height-200 {

                    // 6. redraw the orangeImageView's frame with x: being the far left side of the screen and Y being where ever the current orangeImageView.frame.origin.y is currently positioned at
                    imageViewCurrentOrginYValue = self.view.frame.height - 200

                    print(imageViewCurrentOrginYValue)

                    self.view.frame = CGRect(x: leftSideRestrction, y: imageViewCurrentOrginYValue, width: imageViewWidth, height: imageViewHeight)   
                }

                self.view.frame = CGRect(x: leftSideRestrction, y: imageViewCurrentOrginYValue, width: imageViewWidth, height: imageViewHeight)
            }

            // 7. if the the orangeImageView.frame.origin.x touches the right edge of the screen or beyond it proceed to Step 8
            if imageViewRightEdgePosition >= rightSideRestriction{

                // 8. redraw the orangeImageView's frame with x: being the rightSide of the screen - the orangeImageView's width and y: being where ever the current orangeImageView.frame.origin.y is currently positioned at
                if imageViewCurrentOrginYValue <= 0 {

                    // 6. redraw the orangeImageView's frame with x: being the far left side of the screen and Y being where ever the current orangeImageView.frame.origin.y is currently positioned at
                    imageViewCurrentOrginYValue = 0

                    self.view.frame = CGRect(x: leftSideRestrction, y: imageViewCurrentOrginYValue, width: imageViewWidth, height: imageViewHeight)
                }

                if imageViewCurrentOrginYValue >= self.view.frame.height - 200 {

                    // 6. redraw the orangeImageView's frame with x: being the far left side of the screen and Y being where ever the current orangeImageView.frame.origin.y is currently positioned at

                    imageViewCurrentOrginYValue = self.view.frame.height - 200

                    print(imageViewCurrentOrginYValue)

                    self.view.frame = CGRect(x: leftSideRestrction, y: imageViewCurrentOrginYValue, width: imageViewWidth, height: imageViewHeight)
                }

                self.view.frame = CGRect(x: rightSideRestriction - imageViewWidth, y: imageViewCurrentOrginYValue, width: imageViewWidth, height: imageViewHeight)
            }
    }

  }

}

Viewcontroller on the left is called "ViewController" and viewController on the right is known as "draggableViewController"

我在哪里设置该蓝色视图的位置?

2 个答案:

答案 0 :(得分:0)

一个简单的解决方案是将蓝色视图中的约束设置为主控制器大小的1/3,并使背景透明或模糊,因此背景仅向上滑动1/3大小。 为此,请将视图设置为蓝色,并使用该视图及其后的所有内容使其透明。

答案 1 :(得分:0)

  

我在哪里设置该蓝色视图的位置

在UIPresentationController子类中,当您作为自定义过渡动画正确执行此操作时。