High students in D.C. it's going to actually go ahead and create app number 10.
So I just want to actually update the original tutorials that we have inside the Android course.
So let's go ahead and create a new Android studio projects or just click on Start in your Android studio
project and the application name is going to be app number 10.
You can name it whatever you want.
And then you can specify the company domain package name and the product location services next and
that here for the minimum allocate who's AP 16 Android 4.1 Jelly Bean for phones and tablets.
So this really connects and he has two basic activity next.
And here you can specify activity namely the name title and the menu resource name.
So I suggest that you actually don't change these settings here.
These names and then just click on finish.
So let's wait a little bit here.
So now as you can see here I've got these errors
on as you can see the problems are now actually solved.
I just need to wait a little bit here so that they are rendering problems are actually disappeared.
But if you are encountering these problems you just need to click on built at the top and then and then
click on rebuild the project.
And if the problem is not solved if the errors actually appear here you just need to close the Android
Studia completely and then open it again.
And if the problem is not solved again you just need to create another android studio project and name
it of it or other after the names don't use the same name that you are using here for your project name.
So now that now that we have this lay out here as you can see in the left folder we have two exemplifies
the first one is activity underlaid minute segment here and the second one is content under light minute
segment.
So inside is activity underlying adicts them in here we just we can just delete these floating action
buttons so just select select this faluting action button here and then press and delete key on your
keyboard.
But here we cannot delete this hello world view.
And we cannot also design the user interface yet in order to design the user interface.
We just need to double click on this content underlying mental image here.
So let's close this activity underlaid minute example and let's say like this Hello world takes view
and then present it here on your keyboard.
So now let's design the user interface of our application.
So first of all I want to actually change the layout here.
The main layout that we have here inside the screen.
So at the bottom you can see this text tab here right.
So just click on it and here you can see the actually the example code of our design.
So let me actually DoubleClick and this tap here content under a limited example.
In order to actually make this area wider and here at the right hand side you can see this preview.
So now we can see this preview let me actually make it a little bit smaller here.
So now as you can see we have a relatively out I don't want relatively.
I want to change it to linearly out so just select is relatively out here and just type in here linearly
with capital L.
So as you can see the auto complete feature of Android studio is helping us to choose this linearly
out here.
So just select it and then present it on your keyboard.
So now this layout is actually changed to linearly out right instead of relatively out but still we
have a problem and the problem is actually about the orientation of it linearly out.
So because we have a linear leave out we actually need to specify the orientation of our linearly out.
So let's add an attribute to this linearly out here.
So after these padding top here or after this find or attribute this one and before the ending Heike
of these linearly out here I going to just type in here orientation and the autocomplete feature is
helping me to choose this option and that person and tell on your keyboard.
So now we have two options horizontal or vertical which was vertical and horizontal on your keyboard.
So now the error is gone and the orientation of our linear layout is now vertical and this means that
the user interface components are going to be positioned below each other.
OK vertically.
So at the bottom just click on this design tab.
So now let's design our linearly out here.
So now let me actually make this idea a little bit wider so that you can see that.
Now we changed they're relatively old too linearly.
Here inside is componentry section you can see that here and now.
So let's actually drag our linearly out horizontally into this linearly outward ticket.
So inside this pallet section this actually serves four layouts so we can see these layouts for there.
And now let's actually select this linearly horizontal and now just drag this linearly out horizontal
into our linearly out vertical here.
As you can see we can see these aren't colors here.
So now I am inside Iselin nearly Athletica right and now just release it.
So here we actually released our linearly authorities onto it.
So now you want to change the attributes of this linearly out horizontal.
So just select it linearly horizontally inside is componentry section here and here inside these are
properties section.
Now I can change the layout Viets right.
So you want to lay out weeds to match parent and match Penates means that it's going to actually take
the entire space here the entire way that we have say the parent but you can see these spaces here these
distances between these linearly and horizontal and the linearly and vertical hit.
And this is because of the padding attribute that is set for this linearly out where's the car.
So at that point if I actually click on this text up here you can see that it is linearly out vertical
here has these attributes here these padding attributes padded top padding top padding left padding
right padding on top and you can see that the padding is 16 DP for all the directions.
So that's why you can see these distances these spaces here between these linearly as horizontal and
patently out.
So in say the componentry section you can see that we have the parot lay out which is these contents
maynt are linearly out vertical and we have a child out.
Why.
Because this linearly out horizontal that we dragged to this linearly or vertical is going to be a child
of these linearly out vertical here.
So now when I actually say that the layout of this linearly out horizontal is actually match parent.
This means that it's going to take actually the entire seat of the parent but not including DS or paddings
because that is actually a pattern here.
So it's not if we are not allowed to actually take these spaces here.
So we have to match parent here but now for the length of height I want to actually assign the value
or wrap content.
So as you can see this is now match parent and it's going to actually take the entire height of the
parent.
Here you can see but I don't want this or you want to set the height to be wrapped content and that
content means that that height is going to be determined according to the height of the content that
we actually put inside this linearly or horizontal.
So if we actually set up content for the lay out height here inside this property section for the day
and height just say in here wrap content and then press that on your keyboard.
Or you can just click on this little button here and change these attributes match panel or the content.
And now we can see that we have this layout height it is now set to that content so you can see only
a line here because we don't have any components inside linearly or horizontal.
You can see that content here attribute is set for this layer on top and we can't see any other components
inside these linearly or horizontal.
So let's actually put some user interface components into this linearly and horizontally.
So let's see how we can do that.
First of all I want to drag our text view into this linearly and hold on to it here.
So again inside this palette section and you can see that we have these widgets for them right.
So just selectees takes a view here and just you can drag it into this linearly and these are two.
And it is going to be very hard in order to put it here inside these linear thought is on top.
So I can put it put it here I want to put this text view in say this linearly or horizontal right.
You can't put it here or the easiest way is just drag it here into this componentry section and just
put it inside is linearly out horizontally.
And then you can see this little triangle here that is actually pointing to this linearly.
What is that all these black little triangle.
And here you just need to really see it.
So now this linearly out horizontal has a new component text view.
So if I open this linearly and horizontal we can see the states view here but you can see that the layout
width of the pix view is actually Lappe content right at the height of this text view is also the content.
So I want to change this value.
I want to say that the layout of the text you're going to be counted I think rap counted is good for
the lay out of it.
OK so now let's add some more user interface components into this linearly and horizontal.
So again inside this pallet section let's actually track an order.
It takes you into these linearly or horizontal here.
So again selectees takes view here and just straight here into this componentry section and go and just
hold it over this linearly and horizontally just put it inside it's linearly or horizontal or you can
actually just put it here below this takes you that is actually the inside of this linearly Alto these
are two because I want to put this text view beside this of first takes that we have here.
So just release here and now you can see that this section takes view is actually inside is linearly
out horizontal.
And it is actually on the right hand side of this first x view.
So selectees takes you to here and now again you can see that the layout of it is actually wrapped content
and the layout height is up content.
So it is good for now.
Let's add an image you into this linearly on horizontal.
Right.
So now again Enceladus widgets for let's search for image.
So you can not see this image view here.
So in order to find the image you just need to scroll down here and you can see these images and media
there.
So we have this image viewer component here.
So just select it and you can actually just drag it into this a componentry section and you can either
just really sit here inside this linearly or horizontally and you or you can just put it here below.
This takes you number two takes you two and then release it.
So now it's going to actually open this window here for us and we must actually specify a placeholder
for our image.
So let's select this I still Lanter here.
And then just click on OK.
So now here we have this linear horizontal.
And inside this linearly or horizontally we have this text view and text you too.
And this image you write.
So let's position these user interface components inside this linear they are horizontally.
So now selectees takes you here.
This first takes you so for the left feet I think rap content is good.
So now you can see that the layout with the out height is actually good.
Both of them is ALAP content.
So we don't have to change these properties for this takes view and let's select selectees takes view
here again it is good for now.
But let's actually select this image view here.
The layout is the content and the layout height is the content so I don't want to disrupt content here.
If you were to hard code the values for this lay out and the length height so I'd want 50 DP for the
out of this image view and I want 50 DP for the length height of this image view and the person interchangeable
keyboard.
So 50 dpi for the outfit and 50 definitely at height.
So now let's select this takes view here and now for the layout let's assign the value 0.
Don't change the layout height only the layout of it is 0 8 0 DP.
And now let's actually find the vate attribute of this takes.
Also at the bottom it says Click View all properties.
So just click on it.
Now let's search for the vate attribute as you can see we have this layout.
Wait.
Right.
So for the layout of it as you can see it is now one.
Let's change it to 100.
So now you can see what does this mean 101.
Means what ever.
Space remains between this view and this takes you is going to be allocated only for this.
That takes you view here.
Right.
So are you actually not is here for the layout we are assigned to values zero of this for this takes
you here right.
But for the layout of 8 I'd assign the value 100 and 100 means that take what ever we at that is actually
here that is remaind between these two components.
This takes you and this image for you so you can see that the stage is here and this image view is is
here.
So let's select this text view here.
This first text view.
And now I want to change the text of this text view.
So for the text of this dispute Let's step in here.
Number one colon and then person enter key on your keyboard.
And we have these takes.
Here.
Let's delete the text of the state's view.
So select is text attribute here and then just delete this value and then press enter key on your keyboard.
And we have also this image viewer so 50 dpi for the layout tweets and fifty dpi for the length height.
So we're going to actually add images to this application in a moment.
Don't forget about that.
But let's selectees takes you here this number one text view.
And now let's increase the front of this.
It takes you here the text of this text.
You scroll down here and find the text font attributes here.
So let's actually find it take actually the text size.
So I want to increase the text size of this text view.
So let's change it to 24.
Espie I think now it's good.
And now I can actually just put it here and we have this text view.
You can also increase the text size of the states.
So let's scroll down here and let's find the text size attributes here and you can actually change it
to for example 18 s.p.
So this is going to be the text size of this text view.
And now let's specify the ID for these user interface components.
So let's select this number of on text view here and just scroll to the top and you can see this ID
attribute here.
But let me tell you that we don't have to actually assign an ID to this view because we are not going
to actually interact with this text view from our Java code.
So we do not have to specify an ID for the through.
So let's second this second takes few here takes you through and let's find the idea attribute so because
I am going to interact with this takes you from our Java code.
I am going to specify an ID for this takes you here.
So here he is the number one as the id of this takes you right.
And now let's actually specify an ID for this image view.
So let's select this image view and then here for the ID just tape it here I m g dice I m g Theiss number
1.
So this is going to be the ID of this image of you here.
Right.
And then person enter key on your keyboard.
So you specify an ID for this takes you x number one.
And this I named the dice number one.
So now we need to actually add an orderly nearly horizontal into our linearly out vertical.
So let's close this linearly out horizontally here inside this componentry section.
And now let's actually scroll to the top here.
I think let's actually find out for that here and let's select this linearly or horizontally again and
drag it here into this linear layout vertical and below this linearly or horizontally that we put here.
So just release it here inside is linearly aesthetical and again you can see that they lay out which
is mass parent and the height is much apparent for this linearly or horizontal.
So let's change them for the layout which is much permanent.
It is OK it is good but for the last height assigned a value map content.
Right.
And now let's actually write a text view into this linearly out horizontally.
So inside this palette section and inside these widgets folder here just select this text view and just
drag it here into this componentry section and just put it here.
So this section linearly or holding on to that we have here.
Right.
And then release it and it's open this linearly and horizontal.
So just select this text view here inside linearly at heart isn't all.
So we don't have to actually specify an ID for this text view because you're not going to interact with
the states we're here but our forta actually text attribute let's find the text attribute here inside
this property section and just type in here.
Number two for the text column and that person into on your keyboard.
So now let's increase the font size of this text view the text of this takes you actually so let's scroll
down here inside this peper property section and you can see this text size attribute here.
So just click on it and just select 24 espie for the text slice here of this number to text view.
Now you can see that lay out.
And then the height is ALAP content.
This is very important.
And now let's actually track another takes you into this linearly are these are also inside these widgets
folder.
Select is Tayseer here and just put it here inside this linearly or horizontal and below this takes
you here right.
And then really sit selectees takes you here.
And for the ID just select this ID attribute this text view for the idea you're.
Here he asks the number two.
And then for a slant enter on your keyboard.
So this is the idea of the state's view.
So for the text list actually deletes the text of this text view.
Let's find the text size attribute of the state's view.
So here for the text size attribute just select 18 Espey.
And now for the lay out which of these takes you assign the value zero.
This is very important to zero.
DP person and that person entered on your keyboard for the tweet and we have this lay out what lay out
wait attribute.
So for the lives of fate assigned a value of 100 DP and then person enter on your keyboard.
Right.
So it's going to actually take the entire space that is actually left up here between this number two
and the image that you're going to put here.
So now let's actually again go inside this pallet section and now let's actually find these images and
media and select this image here just select it and track it here into this linearly out horizontal
and below.
This takes the number two and don't release it.
So now you need to specify an image Holder actually to select this icy Lanter here and then press on.
OK here and then click on OK.
So now we have this image view here.
Right.
So to select this image view and for the ID for the ID attribute just type in here I am g is number
two and then present enter key on your keyboard.
And now for the layout of each of this image you've just assigned a value of 50 DP and then press an
interview on your keyboard.
And for the layout height of this image view here just assigned a value of 50 DP and then person entelechy
on your keyboard.
Right so now as you can see these components are not positioned correctly.
This takes the number two takes is not taking the entire space that is actually the between this number
two and this imagery.
So what's the problem.
So in order to solve this problem selectees takes the number two.
And let's actually look at the late lay out which as you can see it is now raw content.
So we actually must change this content to zero and in person and to you on your keyboard and the lay
out rate is one hundred DP So I mistakenly used this DP here.
So for the lay out weight we are not allowed to use Actually the DP here.
So let's actually delete this DP So I mistakenly put this DP here.
So that was the source of the problem right.
And then again just one hundred and then person interview on your keyboard.
And now as you can see the problem is solved right.
So the problem was that deep that we actually specified for the lay out rate actually.
So they lay out with zero ATP and the lay out with a 100 so nice can actually take the entire space
that is left here between these number two takes.
And this image inside is linearly out horizontal.
So now you actually designed here this linearly and horizontal the so let's close this linearly omphalism
and this one.
And now we're going to actually add one more linearly out horizontal here into this in an Alianza vertical.
So again let's actually go into this pallet section.
Let's find out for there and let's select selectees linearly out horizontal and just drag it here into
this componentry section and below it is linearly or horizontal or you can just put it here insert this
linearly up horizontally and below it is linearly out horizontally here and then and then just release
it.
So again we have this linearly or horizontally here.
So the lay out which is mass parent.
It is good.
So I don't want to lay out height to be match parent.
So let's change the layout height here to wrap content.
Okay.
So the layout height of this linearly outhaul is not all here is now the content but the layout is much
parent.
So let's add a text view into this linearly out horizontal here.
So inside this feature widgets folder to select the state's view and distribute here into this componentry
section here and just put it here inside this linearly authorities that will open this linearly or horizontally.
And then you can see the stakes here.
So let's actually change the text of this view.
So let's actually just put in a made as number three call and and present into the key on your keyboard.
Let's increase the text size of this text here.
So let's scroll down here and let's find the text size attribute and in here just assign the value of
24 espie for the text size of the 6 view.
And then let's actually write another text into our linearly output isn't it.
So inside the speeches folder father select the stakes.
And then just drag it here below this takes you here and inside is linearly or horizontal inside this
camp componentry here and then release it.
So now this takes you here is actually beside it takes you inside this linearly at what is on top.
So now let's change the ID of this takes you.
So this actually just typing here.
He takes the number three.
And that person into genial keyboard.
So if we actually select this takes you here as you can see this is DXi number two.
The idea is the number two and this one is takes the number three.
Let's change the text here.
So it's still it's the text of the state's view and then press on until and your keyboard let's increase
the text size of the state's view.
So let's find the text size attribute so this is the text size attribute so choose 18 is.
And now let's actually set for the year out we assign the values 0 DP for the left and for the layout
weight assign the value 100 and that person to enter on your keyboard.
So now you can see that this text is now actually taking the entire space between these number three
text view.
And these are actually beat the entire width of these horizontal scroll view horizontal linearly as
you can see here.
So now let's add an image into this linearly or horizontal.
So inside this palette section let's find this folder images and media and let's select this image view
and strike it here.
Below this takes the number three here.
Inside it's linearly authorities are also just released selectees icy lantern here as the placeholder
here then click on OK.
So now we have this image view here.
So for the layout of this image you assign the value of 50 and for the height of this image.
Let's assign the value of 50 for the id attribute just type in here.
I m g i m g dice number into dice a number or IMJ dice.
Number for and that person intimately.
So let's actually select this place as you can see this imagery.
So this is in today's numbers too.
And let's select this one and it is do this number for the number 1.
So this one is.
I enjoy those number three.
And now everything is OK here.
So let's add another horizontal are linearly out here into this linearly as well.
So let's close these linearly out here in Enceladus componentry resections so that we have enough space
in order to add more components here.
So let's go inside this palace section let's find the layouts folder.
Let's select selectees linearly or horizontal and just put it here inside this linearly as vertical
and do this linearly outhaul these are all here and then release it.
So as you can see here we have again this linearly as horizontal here.
So the lay out is much present.
So let's change that much present for the layout height to wrap content.
So the length height is now with our content.
Now let's add a text view to this linearly outhaul is on.
So inside these widgets folder select is text view.
And then just drag it here inside this componentry section and put it inside this linearly as horizontal.
Let's open this linearly or what is on top select is text view here inside it linearly Altadis onto.
So we don't have to change the ID but as you can see the lay out with is wrapped content and the layout
height is wrapped content.
Let's change the text to number four.
Number four colon.
So let me actually change it to number four colon and then present you on your keyboard.
And now let's actually change the text size of the state's view.
So let's scroll down here and let's find a text size attribute here and assign the value 24 espie for
the text size.
And then let's add another takes you into this linearly authorities and also in.
So is we just select this text view here.
And then just drag it here into this linearly Athel is up to and below the state's view and then release
it so it selects a text view here.
And now let's specify an idea for the states.
Also just select states.
And for the ID attribute just say in here he asks the number for X number 4 and then press on and have
key on your keyboard.
And now for that layout we assign the values zero.
And for the lay out weight assigned the value of 100.
So as you can see when I assigned the value 0 for the lead out of the Android studio put this DP here
automatically.
Right now you can see that this test is actually taking the entire space that is remained here inside
this linearly alcoholism.
So now let's increase the text size of this.
So first this actually deletes the text of this text view.
So as you can see I actually deleted the text.
Now let's increase the text size of this dispute to 18 espie and that person enter on your keyboard.
And now let's drag an image of you into this horizontal scroll view.
So inside these images and media folders select this image here and then drag it here into this componentry
section and below it is text view here and now we need to just select this isolate enter here and then
just click on OK so you can see this image here.
And now let's actually just for the lay out assign an ID for this image here so just select its image
view and for the idea just open.
Here I am just dice number four.
I enter those number four and then press enter key on your keyboard and for the layout we assign the
value of 50 DP and for the length height assigned the value 50 DP.
So now let's try another linearly or horizontal into this linearly as vertical.
So let's close this linearly and horizontal here.
And let's find out spoiler here.
And then as you can see we have actually the inconsistency here.
So let's select this number one takes you and for the text attributes this actually put a space between
this number and this one and that person until on your keyboard and again select this number two here.
And for the text attributes actually specify a space here between number and this value 2.
So now I think it is good.
So now let's actually close these linearly outs here inside this componentry section so insidiously
asphalted inside this palace section selectees linear layout horizontal and to strike it here into this
linearly as vertical and then release it.
So now selectees linearly or horizontally for the lay out height assigned a value or that content.
And then here let's write a text view into this linearly Altadis.
So just select it and drag it here into this componentry section and into this linearly authorities
Outlook and then release it.
So now let's actually select this takes few.
So for the lay out of it and the length height as you can see wrap content is OK we don't have to change
the ID.
So for the text Let's actually save in here number five colon and then press on until on your keyboard
let's increase the text size of this takes you so you can see this text size attribute here.
Let's change it to 24 speed and then precedented handle keyboard.
So remember that Espey is used for sizing up the font size of our Takes views.
And then here let's try another takes into our linearly or horizontal.
So just selectees takes you here and just to get here into this linearly or horizontally and below this
takes.
And then really it.
So selectees takes few view and for the ID just type in here and here.
The Fewkes the number five and then present entelechy on your keyboard for the layout Veith assigned
the value 0 DP and then present in Turkey.
And then here for the text attribute this actually is this value here.
So for the lay out weight is saying the value of 100.
So it's going to take the entire space that is remained here inside these horizontal linearly out.
And now let's try an image into this linearly out here.
This horizontal linearly actually.
So let's find these images and media folders select this image view and just try it here inside.
Linearly as a will and below this takes few and then release it to select the slightly luncher and then
click on OK.
So now let's actually just select this text view and then let's increase the text size.
So the text size is going to be 18 as P..
Now let's select this image for you.
So let's specify an idea for this image.
The idea is going to be LMG dice number five and then present it to your keyboard.
And here are the outfits.
Assign the value of 50 DP and for the height assigned the value 50 DP.
Now let's actually close this linearly out horizontal.
Let's and another linearly or horizontally into our linearly or two articles inside Israel swiller selectees
linearly horizontally and just like it here below this linearly out and then Enceladus linearly aesthetical
here as you can see and then release it.
So for the lay out feet as you can see this is Mashonaland much planet is good.
And for the lay out height assigned the value or VAP content here.
And for that it's actually it takes you into this scenario any or what is on top.
So just like the stakes and drag it here into this the nearly horizontal and then release it and selectees
takes view.
We don't have to change the ID.
So the lay out with its contents the delay height is not counted.
It is OK.
So let's for the text that ship you are just typing here.
Number six number six colon and then present enter key on your keyboard.
So now let's increase the text size of the states.
So just scroll down here find it takes those attributes and just assigned about your 24 espie for the
ticks size.
And Dan let's try another trick takes you into this the nearly out horizontal.
So inside this we just went there to select this text view and then just drag it here below the stakes.
And inside this linearly authorities enter and then release it.
And now let's select this text view here and then let's actually assign an I.D. to the States.
We also just select this ID and type type in here.
He is the number 2 x number 6.
And then for to on your keyboard Let's for the layout we assign the value 0 DP and for the lay out a
weight assigned a value of 100 and that person into your keyboard.
Let's delete the text of this text view.
Now let's increase the text size to 18.
Espie.
And then finally let's try an image into this linearly as a result of inside these images and media
there.
Let's select this image here and then just write it here and below this takes you and then release it.
Select this I.S. luncheon and then click on OK.
So now we have this image of you here.
And now let's actually select the same interview.
And for the idea just like in here I m g dice.
I am GITTOES number 6.
So this one was I enjoyed number five and this is now I indeed this number six.
The idea is number 6 as you can see and the outfit is Matt is going to be 50 DP and the layout height
is going to be 50 DP.
And finally as you can see everything is OK here.
So don't worry about these images.
We are going to actually change these images later from the job codes instead of of course we are going
to actually change these code.
These images actually of the images of these image views.
And finally let's actually close these linearly else here in this componentry section here and now Vinney
to actually track another image view into our linearly out vertical.
So let's actually scroll down here and find the images and media folders select the same interview and
then just drag it here inside this linearly as first the card and below it is below this linearly out
horizontally.
And just inside this linearly I swear to God and then release it just like is icy Lanter as the placeholder
and then click on OK.
So now we have this image view here.
So now let's actually change the ID to I dice and then present it to your keyboard.
Maybe later you want to actually interact with this image from our code.
So let's put an idea for this image for you and for the layout which assigned the value of 100 DP and
for the layout height assigned the value 100 DP for this image.
And now I want this image to be in the center.
OK.
In the center of this a linearly out vertical.
Actually I want it to be centered horizontally.
So let's find the lay out gravity.
So remember the lay out gravity is going to determine the position of this user interface component
according to the parent.
So because this image you display in days is inside is linearly out vertical here the patent is going
to be this linearly I swear to God.
And when I say all you want this image to be center horizontally inside the parent I want this image
to be set horizontally inside linearly as Westacott.
So just select is immaterial.
Let's find the lay out gravity.
So in order to find the with gravity you can actually search it here or you can actually just select
one of these attributes and just type in here.
Lay out line gravity.
So now we found this attribute so open is the Earth's gravity here.
And let's check this church box that says Center horizontal.
So now we can see that this image is actually the center horizontally right.
Outfields is 180 out.
Height is a 100 so now everything is fine.
Let's try another button.
Let's strike a button into this linearly athletic call.
So in this pilot section and in say these widgets folder select spot in here and just drag it here.
Below is image view.
Inside is nearly as vertical and below this image and then release it.
So now for the actually lay out feet and the layout height I can assign some values here.
So for the layout we assign the value or wrap content of this button and for the layout height again
choose the value add up content.
And again I want this button to be centered horizontally inside the parent.
So again I need to find the layout Grab it is so select one of these attributes one of these properties
inside these properties section and search for layout gravity.
And now we found this little square with the attribute operate.
And then check this checkbox that says Center horizontal.
So now the spot on is actually centered horizontally inside this layout.
Inside this Alania I swear to God.
And now let's change the text of the spot and so forth the text attribute just typing here.
Or roll the dice and then present Intel key on your keyboard and then for the ID of this button here
just like this idea here this idea we wouldn't just open here Betty and roll the dice and then our present
energy on your keyboard.
So now everything is fine.
So let's roll on our application now and let's see how our application is actually shown how our application
is designed actually sort of select one of these devices and then click on OK.
So as you can see here we cannot run the application and we have an error inside our job codes.
So just open the main activity of a file and the error is actually related to this piece of code that
is actually related to the floating action button that will actually delete it previously.
So let's select this piece of code inside this uncreate method here inside this main activity class.
Select this piece of code that is related to the screen action button and then delete it.
Let's add another application again.
Let me show you the emulator so now as you can see here our application is running on the simulator
here.
So now as you can see we can see it is design everything is fine.
So now let's go back to actually Android studio and open this content underlayment at examen here so
you can see this design here.
Let's to change the view here.
So at the top just click on View and then tool windows and then click on a project.
You can also choose up there.
This shortcut here that says come and once so if you are using Windows this shortcut is going to be
different.
So just click on project and it's going to actually show us this android view here.
So by the way if you want to actually choose the view you can select project packages scratches.
So for our course inside our course mostly we're going to use this android view and then later we're
going to also use this project view but for now just just choose Android.
So you can see this view here and now inside is a race folder.
Select is a tribal folder.
And now let me show you the images that we are going to add to our application.
So just select all these images here and vocally condemn and then click on a copy copies of an I.D..
And by the way you can actually download these images from the resources section of this lecture.
So just copy them and then click on the driver for that here right click on it right click on this dribble
for that and then click and paste.
So it's going to actually show you dismiss it it just copy specified files and then you say OK.
So now we can see these images here.
Dice one dice to seven.
And we have also this image dice L P and G.
So let's actually select this image view and now actually find the as are the attributes of this image
view here.
So just click on this ellipsis button here this button that you can see here and select the triable
folder select the triable tab and then click on this image.
Select this image and then click on OK.
So now as you can see the image of this image which is now is not changed.
So the problem is actually with the S or C compact attributes.
So let's search for this or just select one of these properties and just type in here s r c Let's actually
find this one here.
This is the C compact attributes.
So just delete it.
It's actually selected and then deleted and then precedented on your keyboard.
So now you can see this image here inside this image for you and for all these other image viewers you
are going to change them from the code from our job.
So don't forget about them here and now the design of the user interface is actually finished.
Let's go to main activity that are fine.
Let's double click on this tab in order to make this area wider so you can see this is uncreate my faith.
And we have these methods for the menu which I'll talk about later.
So we don't need these are actually methods these aren't create options menu.
And this one does an options item selected.
So just delete them.
We only need this uncreate.
So this is our classman activity that extends our activity in that area are we going to actually start
coding this application and make this application alive.
So thank you very much for watching.
And if you have any questions about the concepts that I touched on in this lesson please put the discussion
in the course and then I do my best to answer all of your questions.
And by the way you are not going to actually update the courts the courts are going to be the same but
I am going to actually update the specific sections of the tutorials of the schools that are actually
not inconsistency of the all their versions of Android studio.
So for example in this tutorial I just let you know I just wanted to let you know about how you can
design the user interface application of this application.
According to these changes that the Android has made or the newest versions of Android studio.
So either by then if you actually just click on this take it up here you can see that these are the
example codes here.
So I'll talk about these codes here later but for now you can see this application is working properly.
So thank you very much for watching and I'll see you in the next theater here.