The graphical editor

Open the main layout located at /src/main/res/layout/activity_main.xml in our project. The graphical editor will be opened by default. The center panel of the graphical editor is the Preview, where you can examine what your layout looks like. From the Preview you can see that initially this main layout contains just a text view with a Hello World! message. To switch between the graphical and text editors, click on the Design and Text tabs at the bottom of the screen, as shown in the screenshot:

The Toolbar options contains some options that can be used to change the layout style and preview. The Toolbar options, which are shown in the following screenshot, are explained throughout the chapter:

The Component Tree panel displays the components placed in the layout as a hierarchy. There are two components in our layout: a RelativeLayout as the root element, and a TextView which is the one displaying the Hello World! message. When you select one element on the Component...