Рисование неровных линий - PullRequest
Новая
       112

Рисование неровных линий

2 голосов
/ 24 февраля 2020

Я пытаюсь нарисовать «пиксельные» или «векторизованные» линии, которые выглядят следующим образом: enter image description here enter image description here

В идеале я пытаюсь чтобы нарисовать путь через что-то вроде CAShapeLayer и сделать пикселизацию пути к этому стилю. Он не должен выглядеть супер великолепно, как реальный актив, но он должен следовать этому общему стилю. Я перепробовал несколько подходов и довольно близко подошел к результату, находящемуся на правильном пути: enter image description here

Единственная проблема, которую я имею сейчас, - это удаление размытия, примененного к тому, как я пытался сделать это. Мне нужно, чтобы мой результат был пикселированным, но все еще очень четким, это мой самый последний подход, используемый для получения эффекта выше: 

let path = UIBezierPath(roundedRect: bounds, cornerRadius: 20)
let lay = CAShapeLayer()
lay.path = path.cgPath
lay.strokeColor = UIColor.green_bright.cgColor
lay.lineWidth = 5
lay.fillColor = nil
lay.shouldRasterize = true
lay.rasterizationScale = 0.1
layer.addSublayer(lay)

Я также пытался использовать CIF-фильтры, такие как CIPixellate, но не могу понять, как вы можете применить фильтр, подобный этому, для CAShapeLayer или пути любым другим способом.

Есть ли способ очистить этот метод или каким-либо другим способом добиться такого типа эффекта? Все отзывы и идеи приветствуются.

ОБНОВЛЕНИЕ: я пытаюсь использовать фильтры, превращая свой слой в изображение и применяя фильтр CIF, вот как я безуспешно пытаюсь: 

extension CAShapeLayer {
    func apply(_ filter: String) -> UIImage? {
        let context = CIContext(options: nil)
        let renderer = UIGraphicsImageRenderer(size: frame.size)
        if let currentFilter = CIFilter(name: filter) {
            let image = renderer.image { context in
                render(in: context.cgContext)
            }
            let beginImage = CIImage(image: image)
            currentFilter.setValue(beginImage, forKey: kCIInputImageKey)

            if let output = currentFilter.outputImage {
                if let cgimg = context.createCGImage(output, from: output.extent) {
                    return UIImage(cgImage: cgimg)
                }
            }
        }
        return nil
    }
}

1 Ответ

1 голос
/ 24 февраля 2020

Если это то, что вы имеете в виду ...

enter image description here

... тогда я думаю, что ваша идея использовать CIPixellate CIFilter правильно, потому что именно так я получил этот образ. Шаги:

  1. Создайте свою форму, используя слой формы, в основном, как вы уже делаете.

  2. Создайте контекст графического изображения и визуализировать слой формы в него. Теперь вы создали UIImage из слоя формы.

  3. Превратите UIImage в CIImage и пропустите его через фильтр CIPixellate.

  4. Снова создайте контекст графического изображения; оберните UIImage вокруг вывода CIImage из фильтра и нарисуйте его в контексте изображения. Теперь вы визуализировали вывод фильтра как новый пиксельный UIImage.

  5. Отображение полученного UIImage.

...