在ActionBar中加入含图片的下拉式菜单导览列[Android]
Set up the (icon+Text) dropdown list navigation in the action bar
蜗牛是Android新手,但是上网查Google大师查出来的资料都好复杂,一方面是功力低,一方面是要融入他人的思考逻辑,所以看看都做不出来,所幸由Google内建的模版中一步步地修改,终于也改出来了,程式码也不是很长,且逻辑对新手来说还算是简单,因此在此做个纪录.
可以参考上一篇文章使用appcompat_V7实作actionBar icon ,因为这次是要把icon加入dwopdown导览列.
使用的模版也是上次提到的(Action Bar Spinner),这边就不多加叙述.
准备工作:
1.mylistview1.xml 放在res/layout 下面 (功用是dwopdown的布局参考XML)
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="match_parent"
android:layout_width="fill_parent"
android:orientation="horizontal">
<ImageView
android:id="@+id/imageView1"
android:layout_width="32dp"
android:layout_height="32dp"
/>
<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="6dp"
android:text="TextView"
android:textAppearance="?android:attr/textAppearanceLarge" />
</LinearLayout>
2.准备三张图片(64*64 没有硬性规定但不要太大如:1024*1024,实际显示的大小在上面mylistview1.xml定义)放在res/drawable资料夹
3.改写MainActivity.java (在onCreate里面可找到这段程式码)
旧的
final ActionBar actionBar = getSupportActionBar();
actionBar.setDisplayShowTitleEnabled(false);
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_LIST);
// Set up the dropdown list navigation in the action bar.
actionBar.setListNavigationCallbacks(
// Specify a SpinnerAdapter to populate the dropdown list.
new ArrayAdapter<String>(
actionBar.getThemedContext(),
android.R.layout.simple_list_item_1,
android.R.id.text1,
new String[] {
getString(R.string.title_section1),
getString(R.string.title_section2),
getString(R.string.title_section3),
}),
this);
这边的ArrayAdapter<String>由于只配置一个android.R.id.text1 文字项目,所以想到把这改成SimpleAdapter,来加入一组(icon+Text)
改写后:
new SimpleAdapter(actionBar.getThemedContext(),
items, R.layout.mylistview1, new String[]{"image", "text"},
new int[]{R.id.imageView1, R.id.textView1}), this);
R.layout.mylistview1就是我们准备的第一项R.id.imageView1与 R.id.textView1则是在xml里面的id
好了既然要用SimpleAdapter那就少不了要宣告.
/**
* The serialization (saved instance state) Bundle key representing the
* current dropdown position.
*/
private static final String STATE_SELECTED_NAVIGATION_ITEM = "selected_navigation_item";
private SimpleAdapter simpleAdapter;
private int[] image = { R.drawable.sport2_64, R.drawable.sport_64,
R.drawable.weight_64 };
private int[] imgText = {R.string.title_section1,R.string.title_section2,R.string.title_section3};
红色的是新加上去的,并加上所用到的图片与字串id
再来把资料(image+text)id,塞进去 items,依样的红色的部分才是新加入的黑色的字样则是插入的位置
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
List<Map<String, Object>> items = new ArrayList<Map<String,Object>>();
for (int i = 0; i < image.length; i++) {
Map<String, Object> item = new HashMap<String, Object>();
item.put("image", image[i]);
item.put("text", getString(imgText[i]));
items.add(item);
}
好了改完了,按一下Shift+Ctrl+o 把要import进来
补充:这样以后只要改这两行图片跟字串就可以拉,执行出来就像是最上面的图片了~
private int[] image = { R.drawable.sport2_64, R.drawable.sport_64,
R.drawable.weight_64 };
private int[] imgText = {R.string.title_section1,R.string.title_section2,R.string.title_section3};