RoundedRectangle

The RoundedRectangle view is a pre-built rectangular shape with rounded corners that is aligned inside the frame of the View containing it.

SwiftUI has several built-in shapes, such as a rectangle, ellipse, and capsule.

Syntax

var body: some View {
    RoundedRectangle(cornerRadius: Int)
        Modifiers here
}

Example

The example below displays a cyan colored rectangle, with rounded corners, with a frame of 200 points wide by 50 points high:

var body: some View {
RoundedRectangle(cornerRadius: 15)
.fill(.cyan)
.frame(width: 200, height: 50)
}

This will display the following:

RoundedRectangle

Contributors

Interested in helping build Docs? Read the Contribution Guide or share your thoughts in this feedback form.

Learn SwiftUI on Codecademy