© Ted Hagos, Mario Zechner, J.F. DiMarzio and Robert Green 2020
T. Hagos et al.Beginning Android Games Developmenthttps://doi.org/10.1007/978-1-4842-6121-7_3

3. Android Studio

Ted Hagos1 , Mario Zechner2, J. F. DiMarzio3 and Robert Green4
(1)
Makati, Philippines
(2)
Graz, Steiermark, Austria
(3)
Kissimmee, FL, USA
(4)
Portland, OR, USA
 
In the previous chapter, we built a simple app by creating a project, opened it in the main editor window, and ran it in an emulator. In this chapter, we’ll take a closer look at the parts of Android Studio where we’ll spend most of our time. We’ll look at the following:

  • Working with files in Android Studio

  • Parts of the main editor

  • Editing layout files

  • The Project tool window

The IDE

From the opening dialog of Android Studio, you can launch the previous project we created. Links to existing projects appear on the left panel of the opening dialog, as shown in Figure 3-1.
../images/340874_4_En_3_Chapter/340874_4_En_3_Fig1_HTML.jpg
Figure 3-1

Welcome to Android Studio

When you open a project, you’ll see the main editor window, the project panel, and other panels that Android Studio opens by default. An annotated picture of an opened project is shown in Figure 3-2.

➊

Main menu bar—You can navigate Android Studio in various ways. Often, there’s more than one way to do a task, but the primary navigation is done in the main menu bar. If you’re on Linux or Windows, the main menu bar sits directly at the top of the IDE; if you’re on macOS, the main menu bar is disconnected from the IDE (which is how all macOS software works).

➋

Navigation bar—This bar lets you navigate the project files. It’s a horizontally arranged collection of chevrons that resembles some sort of breadcrumb navigation that you can find on some websites. You can open your project files either through the navigation bar or the Project tool window.

➌

Toolbar—This lets you do a wide range of actions (e.g., save files, run the app, open the AVD manager, open the SDK manager, undo, redo actions, etc.).

➍

Main editor window—This is the most prominent window and has the most screen real estate. The editor window is where you can create and modify project files. It changes its appearance depending on what you are editing. If you’re working on a program source file, this window will show just the source files. When you are editing layout files, you may see either the raw XML file or a visual rendering of the layout.

➎

Project tool window—This window shows the contents of the project folders; you’ll be able to see and launch all your project assets (source code, XML files, graphics, etc.) from here.

➏

Tool window bar—The tool window bar runs along the perimeter of the IDE window. It contains the individual buttons you need to activate specific tool windows, for example, TODO, Logcat, Project window, Connected Devices, and so on.

➐

Show/hide tool window—It shows (or hides) the tool window bar. It’s a toggle.

➑

Tool Window—You will find tool windows on the sides and bottom of the Android Studio workspace. They’re secondary windows that let you look at the project from different perspectives. They also let you access the typical tools you need for development tasks, for example, debugging, integration with version control, looking at the build logs, inspecting Logcat dumps, looking at TODO items, and so on. Here are a couple of things you can do with the Tool Windows:

•  You can expand or collapse them by clicking the tool’s name in the tool window bar. You can also drag, pin, unpin, attach, and detach the tool windows.

•  You can rearrange the tool windows, but if you feel you need to restore the tool window to the default layout, you can do so from the main menu bar; click Window ➤ Restore Default Layout. Also, if you want to customize the “Default Layout,” you rearrange the windows to your liking, and then from the main menu bar, click Window ➤ Store Current Layout as Default.

../images/340874_4_En_3_Chapter/340874_4_En_3_Fig2_HTML.jpg
Figure 3-2

Main parts of Android Studio

Main Editor

Like in most IDEs, the main editor window lets you modify and work with source files. What makes it stand out is how well it understands Android development assets. Android Studio lets you work with a variety of file types, but you’ll probably spend most of your time editing these types of files:

  • Java source files

  • XML files

  • UI layout files

When you’re working with Java source files, you get all the code hinting and completions that you’ve come to expect from a modern editor. What’s more, it gives you plenty of early warnings when something is wrong with your code. Figure 3-3 shows a Java class file opened in the main editor. The class file is an Activity, and it’s missing a semicolon on one of its statements. You could see Android Studio peppering the IDE with (red) squiggly lines which indicates that the class won’t compile.
../images/340874_4_En_3_Chapter/340874_4_En_3_Fig3_HTML.jpg
Figure 3-3

Main editor showing error indicators

Android Studio places the squiggly lines very near the offending code. As you can see in Figure 3-3, the squiggly lines are placed right at the point where the semicolon is expected.

Editing Layout Files

The screens that the user sees are made up of Activity source files and layout files. The layout files are written in XML. Android Studio, undoubtedly, can edit XML files, but what sets it apart is how intuitively it can render the XML files in a WYSIWYG mode (what you see is what you get). Figure 3-4 shows the two ways you can work with layout files.
../images/340874_4_En_3_Chapter/340874_4_En_3_Fig4_HTML.jpg
Figure 3-4

