2010-04-29 4 views
15

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

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

squares http://emle.nl/forumpics/misc/squares.png

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

ответ

20

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

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

+0

Замечательно!Спасибо :) Спасибо за ссылку на drawkit тоже, это выглядит очень красиво. – Emiel

+0

У меня были проблемы с выполнением этой работы: мой градиент заполнил всю обрезанную область, а не путь (возможно, это связано с тем, чтобы делать обрезку). Я закончил рисовать одну форму, которая была просто контуром границы, обрезанием до этого пути, а затем с использованием градиентной заливки, и это сработало лучше всего. – GoldenBoy

13

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

[Подлинный ответ заменен на следующий]

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

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

  1. Начинает transparency layer.
  2. Проведите путь с любым непрозрачным цветом.
  3. Set the blend mode до source in.
  4. Нарисуйте градиент.
  5. Завершить слой прозрачности.
+0

Спасибо за ответ. Это, однако, не то, что я пытаюсь достичь. Я немного уточнил этот вопрос. – Emiel

+0

Emiel: Ах, я вижу. Я заменил предыдущее содержание моего ответа новым ответом. –

8

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

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 баллов.

+0

Знаете ли вы, что можно сделать путь синим в начале и красным в конце, но f.e. согнуть кривую назад туда, где она началась? – Georg

Смежные вопросы