Part 1 - How to Make Trivia Crack (Swift : Xcode) Video Lecture | Swift in Xcode: The Complete iOS Development Guide - App Development

hey everybody welcome to part one on how
to make your own trivia crack type game
of using swift in Xcode we will be using
parse calm as our server so we can
actually upload and change our game as
we like it as it's on the App Store so
it's actually going to be able to add
more questions and more questions while
it's still on the App Store without
updating so that's why part using
servers is such a great idea so we're
going to be using parse calm as our
server and I'll explain more about parse
calm later in the tutorial but go ahead
and check it out and create an account
if you haven't already in order to do
this tutorial but anyway guys let's go
ahead and get started all right so first
thing we need to do is just open up
Xcode and create a new Xcode project and
this is going to be a single view
application click Next in our product
name I'm just going to call mine crack
trivia it doesn't really matter what you
call it just a name the language will be
set to Swift and our devices will be set
to iPhone now click Next and create all
right now I'm gonna go to over to my app
delegate Duck Swift first and actually
we need to go ahead and go to parse comm
so first thing we need to do is click on
Safari or Google Chrome or whatever you
use as a browser so just go ahead and
we're gonna go to parse comm and over
here on parse comm you either if you
don't have an account you want to set
one up I already have an account so I'm
just going to show you basics the basics
from if you have an account for some
reason it's not loading up to give it
just a minute alright now that it's all
loaded up over here in the top right
corner you would either see login or
create account I already am logged in
like I said before so just hover over
your name over here on the top and click
on dashboard and we want to create a new
app and this is going to be called crack
trivia of course this actually doesn't
need to match the name of your Xcode
project so it actually can be whatever
you want it to be so now go ahead and
create and now we have crack trivia as a
new app so first thing we need to is
click on quick start and go over to data
mobile iOS and we're gonna click on
Objective C and this is an existing
project so now we need to download the
SDK so I already did that it's just over
here in my downloads per object right
here so go ahead and double-click on the
parse library that you just downloaded
and first thing we need to do is click
on that and also we have Xcode right
behind that so we need to just click and
drag our parse framework underneath our
correct trivia and then we need to drag
the parse UI into our correct trivia as
well alright now that that's done we
need to go to build phases and we need a
link binary with libraries and as you
can see it already linked the binary
with libraries so it's adding these
libraries that hold a bunch of code that
you're allowed to be actually put inside
of your application and use so these
libraries just hold a bunch of if you
actually look in here just a bunch of
files and you could actually just pull
from those files and use them inside of
your application themselves yourself and
that makes it a lot easier for working
with parse or something like that so now
that we have them all hooked up if you
scroll down over here on parse it says
step 3 add the dependencies so again we
need to go back to our build phases in
linked binary with libraries and out
down here you will see that it wants you
to add all of these frameworks right
here in order for parse to work
alongside your app so go ahead and we're
just going to add those so first up is
audio toolbox and that's exactly how you
do it you press the plus sign then you'd
search audio toolbox double click or
click and click ok and then it adds that
inside of your application or Xcode
right now so now we can actually use the
files that are contained inside of this
audio toolbox inside of your applique
so I'm just gonna go ahead and skip a
skip ahead and add all these
all right now that we have all our
frameworks added I'm now just going into
my app delegate right down here and
right down here you will see connect
your app with two parts so I make sure
you're selected properly according to
which app you're using so we're doing
correct trivia so be sure that's
selected or else it will not be the
correct application IDs so now that we
have all this done this is actually all
written inside of objective-c since they
have a haven't exactly updated all this
to you Swift yet so first time when you
actually want to do is just go into our
optical app delegate Swift and we're
gonna first just say import parse so
make sure it's a capital P ours so now
that now we have this parse that
framework added into our app delegate
sup Swift so we can actually use the
files inside of that alright now that
that's done go down here and not there
go down here and we want to go to funk
application did finish launching with
options launch options so go down here
and right before the return we want to
add parse a dot enable local datastore
so I'm basically translating this into
parse language right over here so it's
not if we copied and paste this right
now it's going to give you an error like
so so now we actually want to just
program this in Swift so now we want to
say parse dot set application ID and
then copy our application ID right over
here copy our application ID right over
here and paste it into your application
ID right there and now go to your client
key so your client key will be right
down here and be sure you are selecting
the quotation marks as well or else it
won't work properly all right now our
application ID is set up alright now
this last part that we're at
right here is actually pretty optional
it says right over here this is just so
it tracks the statistics of when your
app is opened so this is good I have a
like adding this show so I can see how
many people are going to actually open
my application on a daily basis so let's
go ahead and just say PF analytics dot
track I have open with launch options in
background and we want to say launch
options so this first part is just going
to be launch options it's a it's an
object and then we have a block and this
block we don't want to add anything so
just say n il nil which means there's
nothing pretty much all right and all
right now let's build and run this and
as you can see we actually have a
problem over here it says Apple Mac o
linker err so the reason that is
happening is because it's referencing
something in these parse files that
isn't referenced inside of our parse
files so we actually need to import
these other frameworks that came along
with the parse library so go ahead and
just click and drag those last three
libraries into our last three frameworks
into our application and now if we built
and run the ran this right now now the
app would show up and as you can see by
the spinning circle and in the syrup in
the top left corner it is connected so
now who are to test the SDK we could
actually just say test there's no data
yet so actually let's let's go ahead and
add some data into our view so first
thing we want to do is just say import
or go to your view controller dot Swift
and we want to say import parse
so I enter import parse and then right
down here we want to have inside of our
viewdidload I'm going to say PF we want
to actually say bar test object equals
PF object dot object and then it's
supposed to be object with class name so
we actually say PF object and then open
bracket and then you'll see class name
and this name will you shelf just call
it test object all right and then after
that we want to say test object open
bracket close bracket so i'm britta and
pretty much doing whatever it says over
there and you'll say foo equals bar so
this is just to get you up and running
with parson testing and making sure that
our application is hooked up to parse
properly this doesn't really need to be
done if you don't want to do this just
skip ahead and yeah now we want to say
test object dot Save in background with
target so saving background with target
and the target is going to be self and
our selector will be nil we don't want a
selector all right so now if we were to
build and ran run this right now you
will see that if we test it says
congrats you saved your first object and
actually we can see this if we go to our
core right over here you will see that
we have our test object and we created a
bar array or a foo array with a name of
bar inside of it all right now we can
actually go back and just delete the
stuff that we just did basically all
that we did there we were just testing
and making sure that everything was set
up properly so now that everything is
set up properly we can just go ahead and
we can drop this
and we can just say a test object so now
we're deleting this class and all right
and now we just want to add a new class
in this class which I was going to call
this questions and answers you guys can
call this whatever you want but now
we're just going to create that class
and now if we were to click on this
class right here there's no data to
display so first thing we want to do is
create a column and this column is going
to hold our array which will hold our
quick questions so we can just say
questions and then we're gonna select
the type of array and then create that
column and as you can see it just
created this columns array right over
here and now we need to add an answer
array so now we just call click on added
column and we're gonna say answer and
this is actually going to be a string
not an array and then create the column
and now we have the answer string right
over here and lastly we want to add our
a question I mean our answer is column
so we can just actually say answer
answers and then we will have this as an
array and create the column all right
and I actually messed up in the naming
scheme so this questions should be
actually a string and then we have
answer as a string but the answers will
be an array so just click go ahead and
add a row click on the cell that's right
underneath the questions array right
here and then you say more up here and
you delete the column and this is make
sure you're deleting the questions name
so drop that column and then left now we
actually want to add our column which
will hold our string value so just go
ahead and add that string value and this
will be our question string this is this
is the string that's gonna hold our
question according to the answer and the
the answer is that we will have provided
and the actual answer all right so first
thing we need to do is just add a
question we can just say
we'll say the question is what does the
Fox say alright and that is our string
and then in our answers we will just
have an array so go ahead and say
bracket open parenthesis I mean open
quotation my close quotation mark and we
will have Africa
fraka-kaka-kaka-kaka-kow doesn't really
matter
and then meaning in E or open quotation
mark close quotation mark and kind of
pick something easier it was partly
stupid all right knee knee knee knee
knee and then we will have hi squealing
sound and lastly we will just have boo
and then we close that off with our
ending bracket all right so now we have
an array holding all of our answers and
it can actually make this a little
bigger so you can actually see your
whole thing so we have freckie Kakao
Nittany High School annoyed sound and
boo we will just make the answer this
third one right here and actually it
goes 0 1 2 3
so according it starts at 0 so you can
just try to think of it in that way when
you're trying to think of the answer so
we need to go back to our answer and we
want to say the answer is this third one
over here so with that would actually be
the two so the answer will be two all
right now let's go back to our vr view
controller dot swift file over here and
now we're gonna work on our program
itself so the first thing we need to do
is just add a variable and this variable
will just be called the question
variable and this is going to be of a
string variable then we have a variable
in this will be your answers and this is
going to be an array so you actually
want to say Open bracket close bracket
and we want to say it's an array of
strings
like so and then lastly we want to add
the answer so answer and this is also
going to be a string all right so now
that we have those all created our
variables all created let's go over to
our main dot storyboard and we want to
add a button or at first we're gonna add
a label on to our scene so just click
and drag a label on to our scene like so
and we're gonna make that a bit bigger
and then we're also going to Center the
text like so and if you have a longer
question you want to elongate it this in
the width and we're gonna change the
amount of lines to we'll say three that
way if I were to take all this text you
have a huge long question it should all
fit inside of this question array that
you have right there alright so now that
that is done we want to open up our
assistant editor and we're going to link
this label up with our
viewcontroller.swift
and this is going to be of the type
outlet or our connection type will be
outlet and our name we'll just call this
a question label and then connect
alright and now let's click and drag a
button onto our scene and again we're
gonna make this as big as it can be just
in case you have a big long answer and
then right click or control click and
drag from that button over to our view
controller dot Swift and we're gonna add
this as an outlet and this is going to
be button 1 and connect all right now
copy and paste that so we have four
buttons total again and lastly like so
alright so now add just connect our
buttons up to our view controller dot
Swift file like we did before so
right-click or control click and drag
from our button connection type will be
outlet
we're gonna call this button 2 again
button 3 and lastly button for about 10
to 4 all right so now what what we just
did there is we're naming all of these
objects that are on inside of our view
controller that we have right here so
now we're actually going to be able to
change the text that's inside of these
so the first thing we actually want to
do is just make this make sure all these
buttons are actually centered because if
we were to build and run this right now
you will see that most of these are just
going to go right off the view
controller they're gone they're not
going to be centered so let's go ahead
and do that so right-click or control
click and drag from your button so that
it drags over to your view or you can
just simply click and drag if you're not
sure on what you're dragging and
clicking onto you can just right-click
or control click and drag from your
button over to your view in your
hierarchy right over here and then you
can say it has equal widths but I'm just
gonna stick with the rest here so and
then we're gonna Center horizontally in
container and then Center vertically in
container and do the same with all of
those buttons equal widths Center
horizontally Center vertically equal bit
Center horizontally Center vertically
equal widths Center horizontally and
Center vertically and it's also
important to note that when you're
centering it vertically it's not putting
it in the middle of the container it's
actually just maintaining this position
according to where it isn't right now
and then placing that in the center of
when we change from an iPhone 4 inch 5
inch and so on
so now let's build and run this right
now and as you will see now everything
is centered up we didn't do our labels
so let's go ahead and do that so right
click or control click and drag from our
label and we're gonna make this equal
widths sorry equal widths
Center horizontally and Center
vertically all right now build and run
and now as you will see the label is
hooked up properly that round all right
now let's open up our assistant editor
and we want to right click or control
click and drag from our buttons over
here over to our view controller dot
Swift and we want to add the connection
as an action this time so now actually
when these buttons are clicked we want
something to happen so this will just be
called button one action Connect and
just do that basically with the rest of
them alright now that we have all our UI
elements all set up and now we actually
want to call the data from parse comm
and put that inside of our application
so we want to say funk call data open
parentheses close parentheses and we
want to say add an open curly bracket of
a close curly bracket right after you
click enter and now this is great to do
to put it inside of a function I could
put it in viewdidload but the thing is
you don't want to you don't really want
to do that because then it adds more
blow if you ever want to put that inside
of a different area inside of your
application so we want to say funk call
data so we're gonna call the data from
our parse servers and we're gonna say
var query colon PF quarry so what we're
doing right here is we're actually
grabbing a quarry so we're grabbing our
a quarry from here so we're gonna grab
this data and put it inside of a query
which is actually if a query is just
basically it's hard to explain it's just
something that you put inside of your
application in order to grab things out
of parse and then grab from that query
and then place it inside of your
application I hope I didn't I hope I
didn't confuse that with you it's just
very simple so now it's just save our
query : PF query equals PF quarry open
parentheses and class name and the class
name we're just going to call this
our class name is going to be actually
the same as the class that we created so
mine would be questions and answers but
if you added a different class see this
is where you would call your class name
so if you added a different thing you
would put that inside of there and also
make sure it's all case sensitive so be
sure to do that and if you ever did
forget your data name just go over to
here click on security and you will see
settings for questions and answers all
right so now that that's over with you
can just save our query PF query class
name and we're gonna say questions and
ants words alright now that that's done
just go down here and we want to say
query dot get object and background with
ID so now we actually want to grab one
of these objects in here so this object
this is an object right over here so
this ID is actually overdriving so we're
grabbing this ID so we're grabbing what
Zagat okay so get object in background
with ID open quotation mark close
quotation mark and inside of those
quotation marks you just want to add the
object ID that we created from here
grabbed from here so now we're actually
going to grab every object that's inside
of this and then we're gonna place that
into an object into our application
that's and then this block you just want
to erase this last part right here and
you want to close off those parentheses
open curly bracket click enter close
curly bracket then right after those
curly brackets you want to add an object
so you want to say open parentheses
close parentheses and we're going to
grab our objects so this is we can just
call this the object holder if that
makes sense to you so we're grabbing all
these objects inside of here and we're
placing that inside of this object
holder so the object holder : and we're
just going to call this PF object like
so with an exclamation point
click comma I had a comma after that and
this will say error
: NS error then right after that's done
just click on again we want to add an
arrow so it's like it's a dash and then
an open just it looks like an arrow and
then you say avoid in so now we are we
created this object and now we're going
to actually take this object and we're
gonna grab objects from that object if
that makes sense all right so that
object that we just created holds
everything inside of here so now we're
gonna grab these certain specific
objects out of that object we okay now
if we say error if we want to add an if
statement so if there is no error so
error equals equals nil then we want
stuff to happen else we can report it
with an NS log so we want to say NS log
and we can just say there is something
wrong like so and just close off those
friends these views right there so if we
built and ran this right now first of
all the call data we didn't actually be
used because of everything and right now
as my simulator is being used
okay so right now if we did this call
data would not be called so nothing
would really happen but so what we
actually want to do in order for this to
be called we go into our viewdidload and
we say call data so now we're actually
calling this function when our view
loads alright now go back to our air
right here and first thing we want to do
is assign these arrays that we just
created that we created of here and we
know you want to assign those to these
objects that are inside of our parse
data so
right inside of there you want to say
self dot question so if I were to just
say question like I normally would it
would give me this error you actually
need to add this self dot question
equals and then you want to say object
holder and then opening bracket close
bracket and inside of those we want to
grab the object name so this is going to
be an object of this is the questions
that we're doing so just grab the
question string the right there so just
type that right in and this is going to
be as a string all right and now we need
to say self dot answers equals answer
I'm sorry made object holder Open
bracket close bracket open quotation my
close quotation mark and this is going
to be answers or whatever you named it
right over here so this is actually
answers this is the array that we
grabbed that we are grabbing right now
and then we want to say as array
exclamation point all right and now that
is being assigned and lastly we want to
say bar I'm sorry we want to say self
dot answer equals object holder Open
bracket close bracket and inside of
those we want to say this is equal to
our answer column that we have right
over here and then this is going to be
as a string again all right now that we
have those all set up if we were to
build and run this right now first of
all nothing would happen but also if we
were to if we set head said right there
that these buttons have titles and
they're equal to these objects inside of
this array that wouldn't actually be
built in ran inside of this because we
this is actually ran inside of our
load so this is that would not work
properly so we actually want to say if
open code opens parenthesis self dot
quotation I'm sorry self dot answers dot
to count is greater than zero then we
want these answers to a actually placed
inside of our buttons so now we actually
want to do that and actually we want to
do that when we have our questions built
as well so we want to say self dot
question later question label it looks
like I will misspelled that at the start
then that's fine so to say self that
question label is equal to self dot
question self dot question dot text I'm
sorry if this should be question label
dot text is equal to self dot question
alright so now let's build and run this
and you should see that the label is
going to pop up with the question so
it's gonna be a bit of a lag time
because it has to load it from the
server but there you have it so that
loads up what does the Fox say now right
now if we go down here and we say self
dot button one dot are actually want to
say self dot button one dot set title
and we're going to set this title equal
to the string that we created right here
and this is going to actually be part of
the array so we want to say self dot
answers and this is going to be our
button it our button 1 is going to be
equal to our first answer and as you can
remember it goes from 0 1 2 3 so this is
going to be equal to self dot answers
and this is going to be 0 so we're
grabbing the first object out of that
and then it's gonna be if the for the
state UI control
state dot normal all right now let's
just copy and paste that line so we have
four buttons total and now we have
button to button 3 and button 4 and then
we have these buttons and we also want
to change it to be 0 1 for button 2 2
for button 3 and 3 for button for now
let's build and run this and as you
should see everything should build and
run into our buttons so there we have it
and now if we actually want this to have
an answer so now let's go ahead and do
that say self dot answer or actually we
already did that so now the answer is
actually called in as a string all right
now we actually want to go down here
into our button 1 action in our button
to action and so on and we actually want
to make sure and actually have something
that says that we actually created we
actually clicked the right answer so we
say if answer is equal equal to 0 for
button 1 it would be 0 then we have this
happen and we're gonna actually just do
an NS log for now so we're gonna say NS
log and our format will be a string and
just gonna make this log as correct and
then you can just erase the other half
like so and now just copy and paste that
inside of all of your buttons that you
have and right over here and your button
to action this will be of course number
1 our button 3 action this will be
number 2 and button for action this will
be number 3 alright and it looks like I
did something wrong oh there is a random
quotation mark after that alright now
let's go ahead and build and run this
and now what does the Fox say now we
have hi squealing sound so
we were to go back to our application
correct so now we actually pulled the
data we have an answer and we put that
inside of our buttons so now when we
click these buttons we say it's correct
now we can also add an else statement
that says you're wrong so just go ahead
and right underneath your if statement
you can just just say else else this
will happen so you will say NSLog wrong
like so and then you can also just copy
and paste that into all of your other
buttons as well and now if I were to
build and run this you will see that I
click on that and it says wrong but I
can also click on hi squealing sound and
it'll be correct so there you guys have
it this is part one I will show you guys
more later on on how to pick random op
randomized the objects and then how to
actually create users later on so thank
you guys so much for watching this
tutorial and that's the end anyway guys
if you guys enjoyed this tutorial be
sure to hit that like button down below
if you guys want to see more tutorials
like this from me in the future be sure
to subscribe down below anyway guys I
hope you guys enjoyed this tutorial and
if you want to see part 2 and part 3 of
these tutorials be sure to subscribe and
if you guys want to know more about me
be sure to check me up in my social
network links down below thank you guys
so much for watching and I will see you
in the next one