Hey everybody Caleb Stoltze here with slopes dot com and we're going to continue building out our animal
classifier app with the core M-L model that we built ourselves in this video we're going to go ahead
and enable our application to either pull images from our photo library or utilize the camera to take
an image on the fly.
Now before we begin we should go ahead and create some groups to put our view controllers and our custom
subclasses.
So I'm going to right click on my main folder here and create a new group called controller then I'm
going to right click and do one more and call it view.
And this is just a nice way to keep everything neat and tidy.
We're going to drag our visual effect view into the view folder and we don't have any special models
in this project so we don't really need a model folder.
You know if there's no files to go in it.
So what we're going to do is we're going to actually close the assistant editor and go directly into
the classifier View Controller.
And what we need to do is we need to go ahead and set it up so that we can check if a particular device
has a camera and if it doesn't we're going to go ahead and present the photo picker to choose from the
library.
So first of all we're going to check to make sure that the device that we're using actually has a camera
and to do that we're going to use guard.
So we're going to type guard UI image picker controller that is source type available DOT camera.
We're going to check if it is available.
We will move forward however else or if there is no camera.
We're going to need to present the photo picker OK and then return like so.
And that will essentially present the photo picker without throwing an error or causing a crash because
there's no camera on the device.
This would really only be relevant for really old iPod Touches and iPads.
However since we're going to be using it in the simulator which has no camera it's a pretty good option.
So once we have confirmed that there is or is not a photo device we're going to go ahead and pop up
what is called a photo sourced picture and it's just basically going to use a UI alert controller to
present two options either take a photo or choose a photo from your library.
So let's go ahead and create a constant let photo source picker equals UI alert controller.
And we're going to instantiate it like so.
And now we need to create two separate actions one for take photo and one for choose photo from the
photo library.
So let's go ahead and type Let take photo and we're going to take photo action of type.
UI alert action.
And we're going to give it a title a style and a handler.
So we're going to go ahead and use the title here.
Take photo.
And the style is going to just be default nothing.
No need to do anything fancy here.
And what we're going to do here on this closure is push enter and we don't necessarily need a specific
action here so I'm just going to put an underscore and that will allow me to use the closure without
needing to actually pass anything in.
So what we're going to do here this is where we present the photo picker with the camera option that
will basically present the camera view or we can take a photo and then pass that in later.
So now that action is done now we need to create the choose photo action.
So go ahead and type let choose photo action.
And that's also going to be a UI alert action with a title that will be.
Choose photo.
The style just like the other one will be defaults and the handler are going to do the same thing by
getting rid of this parameter here.
Replacing it with an underscore.
And I'm going to copy this for time's sake but this will instead be the photo picker from your camera
roll or another album of your choice.
So now what we need to do is we need to add these actions to our photo source pictures so we'll type
photo source picture dot add action will pass and take photo action then we're going to do that again.
Photo source Pichler dot add action and pass in Choose photo action.
OK.
And if we actually build this you'll see those warnings will go away and we're now at the point where
we need to also add a cancel action.
So to do that we're going to just type photo source picker adcom AB action and we're going to just go
ahead and create an instance of UI alert action here and we'll just pass in cancell here and the style
is going to be cancell which will show red text and it will also indicate that when it is tapped that
it should just dismiss the view and the handler here we don't care about so we'll just make that nil
because it can be.
And we now have a cancel action which is very cool.
So at point once we've done that we can now present the actual Isler controller which is called Photo
source picker.
We want it to be animated so it looks nice and pretty and the completion we don't care about so we'll
just make that nyl And you know what even though we have not set this up we can go ahead and run this
and see what happens.
I don't think anything will happen because there's no camera available so it should just return when
we press the button.
Yeah.
So nothing's going to happen because we haven't yet set up the picker but I don't know about you but
I want to do that so let's go ahead and let's do that now in order to do that basically we're going
to create a function with two different options.
OK.
And it's going to pass in what's called a source type and it's either going to be a camera or a photo
picker or a library rather.
And with that distinction it's going to present the proper view controller.
So let's go ahead and create a function called Present photo picker and we're going to pass in a source
type of UI image picker controller dot source type.
OK.
And inside this function we're going to go ahead and create an instance of UI image picker controller.
So let's type let picker equals a UI image pick a controller give it an instance.
And we need to set the delegate to be this view controller because this controller is handling the transfer
and passing on of data.
So go ahead and type picker dot delegate equals self and we need to then set the source type of this
picker either camera or photo library.
And don't worry we'll deal with that error in just a second.
But go ahead and type picker source type.
And that's going to be equal to the source type.
We pass in when we call this function.
OK.
At this point we can now type present controller and it will be our picker View Controller.
Animated is true and the completion we don't care about so we'll just make it nil.
So that is that.
But now we need to deal with the fact that we don't yet have the ability to set the delegates and in
order to do that we're going to create an extension of UI image picker control or delegate and UI navigation
control or delegate.
Both are required for us to actually do what we need to do.
So go ahead and let's type extension.
And this view controller is called a classifier controller.
So we're going to create an extension of this Visi and that's going to be UI image picker controller
delegate which you can see right here.
And we're also going to use UI navigation control or delegate.
OK.
Now inside this extension we're going to go ahead and call a function that is a part of UI image picker
controller called did finish picking media with info so you can actually just type that did finish picking
media with info.
See there it is very cool so what we actually get is we get an instance of a picture controller and
we get an array of the info and the data from the actual image itself which is really cool.
So in order to actually move forward this is what happens after we have picked an image either from
the camera or from the photo library.
So we're going to go ahead and just say that the picture can be dismissed and we'll make it animated
so it's nice and pretty.
The completion can be nil.
So at this point the image picker has been dismissed but now we have to take the image from the array
of data here and actually set the image view with that image.
But first we need to pull it out and it is optional in the instance maybe that we don't pick an image
or the image picture control it doesn't successfully you know grab an image when it is taken.
We can go ahead and type guard let image and we're actually going to get that from this info dictionary.
So what we're going to do is we are first going to go ahead and type info that's the name of the dictionary
and we're going to pull out the value for the key image picker controller k dot info key and what we
can do is we can pull out what is called original image and as you can see it specifies the original
uncropped image selected by the user.
OK.
Now the reason we're using a guard left here is because we need to cast this as a UI image so we're
going to type as you image and it is optional because there could not be an image there in that instance.
We're going to type else and we're going to use something called Fatal error.
OK.
And fatal error is something that's used in guard lets in the instance that there is an error that would
interrupt the application from continuing to work.
And so in this instance we're going to say no image returned returned and this is going to be good for
is for development.
Fatal error isn't necessarily the best for production because it would cause your app to crash but give
the user no information on why it crashed.
We're going to talk maybe a little bit later about a better way that we can do this and we'll show you
how to do it.
So now that we have our image here set as a UI image we're going to set our image of you remember that
the image view in our storyboard here this one we're going to fill it with an image so we're going to
type image view dot image and we're going to set it to the image very image constant.
We set right here and at this point once we have an image set we would then be able to use that image
use image to make predictions with core animal model and we're going to call a function later to do
that.
But let's go see if it actually works to select an image and then drop it in our image view.
But first we of course need to actually present our image picture.
So go ahead and type present photo picker and the source type here.
Remember this is in the instance that there is not a camera.
So the source type will be photo library here.
It's for the camera so we can to present photo picker source camera and for this one we can type present
photo picker photo library.
OK.
So let's build it.
And if what we did was correct which actually in this instance it's not because we need to make a reference
to self inside of a closure so type self dot right before this and rebuild.
Forgot about that sorry guys.
And now we should be able to tap on our photo button and be able to select an image.
So tap that button right here.
Boom.
And look at that the images pop right up.
Very cool stuff.
And we can select an image if we click on it it fills the UI image view that is so cool.
One thing though guys the image is currently so squashed.
So I'm going to go into our storyboard and update the content view or content mode rather from scale
to fill to Aspect fill.
And if I go ahead and rebuild that will see that when we select an image it'll actually maintain the
same aspect ratio.
But Phil from top to bottom so click on the camera here go ahead and click on camera roll and there
we go.
Now it's no longer squished it looks really nice and the view behind our label still gives like a hint
of the content behind it.
But we can still read the text fully.
Really really cool stuff.
So we're now at a really good place actually to move into dragging in our core a male model and setting
up some of our classification and prediction functions.
So let's head over to next video and let's do that now.