Introduction to Android Studio

After you’ve installed Android Studio and created your first project, it’s time to explore the IDE. In this demo, you’ll get more familiar with Android Studio. The demo will guide you through installing plugins, setting preferences, and managing Android SDKs. You’ll also be introduced to the common windows you’ll use, such as the project navigator, resource manager, device manager, and SDK manager. You’ll learn how to open, move and resize the windows. When you’re finished, you’ll feel right at home with your new IDE.

By default, Android Studio opens windows inside the IDE in a dock-pinned mode. In this mode, a window will always be displayed within the IDE alongside all other windows. The window will never overlap another window, and it will always be displayed — even if the focus is on another window.

After creating a new project, Android Studio opens the project window on the left pane, and the editor window on the right pane with the MainActivity.kt file open. These are the most common windows you’ll use. The project window will display your project structure, files, and components. You can jump into any directory and open any file from the project window. Whenever you open a file, it’s displayed in the editor window. The editor window can display all the different file types associated with your project. This is where you’ll spend most of your time creating, designing, and developing your app.

Find the project build.gradle.kts file from the project window and double-click it to open it. The file will open and display in the editor window alongside the MainActivity.kt file. Switch between files in the editor window by clicking the tabs. Click the MainActivity.kt tab and the editor window will display the file accordingly. To close a file from the editor window, click the “X” in the tab. Close the build.gradle.kts file now.

Resize windows to increase and decrease the amount of space they take up on your screen. To do this, hover your mouse between the windows until you see the mouse arrow turn into a resizing icon. Click and drag the window edges to resize the project window.

In addition to resizing, most windows can be hidden or detached from the IDE and float around on your screen. The editor window is the only window that can’t be hidden or undocked. Next, you’ll practice hiding and showing the project window.

On the project window, find the minimize icon. It looks like a dash. Click it to hide the project window. To show the project window, find the project icon on the far left toolbar of the IDE. Click the project icon, and it will show.

Android Studio tool windows have five different view modes. These modes provide flexibility with how you organize windows on your screen. Set the view mode of any window by clicking the vertical kabob icon and selecting View Mode. The vertical kabob icon is just to the left of the hide icon. It has three dots arranged vertically. Next, change the view mode of the project window.

On the project window, click the vertical kabob icon and select View Mode. The default view is Dock Pinned. In this mode, it will always be displayed within the IDE alongside all other windows even if the focus is on another window. The window will not overlap with other windows.

Change the view mode to Dock Unpinned. This will keep the window inside the IDE and will not overlap any other windows. The difference is that it will automatically hide when other windows get the focus. Click the Editor window and you’ll see the project window hides. Click the project window icon once again to open it. Change the view mode of the project window to undock. You’ll notice the editor window now stretches behind the project window. Undock view mode introduces window layering within the IDE. The window is constrained to the bounds of the IDE, and it will hide when other windows get focus. Click the editor window and the project window will disappear. Click the project window icon to open it once again. An undocked window will display on top of other windows.

Now, change the view mode of the project window to Float. In this view mode, the window is detached from the bounds of the IDE. This means you can drag it outside of the IDE. With the project window in Float view mode, drag the window and position it outside of the IDE. If the window overlaps the IDE, it will cover other windows.

The last view mode is the Window view mode. Set the view mode of the project window accordingly. This view mode acts like a true independent window. The window is detached from the IDE. It can be placed anywhere on your screen. Drag the project window so that it’s sitting on top of the IDE, and click on the editor window. Notice that the project window goes into the background. Any tool in window view mode will hide behind the editor window and any other window in the same view mode.

Next, explore other common windows and tools in Android Studio. There are icons grouped all around the border of the IDE. The first group of icons is on the far left toward the top. This group includes the project window you were working on. It also includes the resource manager window. You can hover over the icon with your mouse and the tooltip will tell you what window that icon represents.

Open the resource manager window. This window organizes and displays your resource files. Your Android apps will have several static resource files such as icons, colors, and strings. The resource manager window gives you quick access to these files. The same files can be found in the project window, but you’ll have to dig through the directory structure to find them. The resource manager window is a convenient way to view the different types of resources. Click the Color tab to see all the color resources. Click the String tab to see all the string resources. The tab bar in the window allows you quick access to the different types. Use the search box to find specific resources. You can also use the plus icon to add a new resource.

On the bottom left is another group of icons. You’ll find an icon for the Build, Logcat, and Problems windows there. Open the Logcat window. Notice the Logcat opens across the bottom when docked. All windows in this section will open at the bottom when docked. The Logcat Window is where you’ll see console output messages from your device and app. The Build window won’t be visible until you build and run your app at least once. It gives you information about the latest build compilation you ran. It will also output information while it’s compiling and running. The Problems window displays information about issues and errors in your project. The App Quality Insight window will display your crash information from Crashlytics if your app is integrated with Firebase. Firebase and Crashlytics are both products offered by Google to help you maintain a high-quality app. The Terminal window opens a terminal console for you to interact with your computer’s file system and execute command-line tools. The Version Control window provides integration with version control systems so that you don’t have to leave the IDE to pull, commit, or push your version controlled project to remote repositories.

The far right side of the IDE contains another set of icons and windows. The most notable ones there are Gradle, Device Manager, Running Devices, and Device Explorer. Open the Gradle window. It provides insights and controls related to the Gradle build system, which is used to build and manage Android projects. Open the Device Manager window. It displays a list of all the physical and virtual devices that can be used. This is where you create and manage virtual devices or connect to physical devices. Now open the Running Devices window. It shows all active running devices. This is where you can interact with physically connected devices and emulators.

Next, look at the Settings window. Older versions of Android Studio called this a Preferences window. Depending on your version of Android Studio and operating system, the title of this window will either be Preferences or Settings. For the remainder of this demo, the window will be referred to as the Settings window. This window gives you the ability to manage different aspects of the IDE. To access the settings window on Mac OS, click Android Studio in the Menu, then click Settings. On Windows OS, you click on the File menu and then on Settings. After the window opens, click Appearance & Behavior on the left panel. The panel on the right will provide a list of customization options related to the visual appearance and behavior of the IDE.

On the right panel, click Appearance. A new screen will display on the right panel. This screen allows you to change the visual appearance of Android Studio. Under theme, toggle between light mode and dark mode. Toggle that now, and leave it according to your preference. The Zoom section is where you change the font size of the text throughout the IDE. Change the zoom percentage to 200% and see how large the font size increases.

On the left panel, you can see the rest of the Appearance & Behavior subcategories. Click New UI. The Android Studio IDE has been visually transformed. The new UI follows the look and feel of IntelliJ IDEA. You can toggle between the old and new UI of the IDE.

You can modify every menu and toolbar item that you come across within the IDE. To do that, click the Menus and Toolbars subcategory on the left panel. The screen on the right panel displays a list of menus and toolbars. Use it to organize the IDE menus to your liking.

The System Settings subcategory on the left panel has additional subheadings. Click the Chevron icon to the left of Systems and Settings to expand the subcategories. The subcategories help with things like setting a proxy in case you’re behind a firewall, managing passwords, and memory settings.

Plugins are additional software components that extend the functionality of the IDE. Some common types of plugins are code quality and inspection, version control integration, and database tools. To access the Android Studio plugin manager, open the Settings window and click Plugins in the left panel. Scroll through the list to browse the plugins. You can also use the search bar to find a specific plugin quickly. Click on a plugin to see the details screen on the right panel. The detail screen will tell you more about the plugin, such as the developer, an overview, what’s new, reviews, and more. Click the Install button to install the plugin. The IDE will install and configure the plugin for you. In some cases, you may need to restart the IDE for changes to take effect. Click the installed tab at the top of the plugin manager screen. You’ll see a list of all the plugins you currently have installed. From this view, you can also disable or uninstall a plugin.

The gear icon at the top of the plugin manager screen provides additional settings. Click the gear icon and you’ll see the options available. There, you’ll be able to add custom repositories for plugins, manage proxy settings and certificates in case you have trouble accessing the plugin repository, and enable or disable all the plugins you have installed.

That ends this demo. Continue with the lesson for a summary.