问题描述
我希望能够将一个图像视图拖到另一个图像视图上,这样当它们重叠时,重叠区域会改变颜色。为了帮助可视化问题,这些图像视图是圆形的:当它们重叠时,应形成如下所示的维恩图式图像。
I'd like to be able to drag one imageview onto another, such that when they overlap, the overlapping area changes colour. To help visualise the problem, these imageviews are circular: when they overlap, it should form a Venn diagram-style image as shown below.
我知道您可以使用以下方法检测相交是否发生:
I know you can detect whether the intersection has occurred by using:
if (self.imageview1.bounds.contains(self.imageview2.bounds)) {
...
}
但是真的不知道如何给中间的区域上色!
But do not really know how to colour the area in between!
推荐答案
所以我想出了一种数学上的方法!基本上,您可以使用基本三角学来找到相交的两个弧所需的角度,并创建由这两个弧组成的贝塞尔曲线。然后,叠加贝塞尔曲线路径即可完成操作!这是我的代码,如果有人感兴趣的话:)
so I figured out a way to do this mathematically! Basically you use basic trigonometry to find the angles required for the two "arcs" of the intersection, and make a Bezier Path composed of these two arcs. Then just superpose the bezier path and you're done! Here's my code if anyone is interested :)
注意:假设两个圆的半径相同,并且我裁剪了图像视图,使它们成为圆形!
Note: this assumes both circles have the same radius, and I have clipped my imageviews such that they are circular!
let circlePath = UIBezierPath()
let left_circle_center = left_image_view.center.x
let right_circle_center = right_image_view.center.x
let radius = left_image_view.frame.width/2
let angle = acos( (left_circle_center - right_circle_center)/radius)
intersection_Path.addArc(withCenter: right_circle_center, radius: radius, startAngle: CGFloat(Double.pi-angle), endAngle: CGFloat(Double.pi+angle), clockwise: true)
intersection_Path.addArc(withCenter: left_circle_center, radius: radius, startAngle: CGFloat(-angle), endAngle: CGFloat(angle), clockwise: true
let intersection_area = CAShapeLayer()
intersection_area.path = intersection_Path.cgPath
intersection_area.borderColor = ...
intersection_area.strokeColor = ...
intersection_area.fillColor = ...
self.view.layer.addSublayer(intersection_area)
这篇关于找到两个图像视图重叠的重叠区域,并使该区域改变颜色的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!