From the previous section, you should have a layout with some UI elements dragged on. Now, switch from the Design tab to the Text tab (this is at the bottom of the screen), and we can now see a bunch of code.

This language is called XML, and is used throughout Android to define your user interface layouts. You can't understand XML yet. But, you can look at some of the keywords and compare it to the user interface preview on the right. All the elements that you dragged on in the visual editor are here in text form, and are represented in the preview. Some of the text matches the text that appears on the screen, and changing it changes the preview to match.

While the visual editor is useful to get started with, it is fundamentally limited in what it can do. All layouts are in fact XML files. The visual editor just lets you view the graphic representation of the XML, and generates XML for you when you drag on elements. Go ahead and try adding elements in the Design view, and switch to the Text view to compare.

If we want to get good at writing Android apps, we need to learn to understand and write XML directly. The visual editor can help you check if you're doing things right, but relying on it entirely will hold you back from being able to build better user interfaces.

We need to learn XML because:

  • XML lets us define more complex layouts, and do so more precisely
  • For anything beyond a very simple layout, XML is actually easier to modify than the visual editor
  • If you look up resources/tutorials online, they will only be in XML

The next few sections dive deep into XML layouts.

Task

Watch the following video: https://www.youtube.com/watch?v=lGuh4lTWroY. It recaps the ideas we've talked about, and can be useful if you're having trouble navigating through Android Studio. The specifics of the XML syntax is something we are going to cover in the next few sections, so don't worry that the code on the screen doesn't make sense yet.

results matching ""

    No results matching ""