Sahand Nayebaziz on May 19, 2021

Wondering what SwiftUI is? Or how DetailsPro works? Here is an article that will hopefully answer a lot of your questions. I’ve made a list of every SwiftUI design element that DetailsPro offers.

Check out screenshots and short descriptions for the design elements you can mix, match, and stack to make almost any design you’ve ever seen on iOS. Many designs, from the iOS 14 Lock Screen to widgets and Apple Music are all made with combinations of these simple elements.

Let’s start with the coolest elements in SwiftUI… stacks.

Vertical Stack

Vertical Stacks let you put any SwiftUI elements above and below each other.

Horizontal Stack

Horizontal Stacks let you put any SwiftUI elements next to each other.

Layered Stack

Layered Stacks (also known as “ZStacks”) let you put any SwiftUI elements on top of and under each other.

Spacer

Spacers work by taking up extra space in Horizontal or Vertical Stacks, here shown dramatically pushing the text and image to opposite corners of the screen. You can even use multiple spacers to evenly take up space in a stack.

Text

Simply text, editable with fonts, colors, tracking, leading, and more.

Image

Simply images, with content modes like fit and fill for specific presentations in another design element.

SF Symbol

SF Symbols, the same ones made by Apple, editable to match a certain font, font weight, and color.

Rectangle

Simply rectangles, editable with colors, shadows, and more.

Circle

Simply circles, editable with colors, shadows, and more.

Rounded Rectangle

Just like rectangles, but able to have circular or smooth Apple-squircle corners.

Capsule

Just like rounded rectangles, but always sets to have perfectly pill-shaped corner radius.

Divider

A subtle, thin line that makes a great divider in Horizontal and Vertical stacks.

Scrolling Container

Scrolling Containers let you have elements scroll either vertically or horizontally.

Blur

Blurs are the same standard blurs you see throughout iOS and can be edited to be stronger or weaker blurs.

Gradient

Simply gradients, editable with any number of colors and any gradient direction.

And more to come…

I made DetailsPro to make designing beautiful interfaces more accessible to more people around the world. Apple’s framework, SwiftUI, is an intuitive, simple, and powerful framework. With the right access, including the ability to create designs without knowing how to code, I believe more people can create truly beautiful and intelligent designs at work, on personal projects, and as they learn in schools.

DetailsPro
© Fun Focus Software LLC
SwiftUI is a trademark of Apple Inc., registered in the U.S. and other countries.