带图像的按钮的Android布局

时间:2012-03-10 07:24:16

标签: android android-layout android-linearlayout

我正在尝试创建一个Android布局,使用大约1/3的屏幕作为应用标题。然后对于另外2/3,它有6个均匀间隔的按钮,每行2行,共3列。在每个按钮中将包含文本和可能大小不同的图像。我一直在阅读很多内容,但还没有想出一个完美的方法。我有一个主要工作的例子,除了我的一些按钮是不同的大小,所以这不起作用(按钮是不同的大小)。另外我不知道它是否适用于不同尺寸的手机。无论如何,如果有人可以看看这个xml布局,并可能建议一个更好的方法。谢谢。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/widget30"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@color/green6"
android:orientation="vertical"
android:padding="5dp" >

<RelativeLayout
    android:id="@+id/RelativeLayout01"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@drawable/border"
    android:padding="5dp" >

    <LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/widget31"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical" >

        <LinearLayout
            android:id="@+id/linearLayout1"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="3"
            android:orientation="vertical" >

            <TextView
                android:id="@+id/textView1"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:gravity="center"
                android:text="Title Will Go Here"
                android:textAppearance="?android:attr/textAppearanceLarge"
                android:textColor="@color/green6"
                android:textSize="35sp"
                android:textStyle="bold" 
                android:shadowColor="@color/black"
                android:shadowDx="0"
                android:shadowDy="0"
                android:shadowRadius="1"
                />
        </LinearLayout>

        <LinearLayout
            android:id="@+id/linearLayout2"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:orientation="horizontal"
            android:paddingBottom="4dp" >

            <LinearLayout
                android:id="@+id/linearLayout6"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_weight="1"
                android:paddingLeft="10dp"
                android:paddingRight="5dp" >

                <Button
                    android:id="@+id/button1"
                    android:layout_width="fill_parent"
                    android:layout_height="fill_parent"
                    android:background="@drawable/custom_button"
                    android:drawableTop="@drawable/search"
                    android:text="Search by Food"
                    android:textColor="@color/green6"
                    android:textStyle="bold" />
            </LinearLayout>

            <LinearLayout
                android:id="@+id/linearLayout6"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_weight="1"
                android:paddingLeft="5dp"
                android:paddingRight="10dp" >

                <Button
                    android:id="@+id/button2"
                    android:layout_width="fill_parent"
                    android:layout_height="fill_parent"
                    android:background="@drawable/custom_button"
                    android:drawableTop="@drawable/search2"
                    android:text="Search by Substitute"
                    android:textColor="@color/green6"
                    android:textStyle="bold" />
            </LinearLayout>
        </LinearLayout>

        <LinearLayout
            android:id="@+id/linearLayout3"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:orientation="horizontal"
            android:paddingBottom="4dp" >

            <LinearLayout
                android:id="@+id/linearLayout6"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_weight="1"
                android:paddingLeft="10dp"
                android:paddingRight="5dp" >

                <Button
                    android:id="@+id/button3"
                    android:layout_width="fill_parent"
                    android:layout_height="fill_parent"
                    android:background="@drawable/custom_button"
                    android:drawableTop="@drawable/browse"
                    android:text="Browse by Category"
                    android:textColor="@color/green6"
                    android:textStyle="bold" />
            </LinearLayout>

            <LinearLayout
                android:id="@+id/linearLayout6"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_weight="1"
                android:paddingLeft="5dp"
                android:paddingRight="10dp" >

                <Button
                    android:id="@+id/button4"
                    android:layout_width="fill_parent"
                    android:layout_height="fill_parent"
                    android:background="@drawable/custom_button"
                    android:drawableTop="@drawable/award"
                    android:text="Most Popular"
                    android:textColor="@color/green6"
                    android:textStyle="bold" />
            </LinearLayout>
        </LinearLayout>

        <LinearLayout
            android:id="@+id/linearLayout4"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:orientation="horizontal" >

            <LinearLayout
                android:id="@+id/linearLayout6"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_weight="1"
                android:paddingLeft="10dp"
                android:paddingRight="5dp" >

                <Button
                    android:id="@+id/button5"
                    android:layout_width="fill_parent"
                    android:layout_height="fill_parent"
                    android:background="@drawable/custom_button"
                    android:drawableTop="@drawable/share"
                    android:text="Sync with Online Database"
                    android:textColor="@color/green6"
                    android:textStyle="bold" />
            </LinearLayout>

            <LinearLayout
                android:id="@+id/linearLayout6"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_weight="1"
                android:paddingLeft="5dp"
                android:paddingRight="10dp" >

                <Button
                    android:id="@+id/button6"
                    android:layout_width="fill_parent"
                    android:layout_height="fill_parent"
                    android:background="@drawable/custom_button"
                    android:drawableTop="@drawable/plus"
                    android:text="Submit New Food Substitute"
                    android:textColor="@color/green6"
                    android:textStyle="bold" />

            </LinearLayout>
        </LinearLayout>
    </LinearLayout>
</RelativeLayout>

1 个答案:

答案 0 :(得分:0)

我会使用顶级的LinearLayout,并为应用标题指定layout_weight为1。然后我会使用布局权重为2的DashboardLayout作为ImageButtons的2x3网格。

DashboardLayout用于Google I / O 2011应用,又称IOSched,可在http://code.google.com/p/iosched/获得。我建议下载并浏览该代码,以获取该布局如何工作的一些示例。请注意,您必须将一个DashboardLayout.java文件复制到项目中。

如果您正在使用ActionBar,可以使这更简单 - 只需在AndroidManifest.xml中指定Activity的标题,然后在布局的根目录中设置DashboardLayout。应用程序标题不会接近1/3,但它可能更适合Honeycomb / ICS应用程序。