如何在ScrollView中的图像上绘制线条 - Swift 3

时间:2018-04-16 23:47:08

标签: ios swift3 core-graphics

我正在创建一个应用程序,允许用户在图像上绘制2个矩形,包含在滚动视图中。但是,此刻,该线似乎没有被绘制。

这是处理绘图的UIViewController:

import UIKit
import CoreGraphics
import CoreData

class PhotoZoomController: UIViewController {

    //Photo View's Variables
    @IBOutlet weak var scrollView: UIScrollView!

    @IBOutlet weak var photoImageView: UIImageView!
    @IBOutlet weak var imageViewLeadingConstraint: NSLayoutConstraint!
    @IBOutlet weak var imageViewBottomConstraint: NSLayoutConstraint!
    @IBOutlet weak var imageViewTopConstraint: NSLayoutConstraint!
    @IBOutlet weak var imageViewTrailingConstraint: NSLayoutConstraint!

    var photo: Photo!

    var indicatorPoints: [CGPoint]!
    var objectPoints: [CGPoint]!

    var context: NSManagedObjectContext!

    var brushWidth: CGFloat = 10.0;
    var brushColor: CGColor = UIColor.cyan.cgColor

    override func viewDidLoad() {
        super.viewDidLoad()

        photoImageView.image = photo.image
        photoImageView.sizeToFit()
        scrollView.contentSize = photoImageView.bounds.size
        updateZoomScale()
        updateConstraintsForSize(view.bounds.size)
        view.backgroundColor = .black        
    }

    var minZoomScale: CGFloat {
        let viewSize = view.bounds.size
        let widthScale = viewSize.width/photoImageView.bounds.width
        let heightScale = viewSize.height/photoImageView.bounds.height

        return min(widthScale, heightScale)
    }

    func updateZoomScale() {
        scrollView.minimumZoomScale = minZoomScale
        scrollView.zoomScale = minZoomScale
    }

    func updateConstraintsForSize(_ size: CGSize) {
        let verticalSpace = size.height - photoImageView.frame.height
        let yOffset = max(0, verticalSpace/2)
        imageViewTopConstraint.constant = yOffset
        imageViewBottomConstraint.constant = yOffset

        let xOffset = max(0, (size.width - photoImageView.frame.width)/2)
        imageViewLeadingConstraint.constant = xOffset
        imageViewTrailingConstraint.constant = xOffset
    }


    @IBAction func tappedInside(_ sender: Any) {
        guard let sender = sender as? UITapGestureRecognizer else {
            return
        }

        let touch = sender.location(in: self.photoImageView)

        for i in 0...3 {
            if indicatorPoints[i] == CGPoint() {
                indicatorPoints[i] = touch
                return
            }
        }

        for i in 0...3 {
            if objectPoints[i] == CGPoint() {
                objectPoints[i] = touch
                return
            }
        }

    //This part isn't finished, but it's supposed to modify previous points

    }
}


extension PhotoZoomController {

我觉得这就是我的问题开始的地方。我知道这段代码会运行,因为我已经在这里放了一个print语句并运行了。

    func drawLine(between points: [CGPoint]) {
        UIGraphicsBeginImageContextWithOptions(self.photoImageView.bounds.size, false, 0)

        photoImageView.image?.draw(in: self.photoImageView.bounds)

        guard let context = UIGraphicsGetCurrentContext() else {
            return
        }

        context.setLineCap(.round)
        context.setLineWidth(brushWidth)
        context.setStrokeColor(brushColor)
        context.addLines(between: points)
        context.strokePath()

        UIGraphicsEndImageContext()
    }
}

extension PhotoZoomController: UIScrollViewDelegate {
    func viewForZooming(in scrollView: UIScrollView) -> UIView? {
        return photoImageView
    }

    func scrollViewDidZoom(_ scrollView: UIScrollView) {
        updateConstraintsForSize(view.bounds.size)

        if scrollView.zoomScale < minZoomScale {
            dismiss(animated: true, completion: nil)
        }
    }
}

这就是UIViewController目前的样子(可能会有一些错误的视图顺序?): Storyboard picture of the ZoomController (This UIViewController)

1 个答案:

答案 0 :(得分:3)

你在说

UIGraphicsBeginImageContextWithOptions

UIGraphicsEndImageContext

并且在他们之间,当上下文存在时,你会吸引它。

到目前为止,非常好。

无处你说

UIGraphicsGetImageFromCurrentImageContext

因此,包含绘图结果的上下文将被丢弃。