Design mode and text mode editing of layout files

Figure 3-5 shows the various parts of Android Studio that are relevant when working on a layout file during design mode.
../images/340874_4_En_3_Chapter/340874_4_En_3_Fig5_HTML.jpg
Figure 3-5

Layout design tools of Android Studio

  • View palette—The View palette contains the Views (widgets) that you can drag and drop on either the Design surface or Blueprint surface.

  • Design surface—It acts like a real-world preview of your screen.

  • Blueprint surface—Similar to the Design surface, but it only contains the outlines of the UI elements.

  • Attributes window—You can change the properties of the UI element (View) in here. When you make a change on properties of a View using the Attributes window, that change will be automatically reflected on the layout’s XML file. Similarly, when you make a change on the XML file, that will automatically be reflected on the Attributes window.

Inserting TODO Items

This may look like a trivial feature, but I hope some people will find this useful—that’s why I squeezed in this section. Each one of us has a way of writing TODO items for whatever app we’re working on. There isn’t much fuss in writing TODO items; what’s difficult is consolidating them.

In Android Studio, you don’t have to create a separate file to keep track of your TODO list for the app. Whenever you create a comment followed by a “TODO” text, like this:
// TODO This is a sample todo
Android Studio will keep track of all the TODO comments in all of your source files. See Figure 3-6.
../images/340874_4_En_3_Chapter/340874_4_En_3_Fig6_HTML.jpg
Figure 3-6

TODO items

To view all your TODO items, click the “TODO” tab in the tool window bar.

How to get more Screen Space for Code

You can have more screen real estate by closing all Tool Windows. Figure 3-7 shows a Java source file opened in the main editor window while all the Tool Windows are closed. You can collapse any tool window by simply clicking its name, for example, to collapse the Project tool window, click “Project.”
../images/340874_4_En_3_Chapter/340874_4_En_3_Fig7_HTML.jpg
Figure 3-7

Main editor with all tool windows closed

You can even get more screen real estate by hiding all the tool window bars, as shown in Figure 3-8.
../images/340874_4_En_3_Chapter/340874_4_En_3_Fig8_HTML.jpg
Figure 3-8

Main editor with all tool windows closed and toolbars hidden

You can get even more screen space by entering “Distraction Free Mode,” as shown in Figure 3-9. You can enter distraction free mode from the main menu bar; click View ➤ Enter Distraction Free Mode. To exit the mode, click View from the main menu bar, then Exit Distraction Free Mode.
../images/340874_4_En_3_Chapter/340874_4_En_3_Fig9_HTML.jpg
Figure 3-9

Distraction free mode

You may also try two other modes that can increase the screen real estate. They’re also found on the View menu from the main menu bar.

  • Presentation mode

  • Full screen

Project Tool Window

You can get to your project’s files and assets via the Project tool window, shown in Figure 3-10. It has a tree-like structure, and the sections are collapsible. You can launch any file from this window. If you want to open a file, you simply need to double-click that file from this window.
../images/340874_4_En_3_Chapter/340874_4_En_3_Fig10_HTML.jpg
Figure 3-10

Project tool window

By default, Android Studio displays the Project Files in Android View, as shown in Figure 3-10. The “Android View” is organized by modules to provide quick access to the project’s most relevant files. You change how you view the project files by clicking the down arrow on top of the Project window, as shown in Figure 3-11.
../images/340874_4_En_3_Chapter/340874_4_En_3_Fig11_HTML.jpg
Figure 3-11

How to change Views in the Project tool window

../images/340874_4_En_3_Chapter/340874_4_En_3_Fig12_HTML.jpg
Figure 3-12

Settings/Preferences window

Preferences/Settings

If you want to customize the behavior or look of Android Studio, you can do so in its Settings or Preferences window; it’s called Settings if you’re on Windows or Linux, and it’s called Preferences if you’re on macOS.

For Windows and Linux users, you can get to the Settings window in one of two ways:

  • From the main menu bar, click File ➤ Settings.

  • Use the keyboard shortcut Ctrl+Alt+S.

For macOS users, you can do it this way:

  • From the main menu bar, click Android Studio ➤ Preferences.

  • Use the keyboard shortcut Command+,.

You can access a variety of Settings in this window, ranging from how Android Studio looks, whether to use spaces or tabs on the editor, how many spaces to use for tabs, which version control to use, what API to download, what system images to use for AVD, and so on.

Key Takeaways

  • You can see more of your code by increasing the screen real estate for the main editor. You can do this by

    • Collapsing all the Tool Windows

    • Hiding the tool window bars

    • Entering Distraction Free Mode

    • Going to Full Screen mode

  • You can change how you view the project files from switching the view in the Project tool window.

  • Adding a TODO item is easy in Android Studio; just add a single line comment followed by a TODO text, like this: // TODO This is my todo list

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
18.217.21.172