Notes on Android SDK: TabHost, Tabs and Activities

Okay so I was doing some more playing around after reading some of the guidelines. Anyway I used two approaches to using to switching between different views in my application going to post above as its useful depending on needs.


the first one is on tabhost, which allows you to switch between different views easily with the tab being pressed, for iPhone Developers its the equiavelent of TabBar Controller, but requires more work to get going specifically if you set it up via the xml view.


import android.widget.TabHost.TabSpec;
import android.widget.TabHost;
import android.app.TabActivity;

//first note is if you want to use a TabHost extend TabActivity instead of Activity
public class Maestro extends TabActivity {

public void onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);
addTabs();
}

private void addTabs(){
Resources resources = getResources();

//since your using the TabActivity you can simply call this method to
//set up the tabhost make sure to call setup()
TabHost tabs = getTabHost();
tabs.setup();

//tabspec defines the attributes of the tab
TabSpec tab;
//this creates a new tabspec with an id of quiz
tab = tabs.newTabSpec("Quiz");
//this sets the intent/ activity of the tab when pressed
tab.setContent(new Intent(this, Quiz.class));
//this sets the name displayed and the image if you add one
//tab.setIndicator("Quiz");
tab.setIndicator("Quiz",resources.getDrawable(R.drawable.quiz));
//then you add the tab to the tab view
tabs.addTab(tab);

tab = tabs.newTabSpec("Practice");
tab.setContent(new Intent(this, Practice.class));
tab.setIndicator("Practice",resources.getDrawable(R.drawable.practice));
tabs.addTab(tab);

tab = tabs.newTabSpec("Settings");
tab.setContent(new Intent(this, Settings.class));
tab.setIndicator("Settings",resources.getDrawable(R.drawable.settings));
tabs.addTab(tab);

//sets the current tab
tabs.setCurrentTab(0);
//add the tabhost to the main content view
setContentView(tabs);
}


now of course you need to make sure that the classes you have set above to be invoked by the tabhost are all activities of some sort depending on your application, and make sure you add them as activites in your Application Manifest.

this is simple just add the following xml to your manifest file. where Settings is the name of your classes.

\>activity label="Settings" name="Settings">
\>\activity>

Now the last thing to note is that these are the basic of using the tabhost, using the above methods you can easily setup a tab bar and get your other views up and running, now if you want to use xml to set up tabhost there are strict requirements in setting it up.

here is what you need for the tabhost via xml

you need a tabhost
with a tabwidget
with a framelayout

according to sources there seems to be a naming convention as well, but in my opinion its too much of a hassle especially if your app only needs the tabhost as the main controller.


Next instead of using the tabhost lets use the menu list that you get when you press menu. The benefits of this is you get more room in your app. this is quite simple with a few options.

well first to get an options menu use the following.

public boolean onCreateOptionsMenu(Menu menu){
//add(groupid, itemid, order, itemname)
menu.add(0, 1, 0, "Quiz").setIcon(R.drawable.quiz);
menu.add(0, 2, 0, "Settings").setIcon(R.drawable.settings);
menu.add(0, 3, 0, "Practice").setIcon(R.drawable.practice);
return true;
}

public boolean onOptionsItemSelected(MenuItem item){
switch(item.getid()){
case 1:{
startactivity(new Intent(this,Quiz.class));
return true;
}
case 2:{
startactivity(new Intent(this,Settings.class));
return true;
}
case 3:{
startactivity(new Intent(this,Practice.class));
return true;
}
}
return false;
}


now that is the simple way that simply starts a new activity when you click on one of the menu items. Now to get back you click on the back button on the phone. As you can imagine that is annoying so you have to thinking about the design of app before you consider something like this. For instance if you want to bring up a settings page the above would be nice as you can get rid of a button from the main ui. then simply press back after changing your settings.

But if your going to try and use this as a navigation controller like a tab bar then make sure you add the following after each start activity.
finsh();

that closes the current activity before going to the next one. this gets rid of the tabhost and give you the same benefits, also by doing this the menu is dynamic unlike the tabhost. I mean why would you allow a user to choose the quiz when you are in the quiz already.