XML ¿Disposición de la tabla? ¿Dos filas de ancho EQUAL se rellenan con botones igualmente anchos?

Question

Aquí hay una parte de mi XML para el formato TIERRA:

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

Y ahora lo que no me llevo - la anchura de una fila y también del botón depende del texto dentro del botón. Si ambos textos son igual de largos, digamos: TEXTO está bien, la mitad de la tabla está en el medio de la pantalla. Pero si tienen un tamaño diferente, digamos "A" y "ESTE ES EL BOTÓN LARGO", el CENTRO de la mesa ya no está en el centro de la pantalla y los botones no son igualmente anchos ...

Answer 1

Tener botones en filas donde los botones son del mismo tamaño que necesita hacer.

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

Y complete las otras propiedades xml para sus botones.

La magia está en las propiedades layout_weight y anchura. No necesita el diseño de la tabla. Estas propiedades le dicen al diseño que sus vistas deben ocupar el mismo espacio en el diseño principal.

Answer 2

Además de la respuesta aceptada:

tuve un problema similar en el que necesitaba varias imágenes en una cuadrícula con anchuras iguales columna, por lo que utiliza un diseño de tabla. Funcionó, pero como las imágenes se cargaban de forma asíncrona, las columnas correspondientes ocupaban todo el ancho hasta que todas las columnas tenían al menos una imagen en ellas.

Lo resolví con la solución de Robby Pond, pero no funcionó para la última fila, que no tenía necesariamente tantas imágenes como las otras filas, estirando esas imágenes para ocupar todo el espacio disponible cuando las quería para caber en las mismas columnas que arriba. Para combatir esto, me llena las columnas vacías restantes de esa fila con vista normal objetos,

utilizando los mismos parámetros de diseño como todas las otras imágenes:

width = 0, weight = 1. Y que solucioné!

Answer 3

El fragmento diseño

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

El código que mediante programación establece propiedades de diseño de botones en la tabla:

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

Niza ejemplo (originalmente de http://androidadvice.blogspot.com/2010/10/tablelayout-columns-equal-width.html)

probado y trabajo:

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