乐者为王

Do one thing, and do it well.

实现Android底部工具栏

在网上的大部分教程中,底部工具栏通常由TabHost和RadioGroup结合完成,每个工具栏项对应一个Activity。不过,我们要实现的是多个工具栏项在单独的一个Activity上起作用。

简单实现Android顶部工具栏和底部工具栏就是这样的。不过该实现对每个工具栏项设置了固定宽度80dip,导致工具栏项或屏幕大小不定时代码布局会有问题。

这里对它做了些改进,使之能做到适应不定大小的工具栏项或屏幕。改进后的布局代码如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="0dip"
        android:layout_weight="1.0">
        <ScrollView
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:scrollbars="vertical"
            android:fadingEdge="vertical">
            <TextView
                android:id="@+id/content"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:textSize="17dip" />
        </ScrollView>
    </LinearLayout>

    <include layout="@layout/toolbar" />
</LinearLayout>

以下是工具栏toolbar.xml的布局代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/toolbar_bg">
    <ImageButton
        android:id="@+id/btn_index"
        android:src="@drawable/index"
        android:text="@string/index"
        style="@style/toolbar" />
    <ImageButton
        android:id="@+id/btn_prev"
        android:src="@drawable/btn_prev_bg"
        android:text="@string/prev"
        style="@style/toolbar" />
    <ImageButton
        android:id="@+id/btn_next"
        android:src="@drawable/btn_next_bg"
        android:text="@string/next"
        style="@style/toolbar" />
    <ImageButton
        android:id="@+id/btn_zoomin"
        android:src="@drawable/zoomin"
        android:text="@string/zoomin"
        style="@style/toolbar" />
    <ImageButton
        android:id="@+id/btn_zoomout"
        android:src="@drawable/zoomout"
        android:text="@string/zoomout"
        style="@style/toolbar" />
</LinearLayout>

Comments