Concept

The first SwiftUI app I built, as per the SwiftUI course content I had been completing, served as an introduction into the basics of the SwiftUI framework and the Xcode Integrated Development Environment (IDE). This app would feature a basic UI centered around two primary views, simple animations and gesture controls, and a basic custom component to create a 'swipe to unlock' style interactive element.

Solution

The bulk of this app centers on the development of reusable component views which comprise the overall UI. These shape-based views helped to build a familiarity with the basic SwiftUI frameworks, designing layout with ZStack()/VStack()/HStack() components, animations, and transformations.

The UI features a set of basic Circle() shapes which are animated against the foreground character images, and controlled by a SwipeGesture() gesture. Additionally, the same gesture is utilized in controlling the transformation of the slide component, which tracks the distance of the users interaction from it's origin, and transforms the underlying shape to fill the container accordingly. This, paired with an .onEnded{} modifier, allows for the shape to be transformed back to its original state when the user releases the gesture.

The final page design combines these elements to create basic interactivity and simple navigation to and from the second page of the app using a global @Environment variable to track the current view displayed to the user, resulting in persistence between sessions regardless of whether the user has fully closed the app or not.