1
00:00:00,330 --> 00:00:01,170
‫Welcome back.

2
00:00:01,200 --> 00:00:08,070
‫In this video, we are going to have a closer look at zemo and you might want to example is zemo is

3
00:00:08,100 --> 00:00:12,270
‫a type of XML language, as you can see here at the bottom.

4
00:00:12,270 --> 00:00:15,500
‫And actually I'm going to drag it even further.

5
00:00:15,510 --> 00:00:23,250
‫So an example allows us to write our UI, so we don't need to go ahead and drag all the elements into

6
00:00:23,250 --> 00:00:26,370
‫our UI and then adjust it in there.

7
00:00:26,370 --> 00:00:28,050
‫We can do all of that in code.

8
00:00:28,080 --> 00:00:30,680
‫Now you might say, Oh, I'm more of a visual guy.

9
00:00:30,690 --> 00:00:34,030
‫I want to go ahead and drag the things in and I'm fine with that.

10
00:00:34,050 --> 00:00:38,610
‫Well, you can do that, but you are limited to just dragging around then.

11
00:00:38,610 --> 00:00:45,690
‫And with example, you can adjust a lot and you can adjust not only those things like this wrapping

12
00:00:45,690 --> 00:00:51,690
‫that you have seen in the last video, you can do a lot more and we will see what data binding is,

13
00:00:51,690 --> 00:00:58,290
‫what properties are, dependency properties and so forth are which are things that you can do with example

14
00:00:58,290 --> 00:01:02,940
‫which allow us to create very great user interfaces which are easily maintainable.

15
00:01:02,970 --> 00:01:07,410
‫So and here what you can see is this window, first of all.

16
00:01:07,410 --> 00:01:12,960
‫So pretty much generally what you have is you have an opening tag and you have a closing tag.

17
00:01:12,990 --> 00:01:17,490
‫If you know HTML, then you might well be familiar with that.

18
00:01:17,490 --> 00:01:21,960
‫You have the corner braces and you have them closing as well.

19
00:01:21,960 --> 00:01:26,250
‫So less than sign the word and then greater than sign.

20
00:01:26,250 --> 00:01:30,510
‫And you see we have the same thing with the window and here as well.

21
00:01:30,510 --> 00:01:34,020
‫Then one closing, you also have the slash just before the word.

22
00:01:34,020 --> 00:01:37,860
‫So this is the same for grid, for window for anything else.

23
00:01:37,860 --> 00:01:42,060
‫So if I want, for example, to use a button, I can go ahead and do that.

24
00:01:42,060 --> 00:01:47,940
‫And if I use the greater than sign, it automatically creates the closing tag.

25
00:01:48,180 --> 00:01:55,080
‫Now what I can do is I can do all the adjustments inside of the opening tag, as you can see here,

26
00:01:55,080 --> 00:01:58,890
‫button, I can go ahead and for example, add content to it.

27
00:01:58,890 --> 00:02:01,740
‫So there are many different properties as you can see.

28
00:02:01,740 --> 00:02:07,080
‫And I'm just going to use the content property and I'm just going to use something like Click Me.

29
00:02:07,650 --> 00:02:11,850
‫Now there is this button in the center, as you can see, and it says, Click me.

30
00:02:12,090 --> 00:02:15,810
‫Of course we don't have a height, we don't have a width.

31
00:02:15,810 --> 00:02:18,720
‫All those kind of properties are not said yet.

32
00:02:18,720 --> 00:02:27,810
‫But let's say I want this button to be 50 pixels high and then I want it to be 100 pixels wide, as

33
00:02:27,810 --> 00:02:28,200
‫you can see.

34
00:02:28,200 --> 00:02:30,570
‫Now, this is my button that I have created.

35
00:02:30,810 --> 00:02:35,250
‫Of course I could have dragged it in, but doing it an example is quite useful.

36
00:02:35,730 --> 00:02:37,320
‫And now what?

37
00:02:37,330 --> 00:02:39,420
‫Something that I haven't touched on too much yet.

38
00:02:39,420 --> 00:02:43,710
‫And which is not going to be required until later in the course.

39
00:02:43,710 --> 00:02:48,080
‫But generally what you can see here are X and L and S.

40
00:02:48,090 --> 00:02:58,410
‫What that stands for is for XML namespace and XAML stands for Extensible Application Markup Language.

41
00:02:58,410 --> 00:03:01,560
‫So let me add that in here.

