Today I will show you how to use Circle.

Steps:

• Draw a Circle. Its fill color is black by default.

Circle()

• Fill the Circle with blue by calling the fill method.

• Then adjust the width and height of the Circle.

Circle()
    .fill(.blue)
    .frame(width: 200, height: 200)

• Try different layouts.

• Add a ZStack as a container for subviews.

• Draw a Circle. Set the fill color to blue.

• Draw another Circle. Set the fill color to yellow and reduce the size to 0.8 times the original size.

• Draw the last Circle. Set the fill color to red and reduce the size to 0.6 times the original size.

ZStack {
    Circle()
        .fill(.blue)
    Circle()
        .fill(.yellow)
        .scaleEffect(0.8)
    Circle()
        .fill(.red)
        .scaleEffect(0.6)
}

Follow me on:

(Foks) Hui Wang's LinkedIn