Быстро смешать 2 вида с пользовательским цветом? - PullRequest
Новая
       56

Быстро смешать 2 вида с пользовательским цветом?

1 голос
/ 07 августа 2020

В моем случае мне нужно что-то вроде этого (зеленая фигура анимирована): введите описание изображения здесь

Картинка создается с помощью PaintCode. Для реализации этого я использовал 3 объекта: 1) метка с серым цветом текста, смешивание - «Разница» 2) произвольная форма с закругленными углами зеленого цвета 3) метка - такая же, как 1, но с другими параметрами смешивания и цвета - белый цвет , смешивание - "Overlay"

Код, созданный PaintCode: 

//// General Declarations
let context = UIGraphicsGetCurrentContext()!

//// Color Declarations
let color2 = UIColor(red: 0.388, green: 0.714, blue: 0.557, alpha: 1.000)
let color3 = UIColor(red: 0.733, green: 0.733, blue: 0.733, alpha: 1.000)

//// Text Drawing
context.saveGState()
context.setBlendMode(.difference)

let textRect = CGRect(x: 49, y: 30, width: 108, height: 21)
let textTextContent = "Hello, World!"
let textStyle = NSMutableParagraphStyle()
textStyle.alignment = .left
let textFontAttributes = [
    .font: UIFont.systemFont(ofSize: UIFont.labelFontSize),
    .foregroundColor: color3,
    .paragraphStyle: textStyle,
] as [NSAttributedString.Key: Any]

let textTextHeight: CGFloat = textTextContent.boundingRect(with: CGSize(width: textRect.width, height: CGFloat.infinity), options: .usesLineFragmentOrigin, attributes: textFontAttributes, context: nil).height
context.saveGState()
context.clip(to: textRect)
textTextContent.draw(in: CGRect(x: textRect.minX, y: textRect.minY + (textRect.height - textTextHeight) / 2, width: textRect.width, height: textTextHeight), withAttributes: textFontAttributes)
context.restoreGState()

context.restoreGState()


//// Rectangle Drawing
let rectanglePath = UIBezierPath(roundedRect: CGRect(x: 64, y: 30, width: 57, height: 47), byRoundingCorners: [.topLeft, .topRight], cornerRadii: CGSize(width: 20, height: 20))
rectanglePath.close()
color2.setFill()
rectanglePath.fill()


//// Text 3 Drawing
context.saveGState()
context.setBlendMode(.overlay)

let text3Rect = CGRect(x: 49, y: 30, width: 108, height: 21)
let text3TextContent = "Hello, World!"
let text3Style = NSMutableParagraphStyle()
text3Style.alignment = .left
let text3FontAttributes = [
    .font: UIFont.systemFont(ofSize: UIFont.labelFontSize),
    .foregroundColor: UIColor.white,
    .paragraphStyle: text3Style,
] as [NSAttributedString.Key: Any]

let text3TextHeight: CGFloat = text3TextContent.boundingRect(with: CGSize(width: text3Rect.width, height: CGFloat.infinity), options: .usesLineFragmentOrigin, attributes: text3FontAttributes, context: nil).height
context.saveGState()
context.clip(to: text3Rect)
text3TextContent.draw(in: CGRect(x: text3Rect.minX, y: text3Rect.minY + (text3Rect.height - text3TextHeight) / 2, width: text3Rect.width, height: text3TextHeight), withAttributes: text3FontAttributes)
context.restoreGState()

context.restoreGState()

Проблема в том, что я не знаю, как смешать, чтобы заполнить пересечение точным цветом, который мне нужен. Ярлык результата имеет цвета, которые слишком отличаются от тех, которые мне нужно получить (серый цвет слишком темный, «белый» цвет ~ (240, 255, 255) вместо (255, 255, 255)).

Как решить эту проблему? Решение может не зависеть от указанного мной кода.

1 Ответ

3 голосов
/ 07 августа 2020

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

...