Disposition de la table XML? Deux rangées de largeur ÉGALE remplies de boutons de largeur égale?

Question

Salut voici une partie de mon XML pour le format LAND:

 <TableLayout
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:layout_gravity="center"
    android:stretchColumns="*">
<TableRow>    
    <Button
        android:id="@+id/countbutton"
        android:text="@string/plus1"/>      
    <Button
        android:id="@+id/resetbutton"
        android:text="@string/reset" 
        />  
</TableRow>
</TableLayout>
 

Et maintenant, ce que je ne comprends pas - la LARGEUR d'une ligne et aussi du bouton dépend du TEXTE à l'intérieur du bouton. Si les deux textes sont également longs, disons: TEXTE, ça va - la moitié du tableau est au milieu de l'écran. Mais s'ils ont des tailles différentes - disons "A" et "CECI EST LE BOUTON LONG" le CENTRE de la table n'est plus au milieu de l'écran et donc les boutons ne sont pas de largeur égale ...

Answer 1

Pour avoir des boutons dans des rangées où les boutons sont de la même taille que vous devez faire.

     <LinearLayout android:orientation="horizontal" 
         android:layout_width="fill_parent"
         android:layout_height="fill_parent">
         <Button android:layout_weight="1" 
             android:layout_height="wrap_content" 
             android:layout_width="0dip"/>
         <Button android:layout_weight="1" 
             android:layout_height="wrap_content" 
             android:layout_width="0dip"/>
    </LinearLayout>
 

Et remplissez les autres propriétés xml de vos boutons.

La magie réside dans les propriétés layout_weight et width. Vous n'avez pas besoin de la disposition du tableau. Ces propriétés indiquent à la disposition que vos vues doivent occuper un espace égal dans la disposition parent.

Answer 2

En plus de la accepté de répondre:

J'ai eu un problème similaire où j'ai eu besoin de plusieurs images en une grille avec l'égalité des largeurs de colonne, j'ai donc utilisé un tableau de mise en page. Il a travaillé, mais comme les images chargés de manière asynchrone, les colonnes correspondantes prendrait toute la largeur jusqu'à ce que toutes les colonnes ont eu au moins une image en eux.

J'ai résolu ce problème en utilisant Robby de l'Étang de la solution, mais il ne fonctionne pas pour la dernière ligne, qui n'a pas forcément besoin d'autant d'images que les autres lignes, l'étirement de ces images à utiliser tout l'espace disponible quand j'ai voulu à s'adapter dans les mêmes colonnes comme ci-dessus. Pour lutter contre cela, j'ai rempli le reste des colonnes vides de cette ligne régulière d'Afficher des objets,

en utilisant les mêmes paramètres de mise en page comme toutes les autres images:

width = 0, weight = 1. Et que résolu!

Answer 3

Bel exemple (originellement de http://androidadvice.blogspot.com/2010/10/tablelayout-columns-equal-width.html )

Testé et fonctionnel:

 <TableRow>
  <!-- Column 1 -->
  <TextView
     android:id="@+id/tbl_txt1"
     android:layout_width="0dip"
     android:layout_height="wrap_content"
     android:background="@color/red"
     android:textColor="@color/white"
     android:padding="10dip"
     android:layout_margin="4dip"
     android:layout_weight="1"
     android:text="Column 1" />

  <!-- Column 2 -->
  <TextView
     android:id="@+id/tbl_txt2"
     android:layout_width="0dip"
     android:layout_height="wrap_content"
     android:background="@color/red"
     android:textColor="@color/white"
     android:padding="10dip"
     android:layout_margin="4dip"
     android:layout_weight="1"
     android:text="Column 2" />

  <!-- Column 3 -->
  <TextView
     android:id="@+id/tbl_txt3"
     android:layout_width="0dip"
     android:layout_height="wrap_content"
     android:background="@color/red"
     android:textColor="@color/white"
     android:padding="10dip"
     android:layout_margin="4dip"
     android:layout_weight="1"
     android:text="Column 3" />
</TableRow>
 

Answer 4

L'extrait de mise en page

 <TableLayout
    android:id="@+id/tablelayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />
 

Le code qui définit par programme les propriétés de disposition des boutons dans le tableau:

 public void addButtons(View view) {
    TableLayout tableLayout = (TableLayout) findViewById(R.id.tablelayout);
    Context context = getApplicationContext();
    tableLayout.removeAllViews();

    for (int rowIndex = 0; rowIndex < ROWS; rowIndex++) {
        TableRow row = new TableRow(context);
        for (int columnIndex = 0; columnIndex < COLUMNS; columnIndex++) {
            Button btn = new Button(context);
            LayoutParams buttonParams = new LayoutParams(0,
                    LayoutParams.WRAP_CONTENT, 1f);
            btn.setLayoutParams(buttonParams);
            row.addView(btn);
        }
        tableLayout.addView(row);
    }
}