42
00:03:02,190 --> 00:03:03,510
‫Let's add a comment.

43
00:03:03,780 --> 00:03:07,110
‫I'm going to use a comment like that.

44
00:03:07,110 --> 00:03:11,610
‫As you can see, this is green now and this is pretty much a comment.

45
00:03:11,610 --> 00:03:18,540
‫So I can write something in here, such as XAML is an extensible

46
00:03:20,640 --> 00:03:24,210
‫application markup language.

47
00:03:25,950 --> 00:03:26,540
‫All right.

48
00:03:26,550 --> 00:03:29,520
‫Now the button, as you can see, is in here.

49
00:03:29,520 --> 00:03:33,630
‫And now let's go ahead and do some more things with buttons.

50
00:03:33,630 --> 00:03:36,570
‫So let's create some additional buttons.

51
00:03:36,570 --> 00:03:39,180
‫Please go ahead and create another button.

52
00:03:41,240 --> 00:03:41,600
‫Okay.

53
00:03:41,630 --> 00:03:42,770
‫I hope you tried it.

54
00:03:42,800 --> 00:03:51,260
‫Simply use the button name here or the keyword, and then go ahead and create the additional button.

55
00:03:51,290 --> 00:03:55,060
‫Now, you might wonder, oh --, it's not positioning correctly.

56
00:03:55,070 --> 00:04:00,250
‫So I have this button and it has the content with.

57
00:04:00,260 --> 00:04:01,250
‫Hi there.

58
00:04:02,720 --> 00:04:03,920
‫So now why?

59
00:04:03,920 --> 00:04:06,380
‫Where is this click me button now?

60
00:04:06,410 --> 00:04:13,670
‫Well, it's within the grid and it disappeared because we are using a grid so the buttons don't appear

61
00:04:13,670 --> 00:04:15,650
‫on top of each other and so forth.

62
00:04:15,680 --> 00:04:20,530
‫So if you tried that, you have seen it and we will look into grids later on as well.

63
00:04:20,540 --> 00:04:22,970
‫But I just wanted to show you that for now.

64
00:04:23,240 --> 00:04:23,630
‫All right.

65
00:04:23,630 --> 00:04:25,470
‫So let's get rid of that button again.

66
00:04:25,520 --> 00:04:31,220
‫Now we have this click me button and let's just run the application so we can see how it actually looks

67
00:04:31,220 --> 00:04:38,780
‫in real life and how this whole thing can make our life beautiful by just clicking on it.

68
00:04:38,780 --> 00:04:43,910
‫So as you can see, I can hover over it and it changes its colour and I can click on it and it makes

69
00:04:43,910 --> 00:04:47,870
‫this little click animation and that's it.

70
00:04:47,870 --> 00:04:52,400
‫But nothing happens when you click it and there are multiple ways to implement a click functionality

71
00:04:52,400 --> 00:04:54,140
‫and we will do that later on.

72
00:04:54,470 --> 00:04:54,800
‫All right.

73
00:04:54,800 --> 00:04:59,030
‫So that's how we can create a button, in example.

74
00:04:59,990 --> 00:05:05,660
‫Now, there are plenty of additional elements that we can access here or properties.

75
00:05:05,660 --> 00:05:12,410
‫For example, we can access the font size property and increase the font size to, let's say, 32.

76
00:05:12,770 --> 00:05:19,400
‫So now the button is not as wide as the text, so let's adjust the width.

77
00:05:19,400 --> 00:05:23,090
‫So now it's fine again, we can see the whole text of the button.

78
00:05:23,090 --> 00:05:28,670
‫But when you play around with font size and all those elements, you have to be careful that it still

79
00:05:28,670 --> 00:05:29,450
‫fits in.

80
00:05:30,320 --> 00:05:38,480
‫Now what you also can do is you can, instead of adding the content in here to the content property,

81
00:05:38,510 --> 00:05:42,740
‫you can simply add it within the button tags.

82
00:05:43,220 --> 00:05:49,790
‫So in here I'm going to say something like Click Meet, and as you can see, it's there.

83
00:05:49,790 --> 00:05:54,340
‫So this is the content in between the tags is where you have your content.

84
00:05:54,350 --> 00:05:55,960
‫So that's one way of doing it.

85
00:05:55,970 --> 00:06:04,550
‫The other one is to simply use the content property here and assign the text like this, as we have

86
00:06:04,550 --> 00:06:05,360
‫seen before.

87
00:06:05,600 --> 00:06:13,850
‫Now this closing tag button is not required if you simply close the button straight away like this so

