Hi. Within this lecture, we're going to see how we can use some mathematical calculations in order to make our views relative to the screen size. So, we're going to get the width and height of the current screen that we are on. In order to do that, I'm going to create two variables. First of which is width. So, we can get the width by view.frame. So, remember we had frame in our label and we had a frame we have a frame in our view as well. And the frame of the view is actually the screen size of the phone. So, if say view.frame.size.width it gives me the current width, right? So, I can do the same thing for the height as well. So, I'm going to go view.frame.size.height. So, right now I can use those two values in order to create some good mathematical operations.

For example, I can say here width multiplied by 0.5 or 0.0 or just divided by two. So, this will take the current width and divide it by two and then place it in the middle of my screen. I can do the same thing in Y-axis as well. I can just take the height. And divide it by two or just multiply it by 0.5. And in fact, let's multiply them by 0.5. So, we can make it 0.4 or 0.45, if we are not satisfied with the result later on. And in fact I can do the same thing for width and height as well. I can just say that make width like 80% of the current screen size and make height like 5% of the current screen size. So, let's do that. Let's see, width multiplied by 80 and height, I don't think we have to go with the relative size over here. We can just do like something like 50 because we're just creating a tax.

Maybe if I was working on an image I can go relative on height as well. But right now I don't need that. So, let me run this and see how this works if I managed to put it in the middle of my screen. As you can see, we are somewhere close. So, in the Y-axis, we are somewhere in the middle, right? But in the X-axis we are not even close, we are not in the middle, we are skewed to the right. So, why does that happen? So, let me tell you this in a visual way. Suppose that this is our screen and we are creating a text, a label over here, right? So, our label looks like this. We are creating a width of 80% and height of 50. So, we are trying to place this into the middle like this. But, we are doing this instead of placing this into middle, we are saying that start from X, multiplied by 0.5. So, it's starting from the middle but it has its own width as well, so it overflows to the right hand side so we don't get what we want, instead we have to start it from not here but something around here. In order to find this point, we have to actually find the X, middle X like we did and subtract the half of this width over here, from here. So, if I subtract half of this width from the X point I can find the starting point, right?

So, I can do that for the Y value as well. And Y value doesn't seem to be causing problems, because we made this Y value like something like fifty. So, it's a little. It doesn't cause any problems or it doesn't seem to be causing. But, it's actually something like this right now. So, we have to make sure that this stays here and here in order to be centered. Let's go back to excode and do that. So, I have to find a way to make sure that the half of this width is subtracted from the X-axis. So, this would be in the middle of this X-axis. I'm going to do that for the Y value as well, so that it will be on the Y-axis, half of the Y-axis, okay? And this is a very good way so that you can find the middle screen, middle point of the screen and you can actually place this other views that you're going to have in your app are relative to this point as well.

So, let me try to subtract the width or half of the width from here. So, I currently have 0.8. So, if I say something like this, so let's see, can I get the exact view that I want. As you can see, now I have this test label on the middle of the X-axis. We can go and do that for the Y as well. So, rather than saying height multiplied by 0.5, I can come over here and deduct 50 or 25 actually from here. So, 50 divided by two. You may understand what's going on when you go back and look your notes. So, here we go. We managed to create a label and we managed to put it on the middle of the screen using mathematical operations.

So, we can do that for other views as well because we have our width and height variables right now created, we can use this technique in order to create some relative views and we can exactly find where it's supposed to be located on the screen in different sizes. So, right now it doesn't matter if you're working on an iPhone SE or iPhone six, these sizes will be relative to the iPhone screen size. So, let's stop here and within the next lecture, we're going to see how we can create a button using this technique.