How to Rotate Text in SwiftUI?

SwiftUI Text – Rotate

To rotate text in Text view, call rotationEffect() method on this Text view, and provide the amount of rotation in degrees or radians.

Example

In the following example, we have a Text view and we will rotate the Text by 90 degrees.

ContentView.swift

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("Hello World!")
            .font(.title)
            .rotationEffect(.degrees(90))
    }
}

Screenshot

The rotation happens in clockwise direction.

Rotate by 180 degrees

ContentView.swift

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("Hello World!")
            .font(.title)
            .rotationEffect(.degrees(180))
    }
}

Screenshot

Rotate by 180 degrees

ContentView.swift

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("Hello World!")
            .font(.title)
            .rotationEffect(.degrees(45))
    }
}

Screenshot

Rotate by 180 degrees

ContentView.swift

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("Hello World!")
            .font(.title)
            .rotationEffect(.degrees(45))
    }
}

Rotate by PI radians

We can also give angle in radians. In the following example, we will rotate the text by PI radians.

ContentView.swift

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("Hello World!")
            .font(.title)
            .rotationEffect(.radians(.pi))
    }
}

Screenshot

Summary

Summarising this SwiftUI Tutorial, we learned how to rotate text in Text view.