What you’ll learn in this chapter:
- Working with Images and Buttons in SwiftUI
- Displaying dynamic data in Lists
- Connecting views using NavigationViews
- Stacking views with ZStacks
- Basic data flow concepts in SwiftUI
What we’ll create 🚀
In this chapter, we start our SwiftUI journey with a pretty cool and also functional Food Delivery App. Have a look at the preview images below to see what our app will look like in the end.
Using this app, the user can choose between different categories and order what he wants to eat.
As we create this app we will get more familiar with building interfaces in SwiftUI. We will also learn how to connect different views and transfer data between them.
We start by creating a List that contains the different category Images.
Setting up our project 👷♂️
Let’s start with creating a new project and importing the image files we will need later on. Open Xcode and create a new Xcode project. Then select “App” under the “iOS” tab and click on “Next”. Give your app any name you want and create your project.
Once your app project is initialized, click on the ContentView.swift file in the Project Navigator to open the default ContentView in the editor area.
Before we start creating our Food Delivery App, we first need to import the image files we will need to represent the product categories.
Open the Assets.xcassets file in the Project navigator and drag and drop the image files into it. Make sure that the image files are named correctly.