Make Me Code Again — Day Six

This weekend, we are babysitting the cat, and got interrupted by her constantly — She wants to cuddle with me!

This is how it started…

Today I am learning how to create the “complex interfaces”, which is aptly defined in the following image.

Source: https://developer.apple.com/tutorials/swiftui/composing-complex-interfaces

The core is to create the vertical and horizontal stack with scrolling featured enabled into it.

The best part of this tutorial was to learn how to build a pretty standard UI. And the core of this UI is the “VStack and HStack.” Once you setup the base of your UI, and then you render it multiple times in a for-each-loop. The code creates the following base:

Once your base is setup, then creating the main screen with various rows out of it in your main view:

It was my favorite tutorial. I always have a curiosity about how these types of UI are coded, creating them into Principle for Mac or ProtoPie is easy, drag and drop and done — but doing it in code is kind of like a challenge.

Until next time,

Cheers,

Mudassir
www.mazeemi.com

Resources:

1. Composing Complex Interface — shttps://developer.apple.com/tutorials/swiftui/composing-complex-interfaces