Mise en page Android pour les boutons avec des images

Question

J'essaie de créer une mise en page Android qui utilise environ 1/3 de l'écran pour un titre d'application. Et puis pour les 2/3 restants, il y a 6 boutons espacés uniformément en rangées de 2, sur 3 colonnes. Dans chaque bouton contiendra du texte et une image qui pourrait potentiellement varier en taille. J'ai beaucoup lu et je n'ai pas encore trouvé de façon parfaite de le faire. J'ai un exemple qui fonctionne principalement à l'exception de quelques-uns de mes boutons sont de tailles différentes et donc cela ne fonctionne pas (les boutons sont de tailles différentes). De plus, je ne sais pas si cela fonctionnera avec des téléphones de différentes tailles. Quoi qu'il en soit, si quelqu'un pouvait jeter un oeil à cette mise en page XML et peut-être suggérer une meilleure façon. Merci.

<?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

Je voudrais utiliser un LinearLayout haut niveau et spécifiez layout_weight de 1 pour le titre de l'application. Ensuite, j'utiliser un DashboardLayout avec un layout_weight de 2 pour la grille 2x3 de ImageButtons. DashboardLayout a été utilisé dans l'application Google I/O 2011, alias IOSched, disponible au http://code.google.com/p/iosched/. Je vous recommande de télécharger et de parcourir ce code pour obtenir des exemples de la façon dont cette mise en page fonctionne. Notez que vous devrez copier ce fichier DashboardLayout.java dans votre projet.

Vous pouvez rendre cela encore plus simple si vous utilisez une ActionBar - il suffit de spécifier le titre de votre activité dans le fichier AndroidManifest.xml, puis de définir DashboardLayout à la racine de votre mise en page. Le titre de l'application ne sera pas proche de 1/3, mais il s'intégrera probablement mieux avec les applications Honeycomb/ICS.