Modifying Views

Heads up... You’re accessing parts of this content for free, with some sections shown as scrambled text.

Heads up... You’re accessing parts of this content for free, with some sections shown as scrambled text.

Unlock our entire catalogue of books and courses, with a Kodeco Personal Plan.

Unlock now

Every view comes with a series of modifiers that allow you to customize your view. Each modifier is custom to the view although some views share similar modifiers such as padding. These modifiers can provide accessibility features, add styles, provides actions, and even present other views.

Modifiers are added to a view way of a period. For example:

struct ContentView: View {
  var body: some View {
    Text("Hello, world!")
      .padding()
  }
}

This adds ten points of padding all around the Text. Notice that the modifier is placed on its own line. This arrangement makes it clear to anyone who reads the code.

Modifiers also stack on top of each other. For example:

    Text("Hello, world!")
      .padding()
      .border(Color.purple)

The modifiers are processed in order. In this case, padding is placed around the Text followed by a border. Changing the order may change how the element looks on the screen. Often times, if something looks strange on screen, you may need to evaluate the order in which you are modifiers are being applied.

See forum comments
Download course materials from Github
Previous: Introduction Next: Demo: Modifying Views