web-dev-qa-db-fra.com

TableLayout à 2 colonnes avec 50% exactement pour chaque colonne

Celui-ci me laisse perplexe depuis mes premiers pas avec Android. Je ne peux pas faire les deux colonnes dans un TableLayout à 2 colonnes exactement 50% chacune.

Voici un exemple:

<ScrollView
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_height="wrap_content"
    Android:layout_width="fill_parent" >

    <TableLayout
        Android:id="@+id/tablelayout"
        Android:layout_height="wrap_content"
        Android:layout_width="fill_parent"
        Android:paddingRight="2dip" >

        <TableRow>
            <TextView
                style="@style/TextViewStandard"
                Android_layout_span="2"
                Android:layout_weight="1" 
                Android:text="Bla" />
        </TableRow>

        <TableRow>
            <TextView
                style="@style/TextViewStandard"
                Android:layout_weight="1"
                Android:text="Name:" />

            <EditText
                style="@style/EditTextStandard"
                Android:id="@+id/et_name"
                Android:layout_weight="1" />
        </TableRow>

        <TableRow>
            <TextView
                style="@style/TextViewStandard"
                Android:layout_weight="1"
                Android:text="URL:" />

            <EditText
                style="@style/EditTextStandard"
                Android:id="@+id/et_url"
                Android:layout_weight="1" />
        </TableRow>

        <TableRow>
            <Button
                style="@style/ButtonStandard"
                Android:layout_column="0"
                Android:layout_marginTop="6dip"
                Android:onClick="onClickOk"
                Android:text="@Android:string/ok" />
        </TableRow>
    </TableLayout>
</ScrollView>

Et voici la définition de style correspondante:

<resources>
    <style name="ButtonStandard" parent="@Android:style/Widget.Button">
        <item name="Android:layout_height">wrap_content</item>
        <item name="Android:layout_width">fill_parent</item>
    </style>

    <style name="EditTextStandard" parent="@Android:style/Widget.EditText">
        <item name="Android:layout_height">wrap_content</item>
        <item name="Android:layout_marginLeft">2dip</item>
        <item name="Android:layout_marginRight">2dip</item>
        <item name="Android:layout_marginTop">2dip</item>
        <item name="Android:layout_width">fill_parent</item>
    </style>

    <style name="TextViewStandard" parent="@Android:style/Widget.TextView">
        <item name="Android:layout_height">wrap_content</item>
        <item name="Android:layout_marginLeft">2dip</item>
        <item name="Android:layout_marginRight">2dip</item>
        <item name="Android:layout_marginTop">2dip</item>
        <item name="Android:layout_width">fill_parent</item>
        <item name="Android:textColor">@Android:color/white</item>
    </style>
</resources>

Cela devient vraiment gâché par un CheckBox impliqué.

Quel est le problème avec ma définition?

Merci beaucoup d'avance . HJW

androidlayoutresources
33
Harald Wilhelm

Avez-vous essayé de définir l'attribut Android:layout_width sur 0dp (et bien sûr de conserver le Android:layout_weight en tant que 1) sur les vues enfant?

Je me trouvais dans des scénarios similaires lorsque je souhaitais également répartir l’espace donné de manière égale entre deux vues d’enfant, mais j’ai échoué puisque l’enfant au "contenu plus large" est également devenu plus large que son frère. Cela était dû au fait que l'enfant plus large avait une largeur initiale plus grande. S'assurer que les deux enfants ont commencé avec la même largeur (Android:layout_width="0dp" sur les deux) garantit également une répartition égale de l'espace entre eux.

66
dbm

C'est comme ça que je formate mes tables uniformément. Ne faites pas partie de votre question, mais couvrez toutes les colonnes Android: layout_span = "2" sur les autres enfants TableRow ne contenant pas l'attribut Android: layout_column. J'espère que cela t'aides.

<TableLayout 
  Android:id="@+id/tableLayout1"
  Android:layout_width="fill_parent"
  Android:layout_height="wrap_content"
  Android:stretchColumns="0,1">

    <TableRow
      Android:id="@+id/tableRow1"
      Android:layout_width="fill_parent"
      Android:layout_height="wrap_content">

        <TextView
          Android:id="@+id/textView1"
          Android:layout_column="0">
        </TextView>

        <TextView
          Android:id="@+id/textView2"
          Android:layout_column="1">
        </TextView>

    </TableRow>

</TableLayout>
26
outkkast

Je voudrais créer une disposition de table À l'intérieur d'une disposition de cadre tenant votre contrôle. Dans cet exemple, j'ai une disposition de deux colonnes et je mets deux ImageView centrés dans chaque colonne.

    <TableLayout 
        Android:layout_width="fill_parent"
        Android:layout_height="fill_parent"
        Android:stretchColumns="1">

        <TableRow>
            <FrameLayout 
                Android:layout_height="wrap_content"
                Android:layout_width="0dp"
                Android:layout_weight="1">

                <ImageView Android:layout_width="wrap_content" 
                    Android:layout_height="wrap_content" 
                    Android:src="@drawable/button_wedding_day_cheat_sheet" 
                    Android:id="@+id/buttonWeddingDayCheatSheet"
                    Android:onClick="onClickWeddingDayCheatSheet"
                    Android:layout_gravity="center_horizontal">
                </ImageView>
            </FrameLayout>

            <FrameLayout 
                Android:layout_height="wrap_content"
                Android:layout_width="0dp"
                Android:layout_weight="1">
                <ImageView Android:layout_width="wrap_content" 
                    Android:layout_height="wrap_content" 
                    Android:src="@drawable/button_share_favorite_recipe" 
                    Android:id="@+id/buttonShareFavoriteRecipe"
                    Android:onClick="onClickShareFavoriteRecipe"
                    Android:layout_gravity="center_horizontal">
                </ImageView>
                </FrameLayout>
            </TableRow>

    </TableLayout>
17
Edmar Miyake

Les colonnes de la table Android s’adaptent toujours à la vue la plus large, quelle que soit la ligne. Il n'y a pas de contrôles explicites ici des colonnes. La vue en grille permet de mieux contrôler la taille de la colonne, telle que: Android: columnWidth = "100dp"

Si les vues de gauche et de droite de la table avaient la même taille, une table centrée pourrait comporter deux colonnes espacées de 50%. 

0
Lumis