Android TableLayout con el ancho de la columna diferente en una fila

Estoy tratando de hacer mi primera interfaz gráfica de usuario compleja, pero ahora no puedo resolver este problema.

introduzca la descripción de la imagen aquí

La primera columna de las dos primeras filas sólo tiene que contener la etiqueta, mientras que la segunda columna de las dos primeras filas debe ocupar el espacio restante.

En esta instantánea el problema que he notado es que la primera columna es más grande de lo que me gustaría.

Este es el pedazo de código que implementa esa pieza de diseño.

... ... <TableLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margin="5dp" android:background="@drawable/linear_layout_background" android:stretchColumns="*" android:shrinkColumns="*"> <TableRow android:id="@+id/tableRow1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="20dp" > <TextView android:id="@+id/textViewPlateValueLabel" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/plateValue" android:textAppearance="?android:attr/textAppearanceLarge" /> <TextView android:id="@+id/productID" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/back" android:ems="5" android:text="@string/blank" android:textAppearance="?android:attr/textAppearanceLarge" /> </TableRow> <TableRow android:id="@+id/tableRow2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="20dp" > <TextView android:id="@+id/ztlLabel" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/ztl" android:textAppearance="?android:attr/textAppearanceLarge" /> <TextView android:id="@+id/ztlShow" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/back" android:text="@string/blank" android:textAppearance="?android:attr/textAppearanceLarge" /> </TableRow> <TableRow android:id="@+id/tableRow3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="20dp" android:gravity="center" > <TextView android:id="@+id/isAllowed" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/blank" android:background="@drawable/back" android:textAppearance="?android:attr/textAppearanceLarge" /> </TableRow> </TableLayout> ... ... 

Además, puesto que son realmente impráctico, quisiera pedirle un cierto consejo sobre los mejores acercamientos a utilizar que esto.

3 Solutions collect form web for “Android TableLayout con el ancho de la columna diferente en una fila”

Puedes intentar usar layout_weight como este:

  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" android:orientation="horizontal" tools:context=".MainActivity" > <TableLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margin="5dp" android:background="#ff00ff" android:stretchColumns="*" android:shrinkColumns="*"> <TableRow android:id="@+id/tableRow1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="5dp" > <TextView android:id="@+id/textViewPlateValueLabel" android:layout_weight="3" android:layout_width="0dp" android:layout_height="wrap_content" android:text="Label1:" android:textAppearance="?android:attr/textAppearanceLarge" /> <TextView android:id="@+id/productID" android:layout_weight="7" android:layout_width="0dp" android:layout_height="wrap_content" android:background="#00ff00" android:ems="5" android:text="Some Text" android:textAppearance="?android:attr/textAppearanceLarge" /> </TableRow> <TableRow android:id="@+id/tableRow2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="5dp" > <TextView android:layout_weight="3" android:id="@+id/ztlLabel" android:layout_width="0dp" android:layout_height="wrap_content" android:text="Label2:" android:textAppearance="?android:attr/textAppearanceLarge" /> <TextView android:layout_weight="7" android:id="@+id/ztlShow" android:layout_width="0dp" android:layout_height="wrap_content" android:background="#00ff00" android:text="Some Text" android:textAppearance="?android:attr/textAppearanceLarge" /> </TableRow> <TableRow android:id="@+id/tableRow3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="20dp" android:gravity="center" > <TextView android:id="@+id/isAllowed" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Some Text" android:background="#0088ff" android:textAppearance="?android:attr/textAppearanceLarge" /> </TableRow> </TableLayout> </LinearLayout> 

No usaría TableLayout, si fuera usted. Probablemente usaría LinearLayout o RelativeLayout. Puede obtener el mismo efecto con algunos de los atributos XML. Esto es similar a usar el atributo de table de HTML vs. usar div s para simular tablas.

Así, en lugar de una tabla, puede tener LinearLayout dentro de LinearLayout para simular una tabla.

Aunque canDroid , podría ser suficiente para algunos de nosotros, no funcionó para mí, he intentado todo tipo de trucos para hacer que el TableLayout funcione. He encontrado LinearLayout mucho más fácil de usar, aquí es un ejemplo de TableLayout "como" el diseño utilizando LinearLayout , pocas células con una miniatura, y pocos sin.

 <LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="vertical"> <LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="horizontal" tools:layout_editor_absoluteX="0dp" tools:layout_editor_absoluteY="0dp"> <TextView android:id="@+id/textView3" android:layout_width="match_parent" android:layout_height="94dp" android:layout_margin="5dp" android:text="@string/nut1" /> </LinearLayout> <View android:layout_width="395dp" android:layout_height="2dp" android:background="@color/colorPrimary" tools:layout_editor_absoluteX="8dp" tools:layout_editor_absoluteY="0dp" /> <LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="horizontal" tools:layout_editor_absoluteX="0dp" tools:layout_editor_absoluteY="0dp"> <ImageView android:layout_width="94dp" android:layout_height="94dp" android:adjustViewBounds="false" android:background="@drawable/one" android:contentDescription="@string/nut3" android:cropToPadding="false" android:saveEnabled="false" android:scaleType="center" /> <TextView android:id="@+id/textView1" android:layout_width="match_parent" android:layout_height="94dp" android:layout_margin="10dp" android:text="@string/nut3" /> </LinearLayout> </LinearLayout> 
  • Cursor no es visible en EditText cuando se agrega dinámicamente la vista
  • TableRow no envuelve TextView
  • Disposición de respuesta de Android
  • Datos dinámicamente de datos de tabla de Android
  • TableRow llenar el espacio restante
  • Problemas de la suma de peso de TableLayout
  • Cómo dar frontera para tablerow en tablelayout en android?
  • Cómo combinar fila en una celda en la disposición de la tabla en android, dinámicamente?
  • Las filas añadidas dinámicamente en tablelayout no son visibles
  • Cómo agregar editText.addTextChangedListener en TableLayout
  • Rellene TableLayout con android: layout_weight de forma programática
  • FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.