Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
6
Help us understand the problem. What is going on with this article?
@usagimaru

NSImage に Tint Color を適用する機能を拡張する

More than 3 years have passed since last update.

OS X の Assets にもレンダリングモードがあり、iOS のように画像そのものの色を使うか Tint Color をマスクするかを指定できますが、仮に Template としたところで Tint Color を指定する方法が見つかりませんでした。Cocoa Touch には UIImageRenderingMode がありますが Cocoa の NSImage には template というプロパティがあるのみなのでこの辺りが異なるようです。

  • 基本的に自由に設定できる Tint Color の仕組みがない
  • UIImageRenderingMode に相当する enum ではなく、template プロパティで判定する
  • Template 描画される色はセルによって決められる模様


Assets では Template Image にできる

セルが決めた色ではなく iOS の Tint Color 的に好きな色で描画したいので、そのように NSImage を拡張してみます。

NSImage
import Cocoa

extension NSImage {
    func imageWithTintColor(tintColor: NSColor) -> NSImage {
        if self.template == false {
            return self
        }

        let image = self.copy() as! NSImage
        image.lockFocus()

        tintColor.set()
        NSRectFillUsingOperation(NSMakeRect(0, 0, image.size.width, image.size.height), NSCompositingOperation.CompositeSourceAtop)

        image.unlockFocus()
        image.template = false

        return image
    }
}
Sample
let tintColor = NSColor(red: 1.0, green: 0.08, blue: 0.50, alpha: 1.0)
let image = NSImage(named: "NAME").imageWithTintColor(tintColor)
imageView.image = image

元々青い色のアイコンに Tint Color を適用した結果がこれになります。

6
Help us understand the problem. What is going on with this article?
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
usagimaru
ソフトウェアデザイナー macOS / iOSデベロッパー
goodpatch
Goodpatch(株式会社グッドパッチ)はUI/UXデザインを強みにビジネスモデルやブランド、組織をデザインし、デザインの価値向上を目指すグローバルデザインカンパニーです。2020年6月30日、デザイン会社初の東証マザーズ上場。サービスやプロダクトの企画設計から関わりコンセプトメイキング、UX設計、プロトタイピング、UIデザイン、実装までワンストップで提供しています。

Comments

No comments
Sign up for free and join this conversation.
Sign Up
If you already have a Qiita account Login
6
Help us understand the problem. What is going on with this article?