The person who produces these tutorials seems to have inside connections at Apple because his tutorials came out, it seemed like, seconds after Swiftui was announced last spring. The Hacking tutorials have lots of useful information and are one of the better resources I have found at this point as a reference. For now, I recommend that you skip the first two sections and begin with the Text and Images section.
Section 1: Text and Images
Visit this link and skip down to the Text and Images section. Go through each of those exercises. The text tutorials are pretty straightforward and should not present a problem. The image tutorials explain how to work with images, but he expects you to provide your own images. So find an image and bring it into assets.xcassets for this portion.
Section 2: Responding to events
I also recommend that you skip over the View Layout section and skip down to the Responding to events section. Feel free to simply copy and paste code to experiment. Please be sure to read and follow my instructions for several of the lessons. I worked hard to improve on the author’s very basic lessons by adding in some (hopefully) interesting challenges.
- Spend some time on the Tappable button lesson. Add a new text field and see if you can figure out how to change its content when the button is clicked. The author shows how to use a boolean and a conditional statement to change text. You will need to add an additional action to the button and an additional @State private var to the struct to accomplish this task.
- Add an image as the background of your button. When I added images, all I got was a blue box. The image was not visible. Maybe you will have better luck. Let me know if you do!
- I skipped the lesson on How to disable the overlay color for images inside Button and NavigationLink. You are welcome to as well!
- In the lesson How to read text from a textfield, use
.multilineTextAlignment(.center) to center the text field.
- For the slider lesson, create a rectangle and set its width and height to the celsius value that the lesson uses to display both celsius and Fahrenheit values, similar to the slider lesson we did earlier in the semester. Hint: The big trick is to change the type of the $celsius variable to CGFloat as in
@State private var celsius: CGFloat = 0 because the width and height of rectangles is based on CGFloat instead of double. The slider is happy either way!
- Take the picker lesson to a much cooler place by adding a rectangle and setting its background color to match the colors that output to the textbox. The screen capture below should offer some help. BTW, Tartan is not a color so I substituted yellow. Refer back to this lesson if you don’t remember how to make a rectangle.
- Let’s have some fun with the segmented control lesson. Download sheep.zip and drag the three adorable sheep pictures into assets.xcassets. Now figure out how to use the segmented control to load a different sheep picture each time a different segment is tapped. Those sheep pictures are a bit large, so visit this lesson to figure out how to display them properly.
- Get through the tapper lesson and take a break. If you made it this far, it’s time to move on to the next lesson.