¿Cómo crear un formulario de entrada ordenado de dos columnas en Android?

Question

que desea crear un formulario de entrada y dos columnas ordenadas así:

Mi xml código de diseño hasta el momento:

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:orientation="vertical" > 

    <LinearLayout 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal" > 

     <TextView 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="0.25" 
      android:text="@string/lblTitle" /> 

     <EditText 
      android:id="@+id/txtTitle" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="0.75" 
      android:ems="10" /> 
    </LinearLayout> 

    <LinearLayout 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal" > 

     <TextView 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="0.25" 
      android:text="@string/lblAuthor" /> 

     <EditText 
      android:id="@+id/txtAuthor" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="0.75" 
      android:ems="10" /> 
    </LinearLayout> 

    <LinearLayout 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal" > 

     <TextView 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="0.25" 
      android:text="@string/lblPublisher" /> 

     <EditText 
      android:id="@+id/txtPublisher" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="0.75" 
      android:ems="10" /> 
    </LinearLayout> 

    <LinearLayout 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal" > 

     <TextView 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="0.25" 
      android:text="@string/lblIsbn" /> 

     <EditText 
      android:id="@+id/txtIsbn" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="0.75" 
      android:ems="10" /> 
    </LinearLayout> 

    <LinearLayout 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal" > 

     <View 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="0.25" /> 

     <Button 
      android:id="@+id/btnSubmit" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="0.375" 
      android:text="@string/submit" /> 

     <Button 
      android:id="@+id/btnCancel" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="0.375" 
      android:text="@string/cancel" /> 
    </LinearLayout> 

</LinearLayout> 

Se puede ver que he utilizado LinearLayout utilizando layout_weight & layout_width = Truco "0dp" para hacer que la división de dos columnas se vea clara. En código HTML, podemos usar con% ancho de tamaño. Pero en el diseño xml de Android, no hay% -value para layout_width. Quiero evitar los valores dp codificados para el ancho de columna. ¿Es posible en Android?

Hasta ahora eso es lo mejor que puedo hacer. Ahora quiero cambiar el tamaño del cuadro de texto del ISBN para que sea más pequeño (50% menos del tamaño actual). Pero no puedo cambiar el tamaño del ancho del cuadro de texto, ya que layout_width debe ser "0dp" para que layout_weight funcione. También quiero hacer lo mismo con el tamaño del botón Enviar y Cancelar.

Me pregunto si el uso de LinearLayout es una forma correcta de crear formularios de entrada perfectamente en Android. ¿Podría TableLayout mejorar para esto? Escuché que no puedes cambiar layout_width de vista infantil en TableLayout.

Hay algunas personas aquí que me recomiendan usar RelativeLayout, lo probé pero no es compatible con layout_weight.

Answer 1

Muy bien, me pareció que el camino con LinearLayout. El truco está envolviendo las Vistas que quieres redimensionar con LinearLayout. Entonces, el ancho de la Vista se puede ajustar usando: android: layout_width o android: propiedad de ems.

Este es el código XML:

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:orientation="vertical" > 

    <LinearLayout 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal" > 

     <TextView 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="0.25" 
      android:text="@string/lblTitle" /> 

     <EditText 
      android:id="@+id/txtTitle" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="0.75" 
      android:ems="10" /> 
    </LinearLayout> 

    <LinearLayout 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal" > 

     <TextView 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="0.25" 
      android:text="@string/lblAuthor" /> 

     <EditText 
      android:id="@+id/txtAuthor" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="0.75" 
      android:ems="10" /> 
    </LinearLayout> 

    <LinearLayout 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal" > 

     <TextView 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="0.25" 
      android:text="@string/lblPublisher" /> 

     <EditText 
      android:id="@+id/txtPublisher" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="0.75" 
      android:ems="10" /> 
    </LinearLayout> 

    <LinearLayout 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal" > 

     <TextView 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_gravity="center_vertical" 
      android:layout_weight="0.25" 
      android:text="@string/lblIsbn" /> 

     <LinearLayout 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="0.75" 
      android:orientation="horizontal" > 

      <EditText 
       android:id="@+id/txtIsbn" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:ems="5" /> 
     </LinearLayout> 
    </LinearLayout> 

    <LinearLayout 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal" > 

     <View 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="0.25" /> 

     <LinearLayout 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="0.75" 
      android:orientation="horizontal" > 

      <Button 
       android:id="@+id/btnSubmit" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:ems="5" 
       android:text="@string/submit" /> 

      <Button 
       android:id="@+id/btnCancel" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:ems="5" 
       android:text="@string/cancel" /> 
     </LinearLayout> 
    </LinearLayout> 

</LinearLayout> 

Answer 2

también debe considerar el gridLayout, que se puede utilizar (mediante el uso de una biblioteca de Android) en API7 +.

Aquí hay un enlace: http://android-developers.blogspot.com/2011/11/new-layout-widgets-space-and-gridlayout.html