So now let's go back to android studio and let's actually turn off this feature this Autocorrect Feature.
And let's actually clear all the constraints that are created for us.
So just select this image here or we can actually just select it.
It doesn't really matter if you have an icon here it says what Clear constraints this one click.
Clear all constraints.
If I click on it now you can see that the constraints are actually clear.
And if I run the application now you can see that actually the position of the image the icecream image
is actually changed.
Right.
Because there are no constraints here.
So let's go back to androids would you.
And now let's create the constraints here manually.
So just select this image is in Israel and you can see these little circles here.
These empty little circles.
So for example select is the right circle here that is actually pulsating right and right a line here
to the right edge of the view and then release it.
So now it's going to create a constraint to the right edge of the view and you can see the properties
being taught that the constraint is 8.
If you want to I can change you to for example 10.
Right.
Select this image again and this this time selectees left circle here right.
And regular line to the left hand side of the view and then release it.
So now you can see that a constraint is created here.
Now again this is kind of value turn for the left margin.
And now you can see that we have this left margin and again select this little circle here that is actually
pulsating and draggle line to the top of the view.
OK.
And really see it.
So let's assign the value 10 for the top Margene and we can also create a constraint to the Bob Bottom
of the view.
But it's not necessarily because we want to put this image here.
So now let's run an application.
So here we can see that our ice cream image is position here correctly.
This is what we actually want.
Right.
So now let's go back to android studio.
Let's select this image and now let's actually change these size constraints.
So here.
Select this image view and click on this size constraint here we can see now it is went back to that
content.
Now the Veach is raw content right.
If I click on it again it's going to to change it back to fixed here.
But if I click on it again it's going to change back to match constraints here.
So it's going to actually match the kind of screen and it can fill up the constraints for us for the
Wii actually and we have also the height.
If I click on it again here we can see that it's going to match the constraints for us if I run my application
now.
Let me show you the emulator.
Now you can see that our image view is actually taking the entire video and the entire height of our
view right.
That's because I actually changed the size constraint here to match constraints for the feet and for
the height.
Right.
And let's go back to our Android studio salicylic this image.
And for the height let's just change it back to fix.
I think now this is good.
Now let's for example track and other some other features.
Just click on vitiates and he at this time let's throw a text view into our constraint play out here.
I can here is good.
And now let's add some constraints to this takes you if you want to you can actually turn on the auto
connect you can actually position your user interface component inside the screen and then you can just
for example if there are two conect if the feature of every city is actually turned on it's going up
automatically at the constraints for you.
But if you want to add the constraints autem manually Actually you need to selectees takes you here.
And let's actually first let's add the constraints to the left hand side of the view just select this
little circle that is actually pulsating and regular line to the left hand side to the left edge of
the view and then release it.
Now you can see that it created a constraint to the left of the view.
And here we can actually specify a value for the left margin.
So for example 20 right and we can actually create a constraint to the to this image.
You actually saw just select pop a little circle of this text view and just track your line to this
word to this bottom little circle here to the bottom of the circle of this ice cream image and then
release it.
So it's going to Crumb's can create a constraint to this but that the circle here you can see that the
margin is eight.
I can change the margin to for example 50.
Now you can see that at the margin here is 50 and there is a constraint from this to that from the top
of the takes you to the bottom of this actually the ice cream image.
Now we can add right for example.
And another lay out another component for it.
Let's actually select this text and here I can select for example this email right and drag it here.
This is actually an added text that actually accepts emails and let's select it and put it here.
Make sure to position your user interface component where ever you want and then add the constraint.
OK.
So let's change it to whatever I want here.
And then I can really sit here and now I can at the constraints.
So first of all I want to create a constraint to that right edge of the view.
So let's select this little circle here of the right circle.
This actually takes and track a constraint that I had lined to the right edge of the view and reseat.
So it actually created a constraint to the right of the view and here in the properties view you can
see this constraint if you want to I can actually create a Margene here for example 20.
And now let's create a constraint to the right edge to the right of these takes view.
So just it let the circle of this that is actually on the left hand side of this it it takes and strike
your constraint to the right edge of this actually right.
This takes you to this little circle and then release it.
So now a constraint is created here right.
So just like this it takes and you can see that the left margin is 8.
If you want to I can actually assign the values zero here.
And now you can see that the left margin is 8 0 and if I select this it takes you here.
I can actually select this right circle and direct line to the left circle of this X and release it
and you can see that the constraint is not going to be created.
Why.
Because we already created a constraint to the right hand side of this takes you from the left hand
side of this eddy text.
So you cannot actually create a constraint from the right hand side of this takes you to the left hand
side of this takes the right so that's it.
And now let's actually create some size constraints for this.
It takes just select this or it takes and hit.
Inside this little piece it is actually Square.
We can see it this size constraint and this height all you want to change this with slight constraint.
Just click on it and it is now fixed.
And if Actually can I take it now it is actually match constraints right.
So let's assign a value.
This gives a hint or let's say for example is assigned a text that is actually a detail.
For example I can say this is a great Ice-Cream.
And now we can actually assign a base line constraint the baseline constraint is going to actually align
our texts of the text view and that it takes in actually in a horizontal manner.
So let's first select this editor X and here we can see these inside this little square.
It says A B.
If I click on it it's going to actually give us this actually this baseline constraint.
If I hover over it it's going to actually pulsate and I can actually create a constraint here from this.
It takes two this takes view here.
And you can see it is actually this baseline concerned that is actually the pulsating.
I just need to really sit here.
Now we can see that the text of the it takes is actually is aligned with the takes of this takes you.
So this this is actually the text line.
This is actually a baseline constraint.
And now our let's select it it takes and let's assign the value.
For example 5 for the right Margene.
And now I think that's good.
And here everything is fine.
But let's actually create.
Let's create a left margin.
Let's assign a value for the left margin of this edit text.
So just select it it takes and for the left margin is assigned a value of 5 and that person into your
keyboard so that there is actually a little space between this text view and this text right.
So let's select this text view and for the text chip you just say in here name and then call and then
present three general.
Let's run an application now.
So here you can see that our takes you and odd as it takes are actually these two components are positioned
inside our layout.
They ve wanted.
Right.
We added the constraints and these are actually positioned the way we wanted here.
So let's go back to Andrew in the studio.
And this time I want to actually introduce you to the inferred constraints.
I can look at this one here.
It is in full constraints.
So let's actually drag and other takes you here from this pallet section.
So just click on visits and let's say like this takes view and let's put it here
let's position it wherever we want.
And now it's time to add the constraints to this view.
So just select this lift.
Actually this left little circle of this takes view and track it constrained to the left hand side to
the left edge of this view actually and now you can see that the constraint is created.
So for the margin I can assign the value 10 and you can see the change to number 20.
Let's select this takes view and for the text attribute here.
Let's assign the value price.
Call it and then person enter on your keyboard.
So let's just select it let the circle at the top of the top edge of this place take that view and tragic
actually line to the left Bodom.
Here it was actually the bottom of this name takes you here right just create a constraint to the bottom
edge of this text view and then release it.
So now we can see that a constraint is created here.
So let's select this process and increase the margin a little bit to change it to 15.
And that person will show you keyboard.