88
00:06:13,850 --> 00:06:17,450
‫you can close it in a shorter manner like that.

89
00:06:17,450 --> 00:06:19,670
‫So you don't need the closing tag button.

90
00:06:19,670 --> 00:06:23,900
‫And another way of designing a button is the following.

91
00:06:23,900 --> 00:06:26,990
‫So if you see something like that, that's totally fine as well.

92
00:06:26,990 --> 00:06:36,200
‫So you create the button, tag, the closing and the opening one, and in here you have button dot and

93
00:06:36,200 --> 00:06:40,150
‫then you can go ahead and adjust all the different properties that you want.

94
00:06:40,160 --> 00:06:44,870
‫So as you can see, there are many different properties that we can access, for example, the font

95
00:06:44,870 --> 00:06:46,940
‫size like that.

96
00:06:46,940 --> 00:06:52,220
‫So I can set the font size to 72 like that, for example.

97
00:06:53,920 --> 00:07:00,550
‫And another button property that I want to adjust is, let's say, the content.

98
00:07:00,790 --> 00:07:05,290
‫So I can go ahead and just the content to hide there.

99
00:07:06,010 --> 00:07:12,610
‫So now you see there is this huge button with a font size of 72 and it's it says Hi there.

100
00:07:13,420 --> 00:07:15,070
‫So that's approach number two.

101
00:07:15,070 --> 00:07:18,980
‫And there is even something else that you can do.

102
00:07:19,000 --> 00:07:22,130
‫So let's adjust that button even further.

103
00:07:22,150 --> 00:07:27,880
‫So let's say as the content, I don't want to have just a text of Hi there.

104
00:07:27,910 --> 00:07:29,530
‫I want to go even further.

105
00:07:29,530 --> 00:07:33,190
‫I want to add a rep panel.

106
00:07:33,790 --> 00:07:41,590
‫Now, what a rep panel does is it simply reps all of its controls or elements next to each other going

107
00:07:41,590 --> 00:07:42,690
‫from left to right.

108
00:07:42,700 --> 00:07:45,700
‫So the first element is going to be, let's say, a text block.

109
00:07:45,700 --> 00:07:47,380
‫And we have seen what text blocks are they?

110
00:07:47,380 --> 00:07:51,040
‫A simple text and this one is going to say multi.

111
00:07:52,060 --> 00:07:55,690
‫Now I need another text block and a third one.

112
00:07:55,690 --> 00:07:57,790
‫So now it says multi three times.

113
00:07:57,790 --> 00:08:06,700
‫But now what I can do is I can adjust the color of every single aspect so or every single text block.

114
00:08:06,700 --> 00:08:13,930
‫So let's say I change that to blue, then this has the foreground.

115
00:08:13,930 --> 00:08:18,760
‫So foreground is the color to foreground color, and this one will be red.

116
00:08:19,540 --> 00:08:26,920
‫And finally, my last text block will have the foreground of white.

117
00:08:29,130 --> 00:08:34,590
‫And now instead of multi, multi, multi, it says multi color button.

118
00:08:38,670 --> 00:08:42,240
‫And now maybe we want to adjust the font size a little.

119
00:08:42,270 --> 00:08:43,560
‫Let's make it smaller.

120
00:08:43,680 --> 00:08:49,050
‫Also, the first button, as you can see, it's hidden because the grid only displays the last element.

121
00:08:49,500 --> 00:08:55,830
‫If they're if they are not assigned in the right grid structure, which we will see later on, but let's

122
00:08:55,830 --> 00:08:57,630
‫get rid of the first button that we had.

123
00:08:57,840 --> 00:09:02,400
‫And now let's also set a button size.

124
00:09:02,880 --> 00:09:12,840
‫So let's go ahead and use button dot width, which will be, let's say 200.

125
00:09:14,280 --> 00:09:22,080
‫And a button that height, which will be 100.

126
00:09:26,330 --> 00:09:27,380
‫And like that.

127
00:09:27,980 --> 00:09:29,000
‫So there we are.

128
00:09:29,090 --> 00:09:32,260
‫And the font size is too big to fit everything in.

129
00:09:32,270 --> 00:09:37,920
‫So if we go ahead and do that with 24, now it's in there.

130
00:09:37,940 --> 00:09:45,230
‫So if I run the code, I'll have a multicolor button which has multiple different text blocks in it.

131
00:09:46,330 --> 00:09:47,260
‫And there we are.

