Step 4: Aligning the UI

Goal:

Now that we have all of our components ready to go, let’s edit them a bit.

Right now, all of our UI is clumped together in the top left corner of the phone.

Let’s change this to make our app look a little nice.

Here I am going to center all of our components in the middle, feel free to customize it a bit if you want. (For example, you can center it at the top instead).

Steps:

1. On the right side in the components list, click on Screen1.
2. With Screen1 selected, go to its Properties on the right side.
3. Change AlignHorizontal to Center.
4. Change AlignVertical to Center.

Code:

Click to replay