当前位置 : 主页 > 手机开发 > 其它 >

Swift:使相同颜色的半透明重叠线在交叉时不会改变颜色

来源:互联网 收集:自由互联 发布时间:2021-06-11
目前我在屏幕上绘制了两条相同颜色的线,但两者的alpha值都小于1.当这些线相交时,交点与其他线的颜色不同.之前的帖子解决了同一个问题: swift drawing translucent lines, how to make overlappin
目前我在屏幕上绘制了两条相同颜色的线,但两者的alpha值都小于1.当这些线相交时,交点与其他线的颜色不同.之前的帖子解决了同一个问题: swift drawing translucent lines, how to make overlapping parts not getting darker?但是,这篇文章没有得到充分的回答.我画的线条目前是这样的:

var points = [CGPoint]()

    points = [CGPoint(x: -100, y: 100), CGPoint(x: 100, y: -100)]
    let FirstLine = SKShapeNode(points: &points, count: points.count)
    FirstLine.strokeColor = UIColor.init(red: 0.25, green: 0.62, blue: 0.0, alpha: 0.5)
    FirstLine.lineWidth = 30
    addChild(FirstLine)

    points = [CGPoint(x: 100, y: 100), CGPoint(x: -100, y: -100)]
    let SecondLine = SKShapeNode(points: &points, count: points.count)
    SecondLine.strokeColor = UIColor.init(red: 0.25, green: 0.62, blue: 0.0, alpha: 0.5)
    SecondLine.lineWidth = 30
    addChild(SecondLine)

这是它的样子:

我理解为什么会发生这种情况,但有没有办法让交叉点看起来一样,所以它看起来好多了?

编辑:我已决定实施@ Confused的答案.但是,现在的问题是纹理始终以屏幕中间为中心.这是一个例子:

红十字处于正确的位置,因为它将指定的点连接在一起.然而,一旦我将红十字作为纹理,它总是居中于屏幕的中间(绿色十字是红十字作为纹理).我可以使用任何可以将纹理重新定位到正确位置的代码.注意:此代码不能仅适用于此示例,我需要一个无论红十字位置如何都能正常工作的代码.

对具有相同问题的人的最终编辑

首先,设置如下所示:

var points = [CGPoint]()
let crossParent = SKNode()
addChild(crossParent)

请注意,您必须为纹理创建父SKNode,否则屏幕上的所有内容都将成为纹理,而不仅仅是您想要的节点.然后,将该父节点添加到场景中.

之后,创建所需的行(在本例中为绿色十字):

//The first line of the green cross
points = [CGPoint(x: -300, y: 300), CGPoint(x: -100, y: 100)]
let FirstLine = SKShapeNode(points: &points, count: points.count)
FirstLine.strokeColor = UIColor.init(red: 0.25, green: 0.62, blue: 0.0, alpha: 1.0)
FirstLine.lineWidth = 30
crossParent.addChild(FirstLine)

请记住,不要将您创建的第一行添加到场景中,而是添加到您在开头创建的父SKNode.另外,为绘制的每一行设置alpha值为1.0.然后添加其他行:

//The second line of the green cross
points = [CGPoint(x: -100, y: 300), CGPoint(x: -300, y: 100)]
let SecondLine = SKShapeNode(points: &points, count: points.count)
SecondLine.strokeColor = UIColor.init(red: 0.25, green: 0.62, blue: 0.0, alpha: 1.0)
SecondLine.lineWidth = 30
FirstLine.addChild(SecondLine)

请注意,您必须将该行添加到第一行,而不是像场景一样.如果您在添加第一行后添加多行,则将其添加到第一行,就像我在此处每次连续一样
你添加的行.

现在,创建如下纹理:

let tex = view?.texture(from: FirstLine)
 let cross = SKSpriteNode(texture: tex, color: .clear, size: (tex?.size())!)
 cross.alpha = 0.5
 addChild(cross)

完成此操作后,无论你调用十字架都将是你的纹理,你可以像我在这里所做的那样将alpha值更改为你想要的任何颜色并且图像不会有不同的颜色.记得然后将该纹理添加到场景中.

最后,您可能会注意到纹理与最初放置点的位置不在同一位置.你可以把它放回到这样的位置:

cross.position = CGPoint(x: (FirstLine.frame.midX), y: (FirstLine.frame.midY))

希望这有帮助:)感谢@Confused程序的纹理部分:D

这是一种技术.它不能解决您的问题,也不会直接回答您的问题.相反,它提供了一种获得所需结果的方法,但没有您实际想要的线条的灵活性和固有性质.

您可以使用任意数量的技术从使用任意数量的节点绘制的任何内容创建纹理.

通过将所有绘图元素附加到您有权访问的SKView空间中的单个节点,然后将绘制对象的“父”节点渲染到纹理,可以执行此操作(最简单的方法).

这有什么用?

我很高兴你问:

您可以在100%的不透明度级别绘制所有内容,并将其渲染为纹理,然后获取图形的纹理,将其放在您喜欢的位置,并将其不透明度降低到您喜欢的任何百分比,并获得均匀的结果.没有亮点,事物互相叠加.

这是完成上述所有操作的代码:

var points = [CGPoint]()

   points = [CGPoint(x: -100, y: 100), CGPoint(x: 100, y: -100)]
   let FirstLine = SKShapeNode(points: &points, count: points.count)
   FirstLine.strokeColor = UIColor.init(red: 0.25, green: 0.62, blue: 0.0, alpha: 1)
   FirstLine.lineWidth = 30
//      ^^ Note the FirstLine is not added to the Scene

   points = [CGPoint(x: 100, y: 100), CGPoint(x: -100, y: -100)]
   let SecondLine = SKShapeNode(points: &points, count: points.count)
   SecondLine.strokeColor = UIColor.init(red: 0.25, green: 0.62, blue: 0.0, alpha: 1)
   SecondLine.lineWidth = 30
   FirstLine.addChild(SecondLine)
// ^^ Note SecondLine being added to FirstLine, and that they both have alpha of 1

// Now the magic: use the view of the SKScene to render FirstLine and its child (SecondLine)
// They are rendered into a texture, named, imaginatively, "tex"

   let tex = view.texture(from: FirstLine)
   let cross = SKSpriteNode(texture: tex, color: .clear, size: (tex?.size())!)
       cross.alpha = 0.5

// ^^ The alpha of the above sprite is set to your original desire of 0.5
// And then added to the scene, with the desired result.
   addChild(cross)

这是结果:

enter image description here

网友评论