Learn Courses My Dashboard

How to set a custom background color to a Hstack?


I am new to iOS development. I love Chris, I think he is the best.

I am now trying to set a custom background color to a Hstack, with this :slight_smile:
.background(Color(red: 73, green: 191, blue: 229))

and it doesn not work.

I am already confused at this point. Should I use the background method or the backgroundStyle. If I try with .background and then I type color in the parameters I see a long list of 30 COLOR things: Methods? Instances? Values , I have no clue what they are. Which one pertain to SwitfUI…

The bigger issue is for me to understand how to peruse the documentation to achieve my coding goals.

Chris please do a “How to use the iOS documentation” video.

I have been spending 1 hour to set a custom background color to a vstack, that is crazy!

Thank you for pointers guys but what I really need is to understand how to use the documentation.

  • Screen Shot 2022-10-10 at 20.47.43


Welcome to the community.

What is the code you currently have in your View? We may be able to point you in the right direction if you paste your code in a reply.

Paste your code in as text, rather than providing a screenshot.

To format the code nicely, place 3 back-ticks ``` on the line above your code and 3 back-ticks ``` on the line below your code. Like this:

Code goes here

The 3 back-ticks must be the ONLY characters on the line. The back-tick character is located on the same keyboard key as the tilde character ~ (which is located below the Esc key - QWERTY keyboard).

Alternatively after you paste in your code, select that code block and click the </> button on the toolbar. This does the same thing as manually typing the 3 back ticks on the line above and below your code.

This also makes it easier for anyone assisting as they can copy the code and carry out some testing.

Hi Chris,

This is the code

Text(“Textfield”).padding([.top, .bottom,.trailing], rightmargin)
.background(Color(red: 73, green: 191, blue: 229))



When you specify a color, each of the 3 components need to be in the form of a Double from 0 to 1, so the values are a decimal.

You are on the right track with the rest of your code but change your background as per the following:

HStack {
    Text("Textfield").padding([.top, .bottom,.trailing])
.background(Color(red: 73/255, green: 191/255, blue: 229/255))

Setting padding(0) is effectively no padding at all.

Where you had:

Text(“Textfield”).padding([.top, .bottom,.trailing], rightmargin)

Was rightmargin a variable with a value?

Thanks a lot Chris, I would have expected an error from the compiler…

Please suggest to the other Chris to do a video on how to use the doc, the doc is a monster. Chris could tie what he teaches about struct, properties, … to how the doc is organized, etc

Yes rightmargin is a var, I can then adjust the layout more easily, I will also have a var for the color to make it easier to read.

Submit video ideas here!

Hello @Torriep I changed the title of your post so that when other search for a similar issue, they can also check this post, it may help also other students find the solution for their problem. I hope you don’t mind. :slight_smile:

Welcome to the community bro!

:slight_smile: makes sense

The compiler does not check that the value entered is in the range 0.0 to 1.0. It’s up to the user to specify sensible color values either directly of using calculations. I was aware that the values you were entering were related to a value between 0 and 255 and that’s why I divided each by 255 so that you ended up with the color you expected.

I need to read the doc more, every little detail matters…

1 Like

It’s something that you will get used to over time and remember what to do pretty much automatically through experience.

The vast majority of Apple documentation is difficult to read let alone understand. That’s why we are fortunate to have people like Chris Ching, Paul Hudson, Sean Allen, Mark Moeykens, Stewart Lynch and many others to interpret and present their take on the frameworks and methods in a way that they are easier to understand.

Apple also have a lot of tutorials available via the WWDC.App where there are lots of code examples.

1 Like