2017-01-20 40 views
0

*更新发布后不久,我发现这看起来有我所有的答案。还没有为自己工作,但这可能会帮助其他人有类似的问题。 Scratch Card effect in Swift 3末更新*swift 3使用图层通过绘制“清晰”线条来显示图像

这是我第一次到栈中,以便道歉,如果这是一个有点“小白”问题。我的问题有两个部分。我已经使用了几个教程,告诉我如何在imageView中的图像上绘制线条,但是我正努力实现通过在图层上绘制“清晰”线条来显示覆盖层下面的图像的目标。想象一张刮刮卡......这就是我所追求的效果。

我已经使用了以下Stack问题/答案来帮助指导我最初Draw a line realtime with Swift 3.0;但是我的最终目标受到图像/视图边界混淆的进一步阻碍。

上面的教程非常适合初始绘图,除了当我触摸屏幕时,我的手指位置被转换为imageView坐标,所以线条永远不会出现在我放置手指的位置。我真的很喜欢有人帮助我转换坐标,这样我的手指就能确切画出线条。我试着改变'Draw line'func的边界,但是我从图像中得到了奇怪的行为,并且绘图完全停止工作。

如果有人能够帮助解决这两个问题,我会非常感激。如果我需要分解问题,那么我会这样做。如果有帮助,我附上我的代码。感谢您看...

class ViewController: UIViewController { 


@IBOutlet weak var myImageView: UIImageView! 

var layer: CALayer { 
    return myImageView.layer 
} 

var lastPoint = CGPoint.zero 
var red: CGFloat = 0.0 
var green: CGFloat = 0.0 
var blue: CGFloat = 0.0 
var brushWidth: CGFloat = 10.0 
var opacity: CGFloat = 1.0 
var swiped = false 

override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) { 
    swiped = false 
    if let touch = touches.first { 
     lastPoint = touch.location(in: self.view) 
    } 
} 

func drawLine(from fromPoint: CGPoint, to toPoint: CGPoint) { 
    UIGraphicsBeginImageContextWithOptions(view.bounds.size, false, 0) 

    myImageView.image?.draw(in: view.bounds) 

    let context = UIGraphicsGetCurrentContext() 

    context?.move(to: fromPoint) 
    context?.addLine(to: toPoint) 

    context?.setLineCap(CGLineCap.round) 
    context?.setLineWidth(brushWidth) 
    context?.setStrokeColor(red: red, green: green, blue: blue, alpha: 1.0) 
    context?.setBlendMode(CGBlendMode.normal) 
    context?.strokePath() 

    myImageView.image = UIGraphicsGetImageFromCurrentImageContext() 
    myImageView.alpha = opacity 
    UIGraphicsEndImageContext() 
} 

override func touchesMoved(_ touches: Set<UITouch>, with event: UIEvent?) { 
    swiped = true 
    if let touch = touches.first { 
     let currentPoint = touch.location(in: view) 
     drawLine(from: lastPoint, to: currentPoint) 

     lastPoint = currentPoint 
    } 
} 

override func touchesEnded(_ touches: Set<UITouch>, with event: UIEvent?) { 
    if !swiped { 
     // draw a single point 
     self.drawLine(from: lastPoint, to: lastPoint) 
    } 
} 

func setUpLayer() { 
    layer.backgroundColor = UIColor.clear.cgColor 
    layer.borderWidth = 10.0 
    layer.borderColor = UIColor.red.cgColor 
    layer.shadowOpacity = 0.7 
    layer.shadowRadius = 10.0 
} 

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

    myImageView.image = UIImage(named: "8BitGirls.png") 

    setUpLayer() 
} 

}

回答

0

的UIResponder倒是方法返回在UIViewController.view坐标坐标,但你需要在你的imageViews坐标绘制。 UIView有多种方法来帮助你做到这一点。尝试this one

myImageView.convert(fromPoint, from: view) 
+0

嗨@Josh,感谢您的帮助。这有助于我理解为什么coords已经出来,但是我试着将你的代码放到我的drawline函数中,并且它没有工作......你能建议它需要转换的地方吗? –

相关问题