Challenge Task 2 of 2 - Adding Icons to Tabs

Question

Now switch to the ArtistActivity.java file. This also has tabs, but we are going to use icons instead of text. Set the icon for each tab using the setIcon() method, and use the value returned by the PagerAdapter's getIcon() method as the parameter for setIcon().

Here is my code:

import android.app.ActionBar;
import android.app.FragmentTransaction;
import android.os.Bundle;
import android.support.v4.app.FragmentActivity;

public class ArtistActivity extends FragmentActivity implements
        ActionBar.TabListener {

    // Some code has been omitted for brevity!

    public ActionBar mActionBar;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_artist);

        mActionBar = getActionBar();
        mActionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);

        PagerAdapter pagerAdapter = new PagerAdapter(getSupportFragmentManager());

        // Some code omitted for brevity...

        for (int i = 0; i < pagerAdapter.getCount(); i++) {
            ActionBar.Tab tab = mActionBar.newTab();
            tab.setTabListener(this);

            /*
             * Add your code here to set the icon!
             */

            mActionBar.addTab(tab);
        }
    }

    // These listener methods are intentionally blank
    @Override
    public void onTabSelected(ActionBar.Tab tab, FragmentTransaction fragmentTransaction) { }

    @Override
    public void onTabUnselected(ActionBar.Tab tab, FragmentTransaction fragmentTransaction) { }

    @Override
    public void onTabReselected(ActionBar.Tab tab, FragmentTransaction fragmentTransaction) { }

     public int getIcon (int position){
     switch (position){
       case 0:
                return R.drawable.ic_tab_profile;
            case 1:
                return R.drawable.ic_tab_discography;
            case 2:
                return R.drawable.ic_tab_related_artists;
        }

        return R.drawable.ic_tab_profile;

    }

}

But there is an error:

Bummer! Don't forget to use 'setIcon()' to set the icons for the tabs!

I don't know what to do. Please help!

Answer 1 · 2014-11-07T23:41:55Z

November 7, 2014 11:41pm

Hello Sarha!

I'll try to explain the answer to you without telling you it.

First of all, we want to "Set the icon for each tab using the setIcon() method".

So, if we look, we can see that we can use the variable tab to do this. We then chain the method we want to use onto the variable. Like this: tab.setIcon()

Next, we want to "use the value returned by the PagerAdapter's getIcon() method as the parameter for setIcon()".

So, in the parentheses (Brackets) of setIcon(), we can then put the method we want in: getIcon().

But, before we do this, we need to remember that we're getting the method from the PagerAdapter class.

The variable pagerAdapter has already been set in the class PagerAdapter so, we can use it from there.

So, we just type pagerAdapter.getIcon() (Remember, it's a lowercase for the variable!) as the value inside of the parentheses.

There's one last thing to do now which is to pass in the current position (We want to get the corresponding icon for each tab). As we're writing this code in a for loop, we can see this:

int i = 0; i < pagerAdapter.getCount(); i++

This tells us the initial value of i, the condition and what to do every time the loop runs (i++ is the same as i+1). i here just stands for the number in the loop (Remember, the loop starts from 0, not from 1!)

So, we then just pass i into getIcon like this: getIcon(i). This tells the device that we want to get the icon in position i (So, we'll get the icon in position 0, then position 1, and finally position 2 (We stop as position 2 because if you look at PagerAdapter.java, there is only 3 values (Up to position 2 because we start at 0).

I hope this makes sense to you now.

Note that I'm on purposely not directly telling you the answer so that you can try to get it for yourself but, if you still are struggling, I'd rather you were able to continue so, give me a shout.

Hope it helps and, if you have any further questions, feel free to ask!

Answer 2 · 2015-01-03T23:40:03Z

January 3, 2015 11:40pm

In case anyone was very confused after reading Harry's long and windy "explanation" above (I was)

..just keep re-reading the challenge question to get a clue as to the needed one line of code.

I'll highlight the relevant words (which need to be used in sequence to make the correct single line of code needed):

Set the icon for each tab using the setIcon() method, and use the value returned by the PagerAdapter getIcon() method as the parameter for setIcon().

So, using the text I've highlighted/bolded above, if you can figure out what goes where in terms of parenthesis (plural) and what single letter (Hint) you need to put inside the parenthesis for getIcon(), then all you have to do is remember to put at a semi-colon ";" at the end of the statement/line (parser error for you if you don't!).

Good Luck (and you may not want to bother to looking for any more forum posts/threads on part 2 of this challenge, because as of the time I am making this post I don't find any..)

Oh, and here's the link to the challenge itself part of the "Implementing Designs for Android" course, "Customizing the Action Bar" section: http://teamtreehouse.com/library/adding-icons-to-tabs

Welcome to the Treehouse Community

Looking to learn something new?

Sarha Bragança

Sarha Bragança

Challenge Task 2 of 2 - Adding Icons to Tabs

2 Answers

Harry James

Harry James

Sarha Bragança

Sarha Bragança

james white

james white

Harry James

Harry James