hey guys how's it going my name's call and in today's swift and xcode tutorial we're
going to be building a simple timer our timer is going to count up from zero so essentially
it's like a stopwatch we're going to have a start stop button which is a toggle and we're
going to have a reset button on the reset button we're going to do a little bit of validation so
we're going to present the user with an alert dialog and it's just basically going to say
are you sure you want to reset the timer there's a link in the description to the source code
as well i'll put a link in the description i made a very similar video using java and android
studio to build pretty much the same app so if you're like me and you like to develop apps in
both platforms whether that be iOS or android yeah i'll leave a link in the description to
that video so check that one out if you're interested otherwise let's get stuck into it
creating a new xcode project i'm going to select app and for this tutorial i'm going to call
it timer app example and i'm going to select storyboard ui kit and swift as our programming
language and i'm not going to include any tests the first thing we're going to do is head into
the main storyboard and we're just going to get our layout sorted dragging in a label and
two buttons the label is going to be our timer label and i'm just going to keep it super simple
and center it horizontally in the safe area and give it some space to the top of the container
the two buttons are going to be one's going to be our start stop button and the other one's going
to be our reset button there are two buttons they're going to take up half the screen width
wise each they're going to sit just below our timer label i'm just going to center one button
off the other one vertically going to set the leading space to the left button and the trailing
space to the right button and then some horizontal spacing between the both of them and then set the
widths to be equal we just need to head into our constraints and modify our trailing and leading
space to be zero for both of our buttons so you can see what that's achieved there and then i'm
just going to rename that button to be start and the other one to be reset i'm going to change the
timer label to show what the timer will be at the start which is all zeros i think we need to make
this a little bit bigger so i'm just going to make the font there i'm going to make that 70. clicking
on both so just holding command there and clicking on both buttons i'm going to change the size to
40. cool and a final and probably unnecessary adjustment is i'm just going to change
the vertical spacing of our timer label cool so that looks like a simple timer app to me
i'm pretty happy with that next what we're going to do is open up the assistant editor and we're
going to create the outlets for both the timer label and both of the start and reset buttons
so i'm just calling that timer label and start stop button and reset button so yeah just right
click and then drag above the view did load and then below our view did load i'm going to right
click and drag in again and i'm going to create an action and i'm going to call this action reset
tapped and the same for the start stop button so start stop tapped and then we can close that
off and head into our main view controller inside here i'm just going to declare a timer so i'm just
calling it timer and then i'm going to declare a variable of type int which is count and then
initialize it to zero and then one more i'm going to call this timer counting and this is a boolean
and true or false so just to say whether or not the timer is counting currently or not in our
view did load make the start stop button green so i'm just saying set title color to ui color green
for normal state so just initializing our start stop button to be green on load nice so in our
start stop tap we're just going to set up our symbol toggle so if timer is counting i want to
set the time counting to be false and otherwise set time counting to be true the time is counting
and the user taps this button we want to stop the timer so i'm just calling timer.invalidate which
stops the timer and we also want to change what the button looks like so i'm just calling start
stop button dot set title and changing it to start for state normal and we want to do the exact same
thing in our else statement but instead of calling set title start we want to say set title to stop
for state normal and we also can grab this line we did in view did load and that's just to change the
title color to red or green depending on whether or not the timer is counting cool and the final
thing we need to do is actually get our timer to start counting so i'm just calling timer is equal
to timer dot scheduled timer and it's this bottom one here with time interval target selector user
info and repeats so setting time interval to 1 target itself selector is we're doing a hash
symbol and selector and this is something we haven't created yet but i'm just going to call
this timer counter user info nil and repeats is true cool so it's giving us error message because
we don't actually have the selector yet so i'm just going to create that now so we're saying
an available to objective c function called timer counter and it returns void void with a capital
inside the timer counter method we're just going to say count is equal to count plus one so add
one to count every time this function is run and then i'm going to create another function this is
called seconds to hours to minutes to seconds and basically it takes one end this int is going to be
count and it's going to be a really big number and basically we're going to do the maths of turning
this really big second string into seconds minutes and hours cool so inside this function we're just
going to say return and with our first we're going to say seconds divided by 3600 for our minutes
we're going to say seconds percentage sign 3600 and just putting that in some brackets and then
we're also going to say divide that by 60. finally for our hours i'm going to say seconds divisible
sign again 3600 in some brackets and then instead of divided by 60 we're going to do divisible sine
by 60 and then putting that in some brackets i was struggling a bit with the brackets here but
i got there in the end yeah you can see i'm returning seconds here minutes here and hours here
and then we're going to create another function below that and we're going to call this make time
string and all this function is going to do is take an hours minutes and seconds and put them
all stick them all together in a nice string that we can then display to the user and put into our
timer label declare that string i'm going to call it time string and initially it's got nothing in
it and then we're just going to say time string plus equal to string format and i'm going to say
to two decimal places and the argument is going to be our hours time string plus equal to again
and we're going to give it a little bit of space and the little semicolon time thing and then we
can just copy and paste that down two more times get rid of the bottom one as we won't have the
little colon at the end and just change it to minutes and seconds and then we're just going
to return that time string now we can continue on with our timer counter method and we're just
going to say let time equal to seconds hours minutes to seconds and pass it through our count
and then we're going to say let time string equal to our make time string and we're going to pass
it in time dot zero time.1 and time dot 2 because that's what that's returning remember those three
different ints and then we're just going to say timer label dot text and set the text to our time
string nice one so all we need to do now is get our reset button working so inside reset tapped
let alert equal to ui alert controller with the title message and preferred style and i'm just
going to say the title is reset timer and then the messages are you sure you would like to reset the
timer preferred style is dot alert and then we're going to say alert dot add action we're going to
say ui alert action and we're going to give this title a cancel so a cancel button and i'm going
to say style.cancel and handler i'm just going to hit enter and then give it a little underscore and
just basically in this action we're going to do nothing and then i'm going to copy and paste that
action change it to yes and we're going to say style is default and now we know that the user
definitely wants to reset the timer so what we're going to do is call self.count is equal to zero
and then we're going to say self.timer.invalidate we're stopping the timer from counting and then
i'm going to say self dot timer label dot text is equal to self dot make time string and passing
it all zeros and then finally we just want to say self.present alert animated is true and completion
is nil cool and just a little bit of bug fixing i stuffed up this expression it's actually
percentage sign 02d and when we reset our timer i just need to make it look like it's back to start
so setting the title to start and the color to green cool and we can build and run this now
and you can see we've got a pretty basic timer i suppose it's really a stopwatch because it's
the timer counting up from zero and i just want to make one quick adjustment i'm going to set this to
be bold cool so that's a pretty simple timer using swift and xcode and the ui kit if you want to test
the hours and minutes i'm just going to change the time interval to be point zero one one so that
it goes the timer goes a lot faster if you like this with this swift and xcode tutorial consider
liking the video or subscribing otherwise i'll catch you guys in the next one cheers