Day 17‘s lesson is Day 2 of 3 of the first iOS project named Project1 (aka “Storm Viewer” app).
Day 17’s lesson is named Project 1, part two and it consists of three sections that cover doing the following to Project 1 (aka “Storm Viewer” app): Building a detail screen, Loading images with UIImage, and Final tweaks: hidesBarsOnTap and large titles.
Thoughts about Day 17
The “Storm Viewer” app is a simple app. When it’s launched the app displays on the main screen a listing of all the app’s associated storm images filenames and displays the app’s title. Clicking on a filename loads a secondary screen that displays the filename’s image file and the filename replaces the “Storm Viewer” text title in the screen’s header area. Tapping the screen hides the header. Tapping the screen again displays the header. The header contains a link that when tapped loads the main screen.
For such a simple app there’s over a dozen different pieces that must either be coded or built using xCode’s Interface Builder. Even though I successfully followed the Day 16 and Day 17 lessons steps to get the Storm Viewer app built and running, there’s no way at this point in my 100DaysOfSwift journey that I could rebuild the app from scratch without referring back to both days’ lesson.
100DaysOfSwift author Paul Hudson did a great job putting together the materials for Project 1 and explaining the project’s steps, and reasoning for the steps, to the student reader. I think the Storm Viewer app is the perfect level of challenge for Project 1.
Study Notes
- Building a detail screen
- created a DetailViewController scene.
- added an imageView object to the DetailViewController scene.
- Loading images with UIImage
- created a property (named selectedImage) inside DetailViewController that hold the name of an image to load.
- implemented the didSelectRowAt() method that loads a DetailViewController from the storyboard..
- added code to DetailViewController to load in image into the image view.
- Final tweaks: hideBarsOnTap and large titles
- updated the image object to display images as “Aspect Fill” from “Aspect Fit” to prevent images from being displayed stretched to fit the screen. I ended up choosing to return displaying images as “Aspect Fit” because, on my iPhone XR simulator, the “Aspect Fill” filled the entire image space with an enlarged portion of the full image. With “Aspect Fit” the entire image is displayed, and displayed in correct proportions, though the entire image space is not used.
- added to DetailViewController two methods to view the images without the navigation bar getting in the way.
- viewWillAppear( ) – if the navigation bar is hidden, this method displays the navigation bar when the Details view screen is tapped.
- viewWillDisappear( ) – if the navigation bar is displayed, this method hides the navigation bar when the Details view screen is tapped.
- updated the main.storyboard to display disclosures arrows in each cell on the Storm Viewer app’s main screen.
- added code to display “Storm Viewer” as the app’s title at the gray bar located at the top of the main screen.
- added code to display in the title area of the Detail’s screen the name of the currently loaded image file.
- added code to the ViewController to display in the main screen the “Storm Viewer” title in large font.
- added code to the DetailViewController to NOT display in large font the name of the currently loaded image file.
Today’s study time*: 2 hours
100 Days of Swift cumulative study time: 49 hours 20 minutes
[*Note: those are actual study time values after subtracting break-time minutes from the Day’s study session]