1
00:00:07,170 --> 00:00:12,120
Hey guys what's going on this is Caleb with Deb's Scott common in this video we're going to build our

2
00:00:12,120 --> 00:00:17,570
X code project we're going to go into the interface builder and build the really simple app UI.

3
00:00:17,730 --> 00:00:22,560
And we're also going to go ahead and wire it up with Iby outlets for each label.

4
00:00:22,580 --> 00:00:28,710
So go ahead and pull up an X code and click Create new project then we're just going to choose a single

5
00:00:28,710 --> 00:00:35,170
view application and we're going to go ahead and just name this maybe x y z.

6
00:00:36,730 --> 00:00:37,630
Machine.

7
00:00:37,840 --> 00:00:39,770
I don't know x y z machine that's good enough.

8
00:00:39,790 --> 00:00:45,220
So click next and save it somewhere either on your desktop or in a folder somewhere.

9
00:00:45,400 --> 00:00:47,460
And I'm going to make this full screen.

10
00:00:47,830 --> 00:00:53,980
Now I don't necessarily want my screen moving around on me or rotating while moving the device so I'm

11
00:00:54,010 --> 00:00:56,770
going to unstick landscape left and right.

12
00:00:57,070 --> 00:01:02,650
And now all I have to do is go into here add three labels and we're pretty much good to go with exception

13
00:01:02,650 --> 00:01:05,240
of connecting those labels to outlets.

14
00:01:05,260 --> 00:01:11,380
So go ahead and type label drag it on and we're going to just copy and paste it twice.

15
00:01:11,560 --> 00:01:15,010
And this is OK because we have not yet connected this to anything.

16
00:01:15,010 --> 00:01:19,720
And then what we're going to do is we're going to go ahead and select all three of those labels and

17
00:01:19,720 --> 00:01:20,950
put them into a stack.

18
00:01:21,170 --> 00:01:21,760
OK.

19
00:01:22,180 --> 00:01:22,920
So do that.

20
00:01:22,960 --> 00:01:28,920
And now what we're going to do is we're going to go ahead and constrain this to the border of the screen.

21
00:01:29,020 --> 00:01:37,000
So go ahead and put constraints here for the stacked view of 0 0 0 and 0 from all sides and add those

22
00:01:37,000 --> 00:01:38,100
constraints.

23
00:01:38,110 --> 00:01:40,870
Now of course that's not exactly how we want it to look.

24
00:01:40,900 --> 00:01:46,390
And so we're going to go into distribution in the attributes and Specter and we're going to set it to

25
00:01:46,390 --> 00:01:47,620
fill equally.

26
00:01:47,860 --> 00:01:54,010
So now they're all spaced evenly like we would want and we're going to go ahead and also add the individual

27
00:01:54,010 --> 00:01:56,490
labels here to have their text centered.

28
00:01:56,710 --> 00:01:59,290
And we're going to make it much bigger so it's easier to see.

29
00:01:59,290 --> 00:02:03,640
So select all three labels you can either do that over here in the document outline or you can just

30
00:02:03,640 --> 00:02:07,270
select one hold shift and then click on the other two.

31
00:02:07,510 --> 00:02:09,940
And now go ahead and center the font.

32
00:02:09,940 --> 00:02:15,400
Click text click System Change the custom and I'm just going to choose a nicer looking font like Avenir

33
00:02:15,400 --> 00:02:19,260
next and I'm going to set it to bold.

34
00:02:19,270 --> 00:02:21,630
I think maybe heavy heavy is cool.

35
00:02:23,000 --> 00:02:23,880
Yeah there we go.

36
00:02:24,040 --> 00:02:24,390
OK.

37
00:02:24,410 --> 00:02:29,900
And then I'm going to go ahead and actually make this size 100 which is really big but it will be cool.

38
00:02:29,960 --> 00:02:38,600
So now I'm going to go ahead and edit the text here to say X and then a little space Y and a space and

39
00:02:38,600 --> 00:02:40,160
then Z and a space.

40
00:02:40,160 --> 00:02:45,230
Now this is cosmetic because we're going to actually set these values later in code.

41
00:02:45,230 --> 00:02:51,410
But something we can do is we can change this to have a nice read for the X change the Y to have a yellow

