Tutorial: Getting started with Android Studio

This tutorial introduces the use of Android Studio for creating JUCE-based projects.

Level: Beginner

Platforms: Android

Getting started

In this tutorial we will install and configure the tools necessary for building JUCE-based applications using the Android Studio application.

Installing the tools and development kits

Before we create a JUCE application for Android we need some of the standard tools, Android SDKs, and the Android NDK (Native Development Kit).

Installing Android Studio

Download Android Studio from the following URL: https://developer.android.com/sdk/index.html

The download is quite large so may take some time (around 350MB on Mac OS X and just over 1GB on Windows). This is only the initial download, there are more items to install later. Be prepared for this whole process to take a while. After the download is complete, follow all of the instructions on the "Installing Android Studio" page that should have appeared after you initiated the download.

Note
You may need to update your JDK (Java Development Kit) to 7.0 or later depending on your OS. You should be prompted to install this if necessary, either during the install process (on Windows) or when you first launch Android Studio (on Mac OS X).

Perform a standard install of Android Studio. This is done using the installer on Windows, but on Mac OS X you need to finish the installation when Android Studio is first opened. This is shown in the following screenshot.

tutorial_android_studio_screenshot2.png
Use the standard install type (Mac OS X)

It is useful to test on a virtual device, even if you have a selection of physical Android devices, so select this option when prompted.

tutorial_android_studio_screenshot3.png
Install an Android Virtual Device (Mac OS X)

On Windows you will have the option to install a "Performance" (HAXM) device. You should select this option.

tutorial_android_studio_screenshot4.png
Install the HAXM Device (Windows)

Keep clicking through the install process (clicking Next) until it is finished.

Installing additional SDKs

Now that Android Studio itself is installed we need some additional tools. In the Welcome to Android Studio window, click the Configure button.

tutorial_android_studio_screenshot5.png
Go to Configure (on both Mac OS X and Windows)

Then click the SDK Manager button.

tutorial_android_studio_screenshot6.png
Select the SDK Manager (on both Mac OS X and Windows)

If you need other SDK Platforms, then you can select the ones you need in the SDK Platforms tab. The defaults should work fine for now.

One more thing that we need is the Android NDK. This is critical for JUCE to work with Android since it provides the C/C++ APIs for writing Android applications. To install this, select the SDK Tools tab within the SDK Manager. At the bottom of the list is the item Android NDK. Check this item and click Apply. This is shown in the following screenshot:

tutorial_android_studio_screenshot9.png
Install the NDK and other tools

Ensure that at least the items that are shown selected in the screenshot above are selected on your system (on either Windows or Mac OS X). It is fine to install additional items if you wish. Click the Apply button when you're done.

Using the Projucer

Now that Android Studio, the Android SDKs, and the Android NDK are installed we can configure the Projucer to create JUCE-based Android Studio projects for us. (If you are not familiar with the Projucer, you may wish to refer to Tutorial: Getting started with the Projucer.) To do this we need to know where the Android SDKs (and the NDK) are installed.

The location of the Android SDK is shown at top of the SDK Manager window. The path will be something like this (where "username" is your user name):

  • C:\Users\username\AppData\Local\Android\sdk (on Windows)
  • /Users/username/Library/Android/sdk (on Mac OS X)

Copy this path from the SDK Manager window to your clipboard ("CMD-C" on Mac OS X or "Ctrl-C" on Windows)

Open the Projucer application and navigate to menu item Tools > Global Preferences... Make sure that the Paths tab is selected. Paste the path ("CMD-V" on Mac OS X or "Ctrl-V" on Windows) into the Android SDK field. When you hit "Return" the text should be displayed in black text. This is shown in the following screenshot:

tutorial_android_studio_screenshot10.png
Enter your path to the Android SDK (shown on Mac OS X)

If the SDK can't be found, or is not installed correctly, then the Projucer will display the path that you have entered in red.

The NDK is found within the SDK in the ndk-bundle directory. It will be something like this:

  • C:\Users\username\AppData\Local\Android\sdk\ndk-bundle (on Windows)
  • /Users/username/Library/Android/sdk/ndk-bundle (on Mac OS X)

Enter your SDK path, with the ndk-bundle directory appended, into the Android NDK field within the Global Preferences window.

tutorial_android_studio_screenshot11.png
Enter your path to the Android NDK (shown on Mac OS X)

Again it should be displayed in black if the path is correct and the NDK is installed correctly (and red if it is not).

Creating an Projucer project

Now let's create a new project. Navigate to menu item File > New Project... Choose a GUI Application project type, choose a location for the project, and make sure that you check the Android target platform. This is shown in the following screenshot:

tutorial_android_studio_screenshot12.png
Setting up a new Projucer project

Click the Create... button.

Unless you installed all of the Android SDKs earlier, you will need to change the minimum SDK version supported in the Projucer project. Select the Android exporter in the left hand-column and find the Minimum SDK Version field. Enter "23" in this field, as shown in the following screenshot:

tutorial_android_studio_screenshot13.png
Setting the minimum SDK version

Modifications to the application code

There is a minor change that you can make to the application code, to work well on Android devices, in terms of the screen layout. In the Projucer, select the Files tab and select the Main.cpp. Update the MainWindow constructor as follows:

//...
MainWindow (String name) : DocumentWindow (name,
Colours::lightgrey,
DocumentWindow::allButtons)
{
setUsingNativeTitleBar (true);
setContentOwned (new MainContentComponent(), true);
setFullScreen (true); // set to fullscreen rather than call centreWithSize()
setVisible (true);
}
//...

This will make the application run fullscreen, rather than within a window (as would be the norm on desktop platforms).

Opening in Android Studio

You can now open the project in Android Studio by clicking the Save Project and Open in IDE... button in the Introjcuer. Android Studio should open and display this window:

tutorial_android_studio_screenshot15.png
Opening the project in Android Studio

Click the OK button and the project should import and open. You should now be able to run the project from within Android Studio. Hit the "run" button:

tutorial_android_studio_screenshot16.png
Hit the Run button

Android Studio will ask you which device you want to use. You should have a virtual device, so you can use the Launch emulator option and click the OK button. (If you have an Android device connected via USB you should also see it in that window.) This is shown in the following screenshot:

tutorial_android_studio_screenshot17.png
Running on a virtual device

The application should now launch on the device! It should look something like the following screenshot (this shows the device rotated to landscape orientation):

tutorial_android_studio_screenshot18.png
Our Hello World! app on the device
Note
To rotate the virtual device use "Control-F11" to rotate anti-clockwise and "Control-F12" to rotate clockwise. (On Mac OS X you will need to hold the "fn" key too.)

Summary

In this tutorial we have covered the following topics:

  • Downloading and installing Android Studio.
  • Downloading the Android SDKs and the Android NDK.
  • Creating an Projucer project for Android Studio.
  • Opening an Projucer-generated project in Android Studio.
  • Running the project on a virtual (or real) device.

See also