Adam Rush

@Adam9Rush

17 May, 2022

Introduction

In this article, you’re going to use textCase() to make text uppercase.

You’re likely to be working with Strings and Text quite often when building your next iOS application, and making the text uppercase or lowercase is often a typical request.

In this article, you’re going to explore making text uppercase using the textCase() modifier within SwiftUI on various elements.

Using textCase()

SwiftUI provides the textCase() modifier that you can apply to both Text, TextField, Label elements, and more.

Uppercase on Text Elements

You can add the textCase() modifier and supply the type as .uppercase

struct ContentView: View {
    var body: some View {
        Text("Hello, Adam")
            .textCase(.uppercase)
    }
}

You can also supply:

  • .lowercase
  • .none

You might guess what each one does ;]!

Uppercase on a TextField

You can also add the textCase() modifier to a TextField.

struct ContentView: View {    
    @State private var placeholder = "contact@swiftlyrush.com"    
    var body: some View {
        TextField("Email", text: $placeholder)
            .textCase(.uppercase)
            .textInputAutocapitalization(.characters)
    }
}

So in your example, you’re creating a new TextField with some text capitalised and setting the input to auto capitalise.

Uppercase on a Label

You can also add the textCase() modifier to a Label.

struct ContentView: View {
    var body: some View {
        Label("SwiftlyRush", systemImage: "sun.max")
            .textCase(.uppercase)
    }
}

As you can see, it’s simply an easy process to add this functionality!

What Next?

As you can see, making text capitalised is an easy process, and there might be more elements you can apply the textCase() modifier to, can you spot those?

You should keep exploring this, and why not try and make it lowercase or similar.

You can read more about the basics of SwiftUI here.

Sponsor

Subscribe for curated Swift content for free

- weekly delivered.