132
00:09:47,590 --> 00:09:50,950
‫So just so you see, there are multiple different approaches of doing it.

133
00:09:50,950 --> 00:09:57,010
‫If you want to wrap multiple aspects into it, then you can use this rep panel.

134
00:09:57,010 --> 00:10:04,090
‫You could even use a grid within the button and use the grid tag in order to create multiple different,

135
00:10:04,090 --> 00:10:07,600
‫different controls inside of your button.

136
00:10:07,600 --> 00:10:09,910
‫But that's something that we will cover later on.

137
00:10:09,940 --> 00:10:12,550
‫For now, it's just important for you to understand.

138
00:10:12,550 --> 00:10:19,660
‫That example allows you to do plenty of fancy stuff with your goal without having to drag and drop,

139
00:10:19,660 --> 00:10:24,100
‫and also with full control over how things look and what they do.

140
00:10:25,300 --> 00:10:32,890
‫Now, what I'm going to do is I'm going to comment that out and I'm going to show you how to do the

141
00:10:32,890 --> 00:10:38,590
‫same thing as we have seen here with code, because we've seen it with example code, but we can also

142
00:10:38,590 --> 00:10:45,040
‫do it in code behind, which means in C sharp, which we pretty much learned for the whole class so

143
00:10:45,040 --> 00:10:46,570
‫far or for the whole course.

144
00:10:46,570 --> 00:10:49,120
‫So let's go into the code behind.

145
00:10:49,120 --> 00:10:54,790
‫As you can see, there is a dot example file which is the one that we have opened here, the main window

146
00:10:54,790 --> 00:11:03,040
‫that XML and every example file has a code behind file which is a dot example dot CSS file and this

147
00:11:03,040 --> 00:11:10,300
‫one is a C-sharp file, which means we have a C sharp partial class in here which we can now use in

148
00:11:10,300 --> 00:11:13,300
‫order to adjust or create our UI.

149
00:11:13,480 --> 00:11:18,340
‫And as you can see, it's called Main Window and it inherits from window.

150
00:11:19,030 --> 00:11:25,660
‫And in here we have a method called Main Window, which is similar to the main method in our console

151
00:11:25,660 --> 00:11:27,400
‫applications that we have seen so far.

152
00:11:27,400 --> 00:11:32,500
‫This one is called as soon as the window is open or as soon as the application is started.

153
00:11:32,500 --> 00:11:38,860
‫And as you can see here, there is initialize component called which simply initializes everything else

154
00:11:38,860 --> 00:11:41,620
‫which is required for our window to run.

155
00:11:41,620 --> 00:11:47,920
‫For example, it's initializes this title and it's initializes the size and so forth.

156
00:11:47,920 --> 00:11:51,520
‫And now we can go ahead and write our own code in here.

157
00:11:51,550 --> 00:11:54,370
‫So I'm going to show you how to create a button first.

158
00:11:54,430 --> 00:11:58,780
‫So first of all, we need a grid in which we can assign that button.

159
00:11:59,170 --> 00:12:04,330
‫So I'm going to call it grid, which is a new grid.

160
00:12:04,330 --> 00:12:15,400
‫Then I set the content of this to my grid that will do as I simply say, the main window.

161
00:12:15,490 --> 00:12:19,060
‫It should have some content, right, as we have seen in the example file.

162
00:12:19,060 --> 00:12:29,380
‫So window this tag here opens and everything that is between those opening and closing tags is my so

163
00:12:29,380 --> 00:12:31,090
‫pretty much this whole content here.

164
00:12:31,090 --> 00:12:33,370
‫This is the content of my window.

165
00:12:34,230 --> 00:12:38,010
‫And what I say here is this dot content should be the grid.

166
00:12:38,010 --> 00:12:40,940
‫So we create a new grid as we have seen here.

167
00:12:40,950 --> 00:12:46,740
‫So we have a grid here as well, which is a opening and closing tag of the grid here and now.

168
00:12:46,740 --> 00:12:51,030
‫I set that as its content and now I can add stuff to this grid.

169
00:12:51,030 --> 00:12:53,460
‫For example, I can add a button to the grid.

170
00:12:53,610 --> 00:12:59,490
‫First of all, let's create that button and I'm going to call it BTN is going to be a new button.

171
00:13:01,440 --> 00:13:04,890
‫Now I have that button and I can adjust its properties.

172
00:13:04,890 --> 00:13:10,320
‫So let's say I want to set the font size of my button and I can simply do that way.

173
00:13:10,320 --> 00:13:13,170
‫I can simply say it's going to be something like 26.

174
00:13:13,830 --> 00:13:22,500
‫Now in our button, as you have seen here, we had a wrap panel, which is the content of the button.

175
00:13:22,710 --> 00:13:26,190
‫So what I'm going to do is I'm going to create a wrap panel.

176
00:13:26,880 --> 00:13:37,050
‫Wrap panel and I'm going to call it wrap panel is going to be a new wrap panel.

177
00:13:37,110 --> 00:13:39,720
‫Now, we can add things to the wrap panel.

178
00:13:39,720 --> 00:13:44,580
‫We add the wrap panel to the button and we add the bat button to the grid.

179
00:13:44,580 --> 00:13:46,920
‫And the grid is already part of our content.

180
00:13:46,920 --> 00:13:52,920
‫So now let's go ahead and create all the stuff that we want to add to the wrap panel and add it to that.

181
00:13:52,920 --> 00:13:54,960
‫So we need a text block first.

182
00:13:55,740 --> 00:14:00,300
‫And the text block, as you have seen here, is this one here.

183
00:14:00,300 --> 00:14:03,780
‫So we create 1 to 3 text blocks.

184
00:14:05,630 --> 00:14:16,190
‫The first one is going to be t t is going to be new text block and I simply say t t dot text.

185
00:14:17,720 --> 00:14:23,540
‫So it has a text property, this text here, which is the content.

186
00:14:23,540 --> 00:14:30,290
‫So for the button, the content is called content and for the text block, the text itself is called

187
00:14:30,290 --> 00:14:30,920
‫text.

188
00:14:31,010 --> 00:14:44,480
‫So we access the text property of our text block and we set that to multi then next we set the color.

189
00:14:44,480 --> 00:14:58,670
‫So text dot foreground is going to be brushes thought and which color did I have first for the multi

190
00:14:58,910 --> 00:14:59,780
‫it was blue.

191
00:15:00,260 --> 00:15:08,210
‫All right so I'm going to make that blue and as you can see, brushes well text is done with brushes,

192
00:15:08,210 --> 00:15:11,210
‫so the color of text is done with the brushes class.

193
00:15:11,210 --> 00:15:16,010
‫So I need to use this brush as class and then access it's color.

194
00:15:16,010 --> 00:15:19,160
‫So solid color brush of type brushes.

195
00:15:19,670 --> 00:15:24,710
‫And next I can add that to the wrap panel.

196
00:15:25,370 --> 00:15:30,530
‫So now that I have the text, I can add it to the wrap panel and I do that by accessing as children

197
00:15:30,530 --> 00:15:32,810
‫and adding my text to it.

198
00:15:34,280 --> 00:15:41,540
‫So that's how I add one text block and if we would run that nothing, we wouldn't see anything yet because

199
00:15:41,540 --> 00:15:45,080
‫we didn't add the red panel to the button yet and neither the button to the grid.

200
00:15:45,080 --> 00:15:46,160
‫But we will do that in a second.

201
00:15:46,160 --> 00:15:54,380
‫So let's go ahead and adjust the text or actually adjust those three pieces again.

202
00:15:54,380 --> 00:16:02,570
‫So what we do is next we adjust the text to multi color and the last one was button and now we had the

203
00:16:02,570 --> 00:16:05,660
‫color red and we had the color white.

204
00:16:08,660 --> 00:16:12,470
‫So I just copied and pasted those three lines because they are the same.

205
00:16:12,470 --> 00:16:17,930
‫I don't need to create a new text block every time I just add the old one and then I adjust it.

206
00:16:18,870 --> 00:16:20,400
‫Or adjust its values.

207
00:16:20,400 --> 00:16:22,260
‫And then I add it again to the ref panel.

208
00:16:22,270 --> 00:16:29,040
‫So now those three texts in my rep panel and what I can do now is I can add the rep panel.

209
00:16:30,380 --> 00:16:31,250
‫To my button.

210
00:16:31,250 --> 00:16:35,330
‫So button that content is going to be my wrap panel.

211
00:16:36,710 --> 00:16:40,990
‫And finally grid dot children dot add.

212
00:16:41,570 --> 00:16:43,190
‫And in here I add my button.

213
00:16:44,330 --> 00:16:45,710
‫So that's what I was talking about.

214
00:16:45,710 --> 00:16:49,070
‫So we have the grid, we have the button, we have the wrap panel.

215
00:16:49,070 --> 00:16:51,440
‫And now we add those text to the red panel.

216
00:16:51,440 --> 00:16:58,400
‫We add the red panel to the button, we add the button to the grid, and we added the grid to the window.

217
00:16:58,910 --> 00:17:01,280
‫And as you can see, this is how you can do it with code.

218
00:17:01,280 --> 00:17:07,940
‫And before we run the code, what I need to do is actually to comment the grid out as well.

219
00:17:08,180 --> 00:17:09,950
‫So I.

220
00:17:11,570 --> 00:17:13,670
‫Actually can only have the window.

221
00:17:13,670 --> 00:17:16,010
‫So there's only the window in our main window.

222
00:17:16,020 --> 00:17:24,080
‫The XML file and all the other code is within our main windowed to zamalek's, which is the code behind.

223
00:17:24,080 --> 00:17:28,300
‫So this file is the code behind of our main window XAML.

224
00:17:29,750 --> 00:17:37,850
‫Now there is one thing missing before we test that, and that is that I assign a new text block to my

225
00:17:37,850 --> 00:17:38,450
‫text.

226
00:17:38,780 --> 00:17:43,540
‫So I need to do that for both of my texts.

227
00:17:43,550 --> 00:17:48,830
‫So the thing is that we well, we created text here and we initialize it with the new text block and

228
00:17:48,830 --> 00:17:55,460
‫now we need to create a new text block and assign it to our text before we can add that to our wrap

229
00:17:55,460 --> 00:17:56,280
‫panel.

230
00:17:56,300 --> 00:17:59,840
‫So now we have that, we can run the code.

231
00:18:02,780 --> 00:18:06,710
‫And we will see that we also have our multicolor button.

232
00:18:06,710 --> 00:18:13,010
‫And as you can see, we have done the same thing that we have done before with Zemo, which was this

233
00:18:13,010 --> 00:18:16,400
‫here, which also looks pretty simple and neat.

234
00:18:16,430 --> 00:18:20,330
‫We did it with C-sharp code like that.

235
00:18:20,750 --> 00:18:25,970
‫Now you can go the way you prefer, but we will mainly work with the zemo.

236
00:18:26,000 --> 00:18:32,210
‫I just wanted to show you that you can whatever you do with XAML, you can do with code behind as well,

237
00:18:32,210 --> 00:18:35,240
‫but sometimes it makes a lot more sense to use code behind.

238
00:18:35,240 --> 00:18:40,430
‫So for example, if you want to adjust something dynamically, then code behind makes more sense.

239
00:18:40,430 --> 00:18:47,660
‫So running it with C sharp or making the adjustments with C-sharp and the Zemo makes more sense when

240
00:18:47,660 --> 00:18:50,810
‫you have static user interfaces.

241
00:18:51,710 --> 00:18:59,960
‫And by the way, whenever you create this XAML file like we have here, what it does is it goes ahead

242
00:18:59,960 --> 00:19:03,500
‫and creates this code behind file.

243
00:19:03,650 --> 00:19:09,390
‫So it simply creates this code and runs it once the application starts to run.

244
00:19:09,410 --> 00:19:11,220
‫Once our main window is called.

245
00:19:11,240 --> 00:19:12,980
‫So it's done anyways.

246
00:19:13,070 --> 00:19:19,440
‫And we do it like that with XAML, or we do it manually by creating the code.

247
00:19:19,460 --> 00:19:25,400
‫So now you could of course argue, hey, there is something like this width and the side which you haven't

248
00:19:25,400 --> 00:19:25,750
‫set.

249
00:19:25,760 --> 00:19:27,740
‫Well, I can do that very easily here.

250
00:19:27,740 --> 00:19:38,600
‫I could simply say button that width and I could set that to 150 and button that height and set it to

251
00:19:38,600 --> 00:19:40,310
‫100, for example.

252
00:19:40,510 --> 00:19:43,310
‫Then the button will be adjusted accordingly.

253
00:19:44,340 --> 00:19:47,280
‫And as you can see now, it's spread over two lines.

254
00:19:47,700 --> 00:19:48,370
‫All righty.

255
00:19:48,390 --> 00:19:53,030
‫So that's Zemo and the code behind with code.

256
00:19:53,040 --> 00:20:00,450
‫I know it was a long video, but we are going to see even more fancy cool WPF things in the next video.

257
00:20:00,450 --> 00:20:01,590
‫So see you there.