Day 77 of #100DaysOfSwiftUI

Start 100DaysOfSwiftUI from 2020.Mar.18th.

Day 77: Milestone: Projects 13-15
done with 1 hours

Target: develop application with specified requirement

requirements

use UIImagePickerController

wrap controller into SwiftUI

name selected photo with asking to user

in SwiftUI, maybe with onDisappear()?

save name and photo info

show imported photo with its name in list, sorted by name

use List

photo detail view

with NavigationView

save all data

additional requirement

• use CoreData for saving

Steps

• Step1: define data model
• Step2: make main UI (list for named photo, sorted by name)
• Step3: wrap UIImagePickerController
• Step4: make detail view

Step1: define data model

Photo data + name info would be enough?
I guess we can save the path to the photo instead of photo data itself.(maybe wrong, but let’s see)
“NamedPhoto” is the entity in CoreData, which have 2 properties, “name”:String, “photoURL”:String.

As usual, let’s add some wrapped properties.

• add NamedPhoto in CoreData model
• generate code for NamedPhoto with setting “Manual” for coredata code generation
• add wrappedProperty to CoreData class

Step2: make main UI

• add environment var for getting MOC
• add fetch request as @State property in ContentView
• locate List and ForEach for iterate fetchresult (and show photo name and path for the moment)

Step3: wrap UIImagePickerController

Step3-1: add “+” button in NavigationView

as is…

Step3-2: wrap UIKit Controller

make ImagePickerController class which inherits UIViewControllerRepresentable and implement necessary controller.

Step3-3: integrate ImagePicker into main UI

in closure which will be called from “+” button, call ImagePicker, then create new entity with given data.
with checking UIImagePickerControllerDelegate, I found we can get NSURL for getting the photo data, so we can save this info into CoreData.
Add @State var “selectedPhoto” to ContentView then pass it to ImagePicker for getting the selected photo info from ImagePicker.
Add PresentationMode as environment for ImagePicker to close the dialog.

it is difficult to ask the name for the photo after selecting the photo in ImagePicker.
So I introduced sequenceView which will show 2 view sequentially.

step4: detail view

if we need to pass binding variable which comes from fetch result, I have no idea how to pass it at the moment.
But just passing exiting info from CoreData is no problem.

pitfall

EnvironemntObject will NOT be inherited to .sheet view. probably navigationView will make it share with child views, but not with Sheet…

codes

omitted. because it is too long…