Animating images with the stroke modifier

In the following sections, we will be working in Xcode and refactoring the “WE” code somewhat in order to make it work in our project. We will use the Shape protocol that lets us draw a 2D shape using its path() function, and then use the stroke modifier to add a moving line around the path of our shapes. We will also get started on animating our heart and SwiftUI logo images.

Creating a stroke animation on the “WE” image

To start animating the “WE” image, we need to create a file inside the project. Press Command + N, choose a SwiftUI View file type, and name it – I’m calling it WeView.

Then, create a struct at the bottom of the file; this will be the struct that conforms to the shape protocol, allowing us to create 2D shapes by using the path function:

struct WeTextShape: Shape {
    func path(in rect: CGRect) -> Path {
    }
}

...