42
00:02:51,620 --> 00:02:57,150
Whyfor yellow funny anyway and then a blue is going to be for the z value.

43
00:02:57,260 --> 00:03:05,800
So now we have three labels here X Y and Z and now all we need to do is connect them in our code file

44
00:03:05,810 --> 00:03:10,550
so pull open the assistant editor by clicking these little rings here and we're going to right click

45
00:03:10,550 --> 00:03:11,200
and drag.

46
00:03:11,300 --> 00:03:16,430
OK so we're going to choose an item like this label right click and then drag over to the code file

47
00:03:16,460 --> 00:03:17,430
and let go.

48
00:03:17,660 --> 00:03:22,820
Now this is going to create an IP outlet which is a way that we can interface with this label from our

49
00:03:22,820 --> 00:03:25,880
code file it's just kind of like a connector that lets us interface with it.

50
00:03:25,880 --> 00:03:29,870
So go ahead and name this X label.

51
00:03:29,910 --> 00:03:30,730
All righty.

52
00:03:30,930 --> 00:03:38,610
Make some space and then right click and drag from this label and type y label get connected and do

53
00:03:38,610 --> 00:03:43,740
the same thing for the Z label Z label Z label.

54
00:03:43,740 --> 00:03:45,450
Nice connect that.

55
00:03:45,480 --> 00:03:48,740
And now we are good to go.

56
00:03:48,780 --> 00:03:51,550
Other than that we need to just get rid of did receive my memory warning.

57
00:03:51,720 --> 00:03:56,660
I've never actually used that nor have I ever seen a developer use it so you know not to say that there's

58
00:03:56,670 --> 00:03:57,380
no purpose.

59
00:03:57,390 --> 00:03:59,340
But I don't know what one is.

60
00:03:59,340 --> 00:04:00,360
Well I do.

61
00:04:00,390 --> 00:04:05,340
Obviously if you're using a really memory intensive app that's called but I've never used it.

62
00:04:05,340 --> 00:04:08,730
So anyway we are now totally connected.

63
00:04:08,730 --> 00:04:11,080
We have our labels linked.

64
00:04:11,130 --> 00:04:16,170
We could set their text if we wanted to here but we don't need to yet let's just let's build and run

65
00:04:16,170 --> 00:04:20,760
to make sure this looks the way we want and so I'm going to go ahead and build and run.

66
00:04:20,780 --> 00:04:26,190
It'll pop open on my phone and I'll pull up in quick time here so I can show you what's going on on

67
00:04:26,190 --> 00:04:27,670
my phone screen.

68
00:04:27,840 --> 00:04:34,290
Hopefully before it installs because it's going to take over my USP cable and that's my old version

69
00:04:34,290 --> 00:04:35,020
of the app.

70
00:04:35,070 --> 00:04:37,770
We're going to go ahead and run the new one right now.

71
00:04:37,770 --> 00:04:38,620
There we go.

72
00:04:38,760 --> 00:04:40,060
OK look at that boom.

73
00:04:40,080 --> 00:04:40,920
It's centered.

74
00:04:40,920 --> 00:04:43,930
The text is nice and big and easy to see.

75
00:04:43,970 --> 00:04:48,150
This looks great guys so our interface is now totally finished being built.

76
00:04:48,150 --> 00:04:53,700
We have successfully wired up all of our labels here in Interface Builder so that we can modify their

77
00:04:53,700 --> 00:04:55,690
text property later on.

78
00:04:55,740 --> 00:04:59,970
Let's move on to the next video where we're going to dive into core motion which is how we're going

79
00:04:59,970 --> 00:05:05,820
to keep track of the accelerometer as well as a subclass called S.N. motion manager.

80
00:05:05,850 --> 00:05:10,560
I'm going to show you some of the apple documentation and explain how what you'll learn in this course

81
00:05:10,560 --> 00:05:16,220
can be applied to actually lots of other instruments that are built into your iPhone.

82
00:05:16,230 --> 00:05:17,280
So very cool stuff.

83
00:05:17,280 --> 00:05:21,420
Let's head over to the next video where we're going to dive into that Apple documentation and learn

84
00:05:21,420 --> 00:05:22,340
about core emotion.

85
00:05:22,350 --> 00:05:23,800
I'll see you there.