Mise en page du tableau XML? Deux rangées EQUAL-largeur remplies avec des boutons de largeur égale?

Question

est ici 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 n'obtiens pas - la largeur d'une ligne et aussi du bouton dépend du texte à l'intérieur du bouton. Si les deux textes sont égaux, disons: TEXT son ok - la moitié de la table est au milieu de l'écran. Mais si elles ont une taille différente - disons "A" et "C'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

boutons dans les lignes 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 de table. Ces propriétés indiquent à la présentation que vos vues doivent occuper un espace égal dans la mise en page parente.

Answer 2

En plus de la réponse acceptée:

J'ai eu un problème similaire où je avais besoin de plusieurs images dans une grille avec des largeurs de colonnes égales, donc j'ai utilisé une mise en page de table. Cela a fonctionné, mais comme les images étaient chargées de manière asynchrone, les colonnes correspondantes occupaient toute la largeur jusqu'à ce que toutes les colonnes aient au moins une image. J'ai résolu cela en utilisant la solution de Robby Pond, mais cela n'a pas fonctionné pour la dernière rangée, qui n'avait pas nécessairement autant d'images que les autres rangées, étirant ces images pour prendre tout l'espace disponible quand je les voulais pour tenir dans les mêmes colonnes que ci-dessus. Pour lutter contre cela, je remplissais les autres colonnes vides de cette ligne avec des objets réguliers de vue,

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

width = 0, weight = 1. Et qui l'a résolu!

Answer 3

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 programme propriétés de mise en page des boutons dans la table:

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); 
    } 
} 

Answer 4

exemple de Nice (à l'origine de http://androidadvice.blogspot.com/2010/10/tablelayout-columns-equal-width.html)

a été testée et travail:

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