๐ŸŽ iOS & Swift

Image Rendering Mode (Original Image vs Template Image)

taeeekki 2022. 7. 12. 11:29

tintColor

UIImageView - Instance Property
๋ทฐ ๊ณ„์ธต์—์„œ ํ…œํ”Œ๋ฆฟ ์ด๋ฏธ์ง€์— ์ƒ‰์กฐ๋ฅผ ์ง€์ •ํ•˜๋Š”๋ฐ ์‚ฌ์šฉ๋˜๋Š” ์ปฌ๋Ÿฌ์ž…๋‹ˆ๋‹ค.

var tintColor: UIColor! { get set }

default๋Š” nil์ž…๋‹ˆ๋‹ค. ๋งŒ์•ฝ nil์ด ์•„๋‹ˆ๋ผ๋ฉด ์ปฌ๋Ÿฌ๋Š” ์ด๋ฏธ์ง€ ๋ทฐ์— ์ฒจ๋ถ€๋œ ํ…œํ”Œ๋ฆฟ ์ด๋ฏธ์ง€์— ์ ์šฉ๋ฉ๋‹ˆ๋‹ค. ๊ธฐ๋ณธ์ ์œผ๋กœ tintColor๋Š” UIView๊ฐ€ ๊ฐ€์ง€๊ณ  ์žˆ๋Š” ํ”„๋กœํผํ‹ฐ์ž…๋‹ˆ๋‹ค. ์ƒ์œ„๊ฐ€ ๋˜๋Š” ๋ทฐ์˜ tintColor๋ฅผ ๋ณ€๊ฒฝํ•˜๋ฉด ์ƒ์†๋ฐ›๋Š” ํ•˜์œ„ ๋ทฐ์— ์ฐจ๋ก€๋Œ€๋กœ ์˜ํ–ฅ์„ ์ค„ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

override func viewDidLoad() {
    view.tintColor = UIColor.red
}
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
    // Override point for customization after application launch.
    window?.tintColor = UIColor.red

    return true
}

UIImage.RenderingMode

์ด๋ฏธ์ง€์— ๋Œ€ํ•ด ๊ฐ€๋Šฅํ•œ ๋ Œ๋”๋ง ๋ชจ๋“œ๋ฅผ ์ง€์ •ํ•˜๋Š” ์ƒ์ˆ˜์ž…๋‹ˆ๋‹ค.

  • Enumeration (์—ด๊ฑฐํ˜•)
enum RenderingMode : Int, @unchecked Sendable

๋ Œ๋”๋ง ๋ชจ๋“œ๋Š” UIKit์ด ์ƒ‰์ƒ ์ •๋ณด๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์ด๋ฏธ์ง€๋ฅผ ํ‘œ์‹œํ•˜๋Š” ๋ฐฉ๋ฒ•์„ ์ œ์–ดํ•ฉ๋‹ˆ๋‹ค. ๋ Œ๋”๋ง ๋ชจ๋“œ์˜ ๋””ํดํŠธ๋Š” automatic์ž…๋‹ˆ๋‹ค.


Original Image

case alwaysOriginal
let image = UIImage(named: "")?.withRenderingMode(.alwaysOriginal)
  • ํ•ญ์ƒ ์›๋ณธ ์ด๋ฏธ์ง€๋ฅผ ๊ทธ๋Œ€๋กœ ์‚ฌ์šฉํ•ด์„œ ๊ทธ๋ฆฝ๋‹ˆ๋‹ค. (์›๋ณธ ์ƒ‰์ƒ์„ ์‚ฌ์šฉํ•ฉ๋‹ˆ๋‹ค.)

Template Image

case alwaysTemplate
let image = UIImage(named: "")?.withRenderingMode(.alwaysTemplate)
  • ์ด๋ฏธ์ง€์˜ ์ƒ‰์ƒ ์ •๋ณด๋ฅผ ๋ฌด์‹œํ•˜๊ณ  ํ…œํ”Œ๋ฆฟ ์ด๋ฏธ์ง€๋กœ ๊ทธ๋ฆฝ๋‹ˆ๋‹ค.
  • ์›๋ณธ ์ด๋ฏธ์ง€๊ฐ€ ๊ฐ€์ง€๊ณ  ์žˆ๋Š” ์ปฌ๋Ÿฌ์ •๋ณด๋Š” ๋ฌด์‹œํ•˜๊ณ  ์ง€์ •ํ•œ tintColor๋กœ ์ƒ‰์ƒ์ด ์ ์šฉ๋ฉ๋‹ˆ๋‹ค.
  • tintColor๊ฐ€ ์ ์šฉ๋˜๋Š” ๋ถ€๋ถ„์€ ์ด๋ฏธ์ง€์˜ ๋ถˆํˆฌ๋ช…ํ•œ ๋ถ€๋ถ„์ž…๋‹ˆ๋‹ค.

Asset Catalog์—์„œ Rendering Mode๋ฅผ ์ง์ ‘ ๋ณ€๊ฒฝํ•˜๋Š” ๋ฐฉ๋ฒ•

Render As ์„ค์ • ๋ฐฉ๋ฒ•


์ •๋ฆฌ

์ด๋ฏธ์ง€์˜ ์ƒ‰์ƒ์„ ์ž„์˜์˜ ๊ฐ’์œผ๋กœ ๋ณ€๊ฒฝํ•˜๊ณ  ์‹ถ๋‹ค๋ฉด Rendering Mode๋ฅผ .alwaysTemplate์œผ๋กœ ๋ณ€๊ฒฝํ•˜๊ณ  tintColor๋ฅผ ์กฐ์ •ํ•˜๋ฉด ๋ฉ๋‹ˆ๋‹ค. ๋˜๋Š” ๊ทธ ๋ฐ˜๋Œ€๋กœ ์ด๋ฏธ์ง€๋ฅผ ์›๋ณธ์œผ๋กœ ์‚ฌ์šฉํ•˜๊ณ  ์‹ถ์€๋ฐ tintColor๊ฐ€ ์ ์šฉ๋œ ์ฑ„๋กœ ๋‚˜์˜จ๋‹ค๋ฉด .alwaysOriginal๋กœ ์„ค์ •ํ•ด์ฃผ๋ฉด ๋ฉ๋‹ˆ๋‹ค.