Can I use color literals in SwiftUI
Asked Answered
D

7

17

I want to use my color assets from the assets catalog using color literals. In UIKit, we can directly use color literal is there any way to use color literals in SwiftUI

I have searched from Color initializer with UIColor parameter but none found

Debra answered 1/8, 2019 at 10:46 Comment(0)
S
13

Note: From Xcode 11 Beta 5, Color has an initializer for this already and no need to implement it.

So you can use colorLiteral like this:

Color(#colorLiteral(red: 1, green: 0, blue: 0, alpha: 1))

preview

Or any other CGColor, UIColor (or NSColor for macOS):

Color(.red)
Shick answered 1/8, 2019 at 11:25 Comment(1)
Thanks for sharing i end up using named colorsDebra
P
17

Easy Drag and Drop Color for Xcode Swift UI

I find it helpful when designing layouts where I need to find and adjust a color quickly to use this method.

I do this whenever I want to use the drag and drop style color literals in SwiftUI.

Later, I can go back and add the hard coded color to my color scheme simply by commenting out "//" the color literal line in my code which reveals the RGB for my selected color.

Using Easy Drag and Drop Color Literals with Xcode, Swift, SwiftUI


  • Sorry I couldn't find any other way to describe this answer except for posting it this format *

Hope that helps.


UPDATE: As of Xcode 13.2.1

Quite possibly it came out earlier but I didn’t catch it.

To get the autocomplete to work, type this line into your code.

#colorLiteral()

Then the code will automatically place the literal in the code for you to make the selection.


Painting answered 14/6, 2020 at 15:17 Comment(2)
Better than everything.Elisavetgrad
I have the same issue on Xcode 14.1(14B47b) The workaround on the "Updated" section helped. ThanksOogenesis
S
13

Note: From Xcode 11 Beta 5, Color has an initializer for this already and no need to implement it.

So you can use colorLiteral like this:

Color(#colorLiteral(red: 1, green: 0, blue: 0, alpha: 1))

preview

Or any other CGColor, UIColor (or NSColor for macOS):

Color(.red)
Shick answered 1/8, 2019 at 11:25 Comment(1)
Thanks for sharing i end up using named colorsDebra
E
10

You can use a Color defined in Asset Catalog by passing the string name inside the init.

So, if I have the "Background" color inside my Assets.xcassets:

enter image description here

I will use:

let backgroundColor = Color("Background")

Alternatively if the color is defined in another Bundle you can use:

Color(name: String, bundle: Bundle)

P.S. It's seem that Color Literals doesn't work with the Asset color's

Eboni answered 1/8, 2019 at 11:14 Comment(0)
E
3

You actually can use this hidden protocol to afford the same use of color literals for Color as is available for UIColor:

extension Color: _ExpressibleByColorLiteral {
    public init(_colorLiteralRed red: Float, green: Float, blue: Float, alpha: Float) {
        self = Color(.sRGB, red: Double(red), green: Double(green), blue: Double(blue), opacity: Double(alpha))
    }
}

Now you can use color literals for Color parameters.

Ecclesiastes answered 24/12, 2019 at 4:26 Comment(0)
A
2

Yes, SwiftUI has color literal. The color literal is a parameter of the color struct. Use the following steps:
1. Type the word, Colo
2. Select Color literal from autocomplete
3. Now you can click on the color literal and select a colorenter image description here

Abscise answered 1/5, 2020 at 2:59 Comment(0)
S
1

In Xcode 13.4 to use Color Literal: Start typing: let myColor = Color(#colorLiteral(

and an icon will appear. Double click on the icon and the color selection box will appear. After selecting the color be sure to use a closing parentheses after the color.

Scutellation answered 2/7, 2022 at 22:58 Comment(0)
U
-1

You can use the getRed() method of UIColor to get the red, green, blue and alpha components and then use them to create a Color object. You could even create an extension that did it for you.

Unmade answered 1/8, 2019 at 11:18 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.