帶有圖像按鈕的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應用程序。