UPGRADE YOUR SKILLS: Learn advanced Swift and SwiftUI on Hacking with Swift+! >>

SOLVED: Using custom colors in a Gradient

Forums > SwiftUI
@flaneur7508  

Hello,

Today I’m playing with Gradient and custom colors. I can’t seem to figure out the syntax to use a custom color and a Gradient tho.

I’ve created 3 custom colors in my assets. botBlue, botGreen, botOrange, botPurple, and I’ve tried to use them in the examples below, all of which do not compile.

.background(LinearGradient(gradient: Gradient(colors: [Color(mobColors.botBlue), Color.green]), startPoint: .top, endPoint: .bottom))

…

.background(LinearGradient(gradient: Gradient(colors: [Color(botBlue), Color.green]), startPoint: .top, endPoint: .bottom))

…

.background(LinearGradient(gradient: Gradient(colors: [Color(.botBlue), Color.green]), startPoint: .top, endPoint: .bottom))

I’ve also tried to create a static var and then use the variable name in a Gradient, as follows, but no joy. 

struct mobColors {
    static let botifyPurple = Color("botPurple")
    static let botifyBlue = Color("botBlue")
    static let botifyGreen = Color("botGreen")
    static let botifyOrange = Color("botOrange")
}

If anyone can advise how I can use custom colors in a Gradient, that would be much appriciated.

Tnank you!

2      

@Sergey  

Try like this: .background(LinearGradient(colors: [.botBlue, .green], startPoint: .top, endPoint: .bottom))

2      

@NigelGee  HWS+

You can put them in to an extension on Color EG

extension Color {
    static let botifyPurple = Color("botPurple")
    static let botifyBlue = Color("botBlue")
    static let botifyGreen = Color("botGreen")
    static let botifyOrange = Color("botOrange")
}

Then you can use it as a normal color

LinearGradient(colors: [.botifyOrange, .green], startPoint: .top, endPoint: .bottom)

To use @Sergey suggestion you have to add the struct name first

LinearGradient(colors: [MobColor.botifyOrange, .green], startPoint: .top, endPoint: .bottom)

Or use Color("botOrange")

LinearGradient(colors: [Color("botOrange"), .green], startPoint: .top, endPoint: .bottom)

My choice is to use the first as less likely for typos and will be on the auto complete so you can use anywhere

PS you should use caps form struct names EG MobColor not mobColors

2      

@flaneur7508  

Thank you! and thanks for the Struct tip. I just use camel case all the time. Will revise.

2      

@deirdresm  HWS+

A few other tricks for you.

  1. You can define them in an enum. In my case, these matched Asset colors (which had both a light and dark variant).
  2. If you make the enum conform to CaseIterable, you can do .allCases.
  3. You can add previews for enums! And look at how they look in light and dark modes.

https://gist.github.com/deirdresm/8c5e5a450de53ca0569017a17d4ef5f7

I'll probably crib together a small standalone example with a README, but there are a lot of tricks in here. (Some I'd do differently now that I've been working in SwiftUI for a couple of years; this is a couple of years old.)

Screencap of the preview output is below the code.

3      

TAKE YOUR SKILLS TO THE NEXT LEVEL If you like Hacking with Swift, you'll love Hacking with Swift+ – it's my premium service where you can learn advanced Swift and SwiftUI, functional programming, algorithms, and more. Plus it comes with stacks of benefits, including monthly live streams, downloadable projects, a 20% discount on all books, and free gifts!

Find out more

Sponsor Hacking with Swift and reach the world's largest Swift community!

Archived topic

This topic has been closed due to inactivity, so you can't reply. Please create a new topic if you need to.

All interactions here are governed by our code of conduct.

Swift breaks down barriers between ideas and apps, and I want to break down barriers to learning it. I’m proud to make hundreds of tutorials that are free to access, and I’ll keep doing that whatever happens. But if that’s a mission that resonates with you, please support it by becoming a HWS+ member. It’ll bring you lots of benefits personally, but it also means you’ll directly help people all over the world to learn Swift by freeing me up to share more of my knowledge, passion, and experience for free! Become Hacking with Swift+ member.
Click here to visit the Hacking with Swift store >>
 
Unknown user

You are not logged in

Log in or create account
 

Link copied to your pasteboard.