Skip to content

SwiftUI: Circle

Traditionally, you will create a UIView and do some calculation to create a Circle. With SwiftUI, you can create a Circle easily without doing any calculation which will save you tons of time in developing your project.

You should be seeing the pattern here where SwiftUI does all the minor work for you.

A circle centered on the frame of the view containing it. 

Apple Documentation

In this tutorial, you’ll learn what it takes to build a Circle in SwiftUI. You’ll learn:

  • How to build a Circle from scratch.


To follow along this tutorial, you’ll need some basic knowledge in:

  • A basic familiarity with Swift.
  • At least Xcode 11


To create a Circle, simply call the following code:

If the circle is too big, you can adjust the size accordingly.

Changing the color can done easily too.

Outline color can be done as well.

Adding an image on the circle is also possible.

You can even stack the circle on each other with ZStack.

Where to go From Here

If you feel like you are ready to take on more challenges, feel free to check out some other tutorials that we have created:

Published inSwiftUI

Be First to Comment

Leave a Reply

Your email address will not be published. Required fields are marked *