1
00:00:01,760 --> 00:00:06,290
OK, in the last video, we looked at labels in this video, I want to look at labels more and give

2
00:00:06,290 --> 00:00:10,270
you some different configuration options you can do to play around with them.

3
00:00:10,280 --> 00:00:14,150
So in any widget, there's always lots of things you could sort of play with.

4
00:00:14,390 --> 00:00:15,710
You can change the size.

5
00:00:15,710 --> 00:00:20,090
You can change the, you know, the color, you can change the borders, all kinds of cool stuff.

6
00:00:20,360 --> 00:00:23,180
And so that's what we're going to look at for labels in this video.

7
00:00:23,390 --> 00:00:26,330
So the first one we're going to look at, let's change the color.

8
00:00:26,340 --> 00:00:30,950
So let's say you want to change the foreground color so we can change this to anything we want.

9
00:00:30,960 --> 00:00:33,560
I'm just going to say, I don't know, let's call it white.

10
00:00:33,570 --> 00:00:35,660
So if we save this and let's run it.

11
00:00:39,230 --> 00:00:44,840
It's kind of hard to see, but there hello, world is now white, it's a white foreground color.

12
00:00:45,080 --> 00:00:46,760
That's the color of the thing itself.

13
00:00:47,370 --> 00:00:48,160
So that's kind of cool.

14
00:00:48,950 --> 00:00:49,970
So you can change that now.

15
00:00:49,970 --> 00:00:53,390
You can use any sort of color codes that you know.

16
00:00:53,810 --> 00:00:58,760
So, for instance, you could change this to FAF.

17
00:00:58,760 --> 00:01:02,690
I think that's white, the color code, or you could just use the color itself.

18
00:01:03,080 --> 00:01:03,560
All right.

19
00:01:03,560 --> 00:01:04,310
So that's foreground.

20
00:01:04,310 --> 00:01:06,400
You can also change the background, BGU.

21
00:01:06,710 --> 00:01:08,840
So let's set this to black.

22
00:01:09,230 --> 00:01:12,370
So if we save this, hopefully we'll see this a little better.

23
00:01:14,040 --> 00:01:19,710
You can see now, hello, world, it's got a black background and a white foreground, that's cool.

24
00:01:20,660 --> 00:01:23,780
We can change the font, right, we can go.

25
00:01:25,690 --> 00:01:32,710
And you're always going to separate each thing with just a comma at the convention so we can go font

26
00:01:32,710 --> 00:01:33,460
equals.

27
00:01:34,660 --> 00:01:42,010
And this is in parentheses, so we can say, for instance, I don't know, Helvetica, the font type.

28
00:01:43,630 --> 00:01:49,360
And then the size we want to say 30 to pixels, so if we save this.

29
00:01:53,240 --> 00:01:59,040
Now we see Boom, hello, world, it's a different type of font and it's really big, right?

30
00:01:59,360 --> 00:02:00,400
So that's cool.

31
00:02:00,770 --> 00:02:04,760
We can change the relief as it raises a sunken that sort of things.

32
00:02:04,770 --> 00:02:07,640
Let's come down to this other one and let's go relief.

33
00:02:10,370 --> 00:02:14,540
Equals and then let's go sunken, save this.

34
00:02:18,930 --> 00:02:24,660
We see it's sort of, you know, looks like it's inside of a little thing that sort of sunken down we

35
00:02:24,660 --> 00:02:26,880
have, we can do flat.

36
00:02:27,890 --> 00:02:28,970
The fault is flat.

37
00:02:29,720 --> 00:02:34,220
You could do sunken raised groove and Regg, so let's just go through these real quick.

38
00:02:34,490 --> 00:02:37,520
Let's try a raised save this.

39
00:02:42,170 --> 00:02:44,030
Now it almost looks like a button, right?

40
00:02:44,270 --> 00:02:47,360
That's cool, we can do groove.

41
00:02:49,920 --> 00:02:51,900
Save this runit.

42
00:02:54,220 --> 00:02:55,940
It looks like that, OK?

43
00:02:56,980 --> 00:03:00,730
And then finally, Reg is the last one, sir.

44
00:03:01,060 --> 00:03:03,640
All right, D.G, save it.

45
00:03:08,820 --> 00:03:10,200
And kind of cool looking, right?

46
00:03:10,950 --> 00:03:12,240
So that's cool.

47
00:03:13,390 --> 00:03:19,060
We can give this a state, so let's go state equals disabled.

48
00:03:21,970 --> 00:03:24,600
So if we save this and run it.

49
00:03:26,300 --> 00:03:28,950
You'll notice it's sort of grade out a little bit.

50
00:03:29,300 --> 00:03:30,700
This is a good option for buttons.

51
00:03:30,700 --> 00:03:34,340
Sometimes you want a button that's not clickable unless something else happens.

52
00:03:34,340 --> 00:03:39,760
Say you click a checkbox that you agree to the terms and conditions and then the box becomes clickable.

53
00:03:39,950 --> 00:03:43,640
You would use this disabled on that.

54
00:03:43,880 --> 00:03:46,160
And we don't know how to do buttons yet, but that's how you do that.

55
00:03:46,160 --> 00:03:49,520
So you can do is disabled and you can do normal.

56
00:03:49,700 --> 00:03:50,810
Normal is the default.

57
00:03:50,810 --> 00:03:53,780
So we don't have to do that unless you're changing it to something else.

58
00:03:54,200 --> 00:03:57,770
So we can also go let's try this one up here.

59
00:03:57,770 --> 00:03:59,030
We can do heighth and with.

60
00:03:59,570 --> 00:04:00,230
So let's go.

61
00:04:00,230 --> 00:04:03,680
Height equals two hundred.

62
00:04:05,280 --> 00:04:06,600
Say this and run it.

63
00:04:09,890 --> 00:04:13,870
You can see, boom, it got real big, bigger even than our program, right?

64
00:04:15,660 --> 00:04:21,190
That's kind of interesting, you could also do with so let's go with.

65
00:04:29,490 --> 00:04:31,050
And so now it's bigger.

66
00:04:33,110 --> 00:04:37,580
Get rid of that, and that makes more sense if you're using a grid system.

67
00:04:37,850 --> 00:04:43,140
It's not as obvious how that's cool as using pack, but OK, that's interesting.

68
00:04:43,160 --> 00:04:45,470
And finally, you can give this sort of padding.

69
00:04:45,650 --> 00:04:53,180
So if you use if you go into the pack area here, so let's give this a pad Y and that's sort of up and

70
00:04:53,180 --> 00:04:57,000
down and let's say a pad Y of 50.

71
00:04:57,020 --> 00:04:59,660
So if we save this and run it.

72
00:05:02,280 --> 00:05:08,160
You'll see now this has been pushed down 50 pixels, now you can also do paddock's I'm not going to

73
00:05:08,160 --> 00:05:12,750
do that with PAC because this has been centered because we're using PAC, so it won't change.

74
00:05:13,050 --> 00:05:18,060
But if you're using a grid system, as you'll see moving forward, you can paddock's and that moves

75
00:05:18,060 --> 00:05:21,070
it from left to right by that that many pixels.

76
00:05:21,330 --> 00:05:27,840
So those are some of the most sort of popular normal options that you're going to use for your label

77
00:05:27,840 --> 00:05:28,260
widget.

78
00:05:28,830 --> 00:05:32,130
There are some other ones, but these are the main ones you need to sort of focus on.

79
00:05:32,130 --> 00:05:36,930
So foreground color, background, color, you can change the font, change the height and with and

80
00:05:36,930 --> 00:05:38,100
you can give it some padding.

81
00:05:38,290 --> 00:05:42,270
You can also disable or enable it using the state.

82
00:05:42,750 --> 00:05:46,920
And you can also sort of give it a sunken or erased effect as well.

83
00:05:46,930 --> 00:05:48,800
So pretty cool and pretty simple.

84
00:05:48,810 --> 00:05:50,370
So those are labels.

85
00:05:50,370 --> 00:05:51,030
That's pretty much all.

86
00:05:51,030 --> 00:05:52,590
We're going to spend time on labels.

87
00:05:52,980 --> 00:05:57,390
We're going to speed through a lot of these, which is pretty quickly and just a video or so going forward

88
00:05:57,390 --> 00:05:59,460
because they're all not much more difficult than this.

89
00:05:59,730 --> 00:06:05,490
And since you've already learned how to add things like foreground color, usually most of the wages

90
00:06:05,490 --> 00:06:06,810
are similar with these things.

91
00:06:06,810 --> 00:06:11,980
Most widgets, you can change the foreground, color the background, color the font, etc. So you'll

92
00:06:11,980 --> 00:06:16,800
use these same things on other widgets so that allow us to speed through them and learn them really

93
00:06:16,800 --> 00:06:17,210
quickly.

94
00:06:17,430 --> 00:06:18,690
So that's all for this video.

95
00:06:18,690 --> 00:06:21,270
In the next video, we'll start to look at the grid system.