带有图像按钮的Android布局

Question

我正在尝试创建一个使用应用程序标题大约1/3屏幕的android布局。然后对于其他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> 

Answer 1

我会用一个顶级的LinearLayout和应用标题指定1 layout_weight。然后，我会使用一个DashboardLayout，对于ImageButton的2x3网格，layout_weight为2。

DashboardLayout用于谷歌I/O 2011应用程序，又名IOSched，可用于http://code.google.com/p/iosched/。我建议下载并浏览该代码，以了解该布局如何工作的一些示例。请注意，您必须将该DashboardLayout.java文件复制到您的项目中。

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