Home and Learn: Android Course


Launching a new Activity from a Toolbar icon

In the previous lesson, you saw how to add code for items selected from a Toolbar. In this lesson, you'll learn how to start a new Activity for Toolbar menu items.

Instead of just displaying some text when a menu item is selected, you'll want to do something useful. Typically, you'll want to start a new activity. For example, we have a favourites menu item. When this item is selected, we might want to display images of our favourite people, or favourite cats, or favourite anything. All you do here is to create a new intent, just like you did in previous sections. Let's see an example.

Add a new Activity to your project by right-clicking on your app folder in the explorer on the left of Android Studio. From the menu that appears, select New > Activity > Empty Views Activity. Give it the name DisplayFavs:

Dialogue box to create a new Android Activity

Click Finish to create your new Activity.

In the activity_display_favs.xml file, add a toolbar widget just like you did before. As the id for new toolbar, type favs_toolbar.

Have a look at the Component Tree on the left and your new toolbar should be on the list:

Component tree in Android Studio showing a Toolbar added

The only thing we'll do with this activity is to add a back arrow to the toolbar. Tapping the arrow will take you back to the first page in your app.

You can attach the toolbar and menu to the second Activity in the same you did for the Main Activity. Add this code to the onCreate method of your DisplayFavs.java file (add it just after setContentView):

Toolbar aToolbar = findViewById(R.id.favs_toolbar);
setSupportActionBar(aToolbar);

Just like before, copy and paste this import statement to the top of the code with all the other import statements:

import androidx.appcompat.widget.Toolbar;

This time, we're using favs_toolbar after R.id, which is the name you typed in the xml file.

To get an arrow, you need to make a call to the getSupportActionBar method. This can return an ActionBar object. Add this to your onCreate method, just below setSupportActionBar.

ActionBar myActionBar = getSupportActionBar();

You'll need an import line at the top of your code. Add this:

androidx.appcompat.app.ActionBar;

Once you've got an ActionBar object, you can add an arrow with setDisplayHomeAsUpEnabled. It's a good idea to test if your ActionBar object isn't null, though. Add these lines then:

if ( myActionBar != null ) {

myActionBar.setDisplayHomeAsUpEnabled(true);

}

In between the round brackets of setDisplayHomeAsUpEnabled you only need a true or false.

Your DisplayFavs code should look like this:

Using setDisplayHomeAsUpEnabled in Java code for Android Studio.

There's one more thing to do for the up arrow, however, and that's to add a line to the Android Manifest file.

Open up your AndroidManifest.xml file, which is in the manifests folder in the explorer area to the left of Android Studio:

Android Manifest file in the Project Explorer of Android Studio.

Locate this line in the manifest file:

<activity android:name=".DisplayFavs"></activity>

Change it to this:

<activity android:name=".DisplayFavs" android:parentActivityName="MainActivity" >

We've added a parentActivityName attribute, setting it to the MainActivity java file. Your manifest file should look like this:

The Android Manifest file showing amendments

OK, we're done with the AndroidManifest.xml file. You can close it down.

Go back to your MainActivity.java file. Your code for the menu item selection looks like this:

Java code for an Android Toolbar menu

We can start our new Activity from the favourites_page if statement. Comment out or delete the line for displayTextView. Instead, we're going to create a new Intent. Add this code:

Intent favIntent = new Intent(this, DisplayFavs.class);
startActivity(favIntent);

(ALT + ENTER any red text, or add import android.content.Intent; to the top of your code.)

You've met this code before, in a previous section. It just creates a new Intent object and starts a new Activity. Your if statement should look like ours:

A new Android Activity started from a menu item

Try it out. Run your app. Click the Favourites icon in the toolbar. You should see a new Activity start, with an arrow in the toobar. Tap the arrow to get back to your main page:

An Android app showing an Activity and UP arrow.

 

Change the Color of the Android Actionbar Up Arrow

However, the arrow is black. We'd like to change the color of the actionbar's up arrow. To do that, stop your app from running. Locate the themes.xml file, which is in the res > values > themes folder in the Project Explorer:

Project Explorer showing the Android themes xml file highlighted.

Double click themes.xml to open it up. It should look something like this:

Android themes.xml file

We need to change line 8, in the code above, which is this:

<style name="Theme.AppToolsTest" parent="Base.Theme.AppToolsTest" />

Change it to this:

<style name="Theme.CustomToolbar" parent="Base.Theme.CustomToolbar">

<item name="android:textColorSecondary">@color/white</item>

</style>

All we've done is to add a new item. The item name is android:textColorSecondary. The value for the item is @color/white. You can change white to any other color you like.

 

Run your app again and tap the favourites icon. You should see a white arrow instead of a black one:

Changing the color of the Android actionbar up arrow.

 

We'll leave it there with Toolbars.

But that's it for the Android course - hope you enjoyed it!

Back to the Android Contents Page

 


Email us: enquiry at homeandlearn.co.uk