На OSX, как мне градиентной заливки обводки? - PullRequest
Новая
       17

На OSX, как мне градиентной заливки обводки?

15 голосов
/ 29 апреля 2010

Используя множество функций рисования в Какао или Кварце, довольно легко рисовать контуры и заполнять их, используя градиент. Однако я не могу найти приемлемый способ «обводить» - нарисовать контур с шириной линии в несколько пикселей и заполнить этот обводку с помощью градиента. Как это сделать?

Редактировать: Видимо, вопрос не был достаточно ясным. Спасибо за ответы, но я уже понял это. Что я хочу сделать, это:

квадратов http://emle.nl/forumpics/misc/squares.png

Левый квадрат - это NSGradient, нарисованный в пути, за которым следует сообщение об обводке пути. Право - это то, что я хочу сделать; Я хочу заполнить обводку градиентом.

Ответы [ 3 ]

20 голосов
/ 05 мая 2010

Если вы преобразуете NSBezierPath в CGPath, вы можете использовать метод CGContextReplacePathWithStrokedPath(), чтобы получить контур, который является контуром обведенного пути. Отличный GCDrawKit от Грэма Кокса имеет метод категории -strokedPath на NSBezierPath, который сделает это за вас без необходимости переходить к Core Graphics.

Как только у вас есть обозначенный путь, вы можете заполнить этот путь NSGradient.

14 голосов
/ 29 апреля 2010

Я не могу найти приемлемый способ, однако, чтобы «обводить» - нарисовать путь с шириной линии в несколько пикселей и заполнить этот обводку градиентом. Как это сделать?

[Оригинальный ответ заменен следующим]

Ах, понятно. Вы хотите применить градиент к обводке.

Для этого вы используете режим смешивания. Я объяснил, как это сделать, в ответе на другой вопрос. Вот список шагов, адаптированных к вашей цели:

  1. Начните слой прозрачности .
  2. Обведите путь любым непрозрачным цветом.
  3. Установите режим наложения на источник в .
  4. Нарисуйте градиент.
  5. Завершить слой прозрачности.
8 голосов
/ 21 мая 2016

Согласно ответу Питера Хоси, мне удалось создать простую градиентную кривую, которая выглядит следующим образом:

Gradient Curve Image

Я сделал это в методе drawRect (_ :) класса UIView, написав следующий код: 

override func drawRect(rect: CGRect) {
    let context = UIGraphicsGetCurrentContext()

    CGContextBeginTransparencyLayer (context, nil)
    let path = createCurvePath()
    UIColor.blueColor().setStroke()
    path.stroke()
    CGContextSetBlendMode(context, .SourceIn)

    let colors          = [UIColor.blueColor().CGColor, UIColor.redColor().CGColor]
    let colorSpace      = CGColorSpaceCreateDeviceRGB()
    let colorLocations  :[CGFloat] = [0.0, 1.0]
    let gradient        = CGGradientCreateWithColors(colorSpace, colors, colorLocations)
    let startPoint      = CGPoint(x: 0.0, y: rect.size.height / 2)
    let endPoint        = CGPoint(x: rect.size.width, y: rect.size.height / 2)

    CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, CGGradientDrawingOptions.DrawsBeforeStartLocation)
    CGContextEndTransparencyLayer(context)
}

Функция createCurvePath () возвращает объект UIBezierPath. Я также установил path.lineWidth на 5 баллов.

...