Как изменить правило заливки SKShapeNode при заливке цветом

Я использую SKShapeNode для создания элемента представления, который используется в моей игре. Он должен быть похож на следующий рисунок, только с двумя видимыми кривыми и цветом заливки внутри.

введите здесь описание изображения

Вот мой код:

    override func sceneDidLoad() {

        let shapeNode = SKShapeNode()
        shapeNode.fillColor = .red
        shapeNode.strokeColor = .white
        shapeNode.lineWidth = 5

        let path = CGMutablePath()
        let radius:CGFloat = 250
        path.addArc(center: CGPoint(x:0, y:300), radius: radius, startAngle: CGFloat.pi*7/6, endAngle: CGFloat.pi*11/6, clockwise: false)
        path.addArc(center: CGPoint(x:0, y:-300), radius: radius, startAngle: CGFloat.pi*1/6, endAngle: CGFloat.pi*5/6, clockwise: false)

        shapeNode.path = path

        self.addChild(shapeNode)
    }

Но у меня есть дополнительная прямая линия с правой стороны, которая мне не нужна.

введите здесь описание изображения

Поэтому я попытался перейти к другой дуге напрямую

        path.addArc(center: CGPoint(x:0, y:300), radius: radius, startAngle: CGFloat.pi*7/6, endAngle: CGFloat.pi*11/6, clockwise: false)
        path.move(to: CGPoint(x:cos(CGFloat.pi/6)*radius, y: -300+sin(CGFloat.pi/6)*radius))
        path.addArc(center: CGPoint(x:0, y:-300), radius: radius, startAngle: CGFloat.pi*1/6, endAngle: CGFloat.pi*5/6, clockwise: false)

У меня есть что-то вроде этого, чего я тоже не хочу.

введите здесь описание изображения

Я узнал, что могу изменить правило заполнения CAShapeLayer с помощью CGPathFillRule после проверки документов Apple, но я понятия не имею, как подключить SKShapeNode и CGPathFillRule.

Любая идея об этом?


person Burro    schedule 14.02.2020    source источник


Ответы (1)


Я не думаю, что правило заполнения здесь что-то исправит. Вам нужен способ отделить части границы, которые вы хотите обвести. Проще всего, вероятно, создать два узла формы, один из которых выполнен, как в первом случае, и заполнен, а второй - как во втором случае и обведен.

person bg2b    schedule 14.02.2020
comment
Вероятно, потребуется 3, по одному для верхней дуги, нижней дуги и заливки. - person Knight0fDragon; 14.02.2020
comment
@Knight0fDragon Основываясь на их нижнем изображении, я понял, что moveTo работает, чтобы сделать два отдельных штриха для верхней и нижней дуг. - person bg2b; 14.02.2020
comment
Нет, это потому, что путь не закрыт. Его ход идет на x радиуса 1*, так что это должна быть правая сторона. - person Knight0fDragon; 14.02.2020
comment
Неважно, я ошибся в строках (мобильный телефон не дружественен), он прыгает, не завершая линию, но завершает путь сверху слева направо вверх... что тогда дает мне представление - person Knight0fDragon; 14.02.2020
comment
Два узла формы работают нормально, есть ли более эффективный способ? если нет, я приму этот ответ. - person Burro; 15.02.2020
comment
Единственное, что я могу придумать, может быть немного более эффективным (после настройки) — это создать узел с двумя узлами формы в качестве дочерних элементов, визуализировать его в текстуру с использованием метода представления texture(from:), а затем создать обычный узел спрайта. из этой текстуры. - person bg2b; 15.02.2020