674 votes

Comment aligner les vues en bas de l'écran?

Voici ma mise en page de code;

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

    <TextView android:text="@string/welcome" 
        android:id="@+id/TextView" 
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content">
    </TextView>

    <LinearLayout android:id="@+id/LinearLayout" 
        android:orientation="horizontal"
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:gravity="bottom">

            <EditText android:id="@+id/EditText" 
                android:layout_width="fill_parent" 
                android:layout_height="wrap_content">
            </EditText>

            <Button android:text="@string/label_submit_button" 
                android:id="@+id/Button" 
                android:layout_width="wrap_content" 
                android:layout_height="wrap_content">
            </Button>

    </LinearLayout>

</LinearLayout>

Ce que cela ressemble est sur la gauche et que je veux qu'elle ressemble est sur la droite.

Android Layout - Actual (Left) and Desired (Right)

La réponse évidente est de mettre le TextView pour fill_parent sur la hauteur, mais cela provoque pas de place à gauche pour le bouton ou champ de saisie. Essentiellement, le problème est que je veux que le bouton submit et la saisie de texte à une hauteur fixe à la partie inférieure et l'affichage de texte pour remplir le reste de l'espace, de la même façon dans le Linéaire horizontal layout que je veux sur le bouton soumettre pour envelopper son contenu et pour la saisie de texte pour remplir le reste de l'espace.

Si le premier élément d'un Linéaire de la Mise en page est dit de fill_parent c'est exactement ce que fait, ne laissant pas de place pour les autres articles, comment puis-je obtenir un élément qui est le premier dans un linéaire de la mise en page à remplir tout l'espace en dehors de la configuration minimale requise par le reste des éléments dans la mise en page?

EDIT:

Relative Mises en page ont été en effet la réponse, je vous Remercie!

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

    <TextView 
        android:text="@string/welcome" 
        android:id="@+id/TextView"
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true">
    </TextView>

    <RelativeLayout 
        android:id="@+id/InnerRelativeLayout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true" >

        <Button 
            android:text="@string/label_submit_button" 
            android:id="@+id/Button"
            android:layout_alignParentRight="true" 
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">
        </Button>

        <EditText 
            android:id="@+id/EditText" 
            android:layout_width="fill_parent"
            android:layout_toLeftOf="@id/Button"
            android:layout_height="wrap_content">
        </EditText>

    </RelativeLayout>

</RelativeLayout>

548voto

Janusz Points 52607

Je pense que vous devriez essayer une relative mise en page.
Si vous avez un parent de mise en page qui remplit tout l'écran, vous devriez être en mesure d'utiliser android:layout_alignParentBottom pour déplacer le bouton vers le bas de l'écran.

Si votre point de vue sur le fond ne sont pas affichés dans une relative mise en page, puis peut-être la mise en page ci-dessus, il prend tout l'espace. Dans ce cas, vous pouvez mettre la vue qui doit être en bas, d'abord dans votre fichier de mise en page et la position du reste de la disposition ci-dessus les points de vue avec android:layout_above. Cela permet l'affichage du bas pour prendre tout l'espace dont il a besoin et le reste de la mise en page peut remplir tout le reste de l'écran.

164voto

Bram Avontuur Points 571

Dans un ScrollView, cela ne fonctionne pas, car RelativeLayout chevauche tout ce qui se trouve dans le ScrollView au bas de la page.

Je l'ai réparé en utilisant un FrameLayout étirement dynamique:

 <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_height="fill_parent" android:layout_width="fill_parent"
        android:fillViewport="true">
    <LinearLayout android:id="@+id/LinearLayout01"
        android:layout_width="fill_parent" android:layout_height="fill_parent"
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical">

                <!-- content goes here -->

                <!-- stretching frame layout, using layout_weight -->
        <FrameLayout
            android:layout_width="fill_parent" android:layout_height="fill_parent"
            android:layout_weight="1">
        </FrameLayout>

                <!-- content fixated to the bottom of the screen -->
        <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="horizontal">
                        <!-- your bottom content -->
        </LinearLayout>
    </LinearLayout>
</ScrollView>
 

75voto

pseudosudo Points 872

Vous pouvez conserver votre disposition linéaire initiale en imbriquant la disposition relative dans la disposition linéaire:

 <LinearLayout
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <TextView android:text="welcome" 
        android:id="@+id/TextView" 
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content">
    </TextView>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <Button android:text="submit" 
            android:id="@+id/Button" 
            android:layout_width="wrap_content" 
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true">
        </Button>
        <EditText android:id="@+id/EditText" 
            android:layout_width="match_parent" 
            android:layout_height="wrap_content"
            android:layout_toLeftOf="@id/Button"
            android:layout_alignParentBottom="true">
        </EditText>
    </RelativeLayout>
</LinearLayout>
 

46voto

Timores Points 9916

La réponse ci-dessus (par Janusz) est tout à fait correcte, mais personnellement, je ne me sens pas à 100% confortable avec RelativeLayouts, donc je préfère introduire un «remplissage», un TextView vide, comme ceci:

 <!-- filler -->
<TextView android:layout_height="0dip" 
          android:layout_width="fill_parent"
          android:layout_weight="1" />
 

avant l'élément qui devrait être au bas de l'écran.

29voto

Michael Reed Points 1662

Cela fonctionne aussi.

 <LinearLayout 
    android:id="@+id/linearLayout4"
    android:layout_width="wrap_content"
    android:layout_height="fill_parent"
    android:layout_below="@+id/linearLayout3"
    android:layout_centerHorizontal="true"
    android:orientation="horizontal" 
    android:gravity="bottom"
    android:layout_alignParentBottom="true"
    android:layout_marginTop="20dp"
>

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" 

    />

    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" 


    />

</LinearLayout>
 

gravity = "bottom" pour faire flotter les éléments LinearLayout en bas

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X