To get started, create a new project called ActionBarTutorial, with a MainActivity ,and a target version of 4.0.3 or 3.0.
First we have to edit the Manifest to change the theme. Change the application part of the manifest to look like this.
<application
android:icon="@drawable/ic_launcher"
android:label="@string/app_name"
android:theme="@android:style/Theme.Holo" >
Now for the MainActivity. The only thing that should be new is in the onCreate method.
public class MainActivity extends Activity {
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
// gets the activity's default ActionBar
ActionBar actionBar = getActionBar();
actionBar.show();
// set the app icon as an action to go home
// we are home so we don't need it
// actionBar.setDisplayHomeAsUpEnabled(true);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// use an inflater to populate the ActionBar with items
MenuInflater inflater = getMenuInflater();
inflater.inflate(R.menu.main, menu);
return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item){
// same as using a normal menu
switch(item.getItemId()) {
case R.id.item_refresh:
makeToast("Refreshing...");
break;
case R.id.item_save:
makeToast("Saving...");
break;
}
return true;
}
public void makeToast(String message) {
// with jam obviously
Toast.makeText(this, message, Toast.LENGTH_SHORT).show();
}
}
The menu xml file:
<?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android" > <item android:id="@+id/item_refresh" android:icon="@drawable/ic_menu_refresh" android:title="Refresh" android:showAsAction="ifRoom|withText" /> <item android:id="@+id/item_save" android:icon="@drawable/ic_menu_save" android:title="Save" android:showAsAction="ifRoom|withText" /> </menu>
This is just a normal menu xml. The only thing that might be new is the last line of each item. This line just says, if there is enough room, the title will be shown. (The drawables can be found at the Design Guidlines site)
Now run it on a Honeycomb or ICS emulator and behold the action bar. Easy, right?
Spoiler
So now we have a few options. We can write our own action bar code, like Google does(see ActionBarCompat in your sdk samples folder). Or we can use libraries. For ease of use, we will use a person's repository, Android-ActionBar. Download the source from there and follow the instructions linked in his readme.
Welcome back!
Now that you've added that library project, back to coding.
First off, lets update the Manifest. Change the theme to this because the Holo theme did not exist prior to API v11.
android:theme="@android:style/Theme.NoTitleBar"
Add this to your main layout xml. This creates an artificial actionbar.
<com.markupartist.android.widget.ActionBar
android:id="@+id/actionbar"
style="@style/ActionBar" />
Now we need to update our activity for the new actionbar option we are using. Rather than using a menu xml, we make a private class for each action.
import com.markupartist.android.widget.ActionBar;
import com.markupartist.android.widget.ActionBar.Action;
import com.markupartist.android.widget.ActionBar.IntentAction;
import android.app.Activity;
import android.content.Context;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.view.View.onclickListener;
import android.widget.Toast;
public class MainActivity extends Activity {
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
// get the ActionBar from our layout
ActionBar actionBar = (ActionBar) findViewById(R.id.actionbar);
// set its title
actionBar.setTitle(R.string.app_name);
// set what the home action does
actionBar.setHomeAction(new IntentAction(this, MainActivity.createIntent(this), R.drawable.ic_launcher));
// add the refresh action
actionBar.addAction(new RefreshAction());
// add the save action
actionBar.addAction(new SaveAction());
// add a listener to the title
actionBar.setOnTitleClickListener(new onclickListener() {
public void onclick(View v) {
makeToast("Title clicked...");
}
});
}
// the refresh action
private class RefreshAction implements Action {
@Override
public int getDrawable() {
return R.drawable.ic_menu_refresh;
}
@Override
public void performAction(View view) {
makeToast("Refreshing...");
}
}
// the save action
private class SaveAction implements Action {
@Override
public int getDrawable() {
return R.drawable.ic_menu_save;
}
@Override
public void performAction(View view) {
makeToast("Saving...");
}
}
// a simple method to create an intent
public static Intent createIntent(Context context) {
Intent i = new Intent(context, MainActivity.class);
i.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP);
return i;
}
public void makeToast(String message) {
// with jam obviously
Toast.makeText(this, message, Toast.LENGTH_SHORT).show();
}
}
The theme it uses isn't all that great so be creative with it. Use drawables and colors.
colors.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="actionbar_separator">#FFFFFF</color>
<color name="actionbar_background_start">#000000</color>
<color name="actionbar_background_end">#33b5e5</color>
<color name="actionbar_background_item_pressed_start">#33b5e5</color>
<color name="actionbar_background_item_pressed_end">#33b5e5</color>
</resources>
And now, you can delete the menu xml that was created unless you want an ActionBar and a menu popup.
The full source:
ActionBarTut.zip (269.44K)
Number of downloads: 5441
MultiQuote
| 