Mettre des boutons en bas de l'écran avec LinearLayout?

136

J'ai le code suivant, comment faire pour que les 3 boutons soient en bas?

    <TextView
        android:id="@+id/textView1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="60dp"
        android:gravity="center"
        android:text="@string/observer"
        android:textAppearance="?android:attr/textAppearanceLarge"
        tools:context=".asdf"
        android:weight="1" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical" >

        <Button
            android:id="@+id/button1"
            style="?android:attr/buttonStyleSmall"
            android:layout_width="145dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal|center"
            android:text="1" />

        <Button
            android:id="@+id/button2"
            style="?android:attr/buttonStyleSmall"
            android:layout_width="145dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal|center"
            android:text="2" />

        <Button
            android:id="@+id/button3"
            style="?android:attr/buttonStyleSmall"
            android:layout_width="145dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal|center"
            android:text="3" />
    </LinearLayout>

thedeepfield
la source
dans quoi cette vue est-elle enveloppée? une disposition de cadre? Disposition relative?
Nirvana Tikku
1
Votre code contient une faute de frappe. Par android:weight="1"vous vouliez probablement dire android:layout_weight="1". Ce n'est pas votre problème cependant.
Brian Attwell
2
duplicata possible de Comment aligner les vues en bas de l'écran?
Krupa Patel
Il peut être plus facile d'utiliser la disposition de l'espace trouvée dans la boîte à outils. Vous pouvez le placer au-dessus de la mise en page existante au-dessus des boutons et le dimensionner et il les poussera vers le bas.
Alex le

Réponses:

268

Vous devez vous assurer de quatre choses:

  • Votre extérieur LinearLayoutalayout_height="match_parent"
  • Votre intérieur LinearLayouta layout_weight="1"etlayout_height="0dp"
  • Votre TextViewalayout_weight="0"
  • Vous avez correctement réglé la gravité sur votre intérieur LinearLayout: android:gravity="center|bottom"

Notez que fill_parentcela ne signifie pas «occuper tout l'espace disponible». Cependant, si vous utilisezlayout_height="0dp" avec layout_weight="1", alors une vue occupera tout l'espace disponible ( impossible d'obtenir une mise en page correcte avec "fill_parent" ).

Voici un code que j'ai rapidement écrit qui utilise deux LinearLayouts de la même manière que votre code.

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

    <TextView
        android:id="@+id/textView1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="@string/cow"
        android:layout_weight="0"
        android:textAppearance="?android:attr/textAppearanceLarge" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dip"
        android:layout_weight="1"
        android:gravity="center|bottom"
        android:orientation="vertical" >

        <Button
            android:id="@+id/button1"
            style="?android:attr/buttonStyleSmall"
            android:layout_width="145dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal|center"
            android:text="1" />

        <Button
            android:id="@+id/button2"
            style="?android:attr/buttonStyleSmall"
            android:layout_width="145dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal|center"
            android:text="2" />

        <Button
            android:id="@+id/button3"
            style="?android:attr/buttonStyleSmall"
            android:layout_width="145dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal|center"
            android:text="3" />
    </LinearLayout>

</LinearLayout>

Le résultat ressemble à ceci:

entrez la description de l'image ici

Brian Attwell
la source
Voté juste pour la note sur la façon d'obtenir une vue pour remplir tout l'espace disponible! Merci, bonne réponse!
lisa
Ces avertissements de peluche ...!
Yousha Aleayoub
Ce n'est pas la meilleure solution car après cela, vous ne pouvez pas définir la vue au centre de l'écran restant ......................... donc le prix de la meilleure solution va à ceci réponse - stackoverflow.com/a/26140793/4741746
sushant gosavi
Pouvez-vous décrire la signification layout_weight="0"ou ce qu'il fait réellement?
Rahat Zaman
23

Vous pouvez utiliser un RelativeLayoutet l'aligner vers le bas avecandroid:layout_alignParentBottom="true"

Ahmad
la source
1
n'est-il pas possible d'utiliser une disposition linéaire?
thedeepfield
C'est. Comme @AND_DEV l'a déjà dit: Utilisez layout_weight="1". Avec cela, votre LinearLayout occupera la hauteur laissée à l'écran; vous pouvez maintenant régler la gravité de vos boutons en bas.
Ahmad
1
Les mises en page relatives sont difficiles à lire, ne font presque jamais ce que vous voulez et sont généralement horribles à entretenir. Je prendrais le coup de performance de 30 mises en page linéaires sur 1 mise en page relative n'importe quel jour de la semaine, simplement parce que cela évite des heures de violon frustrant.
G_V
@Ahmed je pense que la question posée est très claire comme pour LinearLayout, mais répondu pour RelativityLayout et Brian Attwell a répondu clairement avec android: gravity = "center | bottom"!
Gopi.cs
@ Gopi.cs Je ne sais vraiment pas pourquoi vous commentez une réponse que j'ai donnée il y a plus de 6 (!) Ans. Nous sommes en 2019, utilisez simplement un ConstraintLayout.
Ahmad
12

Créez une mise en page relative et à l'intérieur de cette mise en page, créez votre bouton avec cette ligne

android:layout_alignParentBottom="true"
varghesekutty
la source
2
en plus, l'ajout android:layout_centerHorizontal="true"pour le centrer horizontalement en fait une excellente solution.
Thomas Mondel du
1
Grand tour. Merci
zackygaurav
4

créez d'abord le nom du fichier en y footer.xml insérant ce code.

<?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="78dp"
    android:layout_gravity="bottom"
    android:gravity="bottom"
 android:layout_weight=".15"
    android:orientation="horizontal"
    android:background="@drawable/actionbar_dark_background_tile" >
    <ImageView
        android:id="@+id/lborder"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight=".14"
        android:background="@drawable/action_bar_left_button"
        android:src="@drawable/overlay" />
    <ImageView
        android:id="@+id/unknown"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight=".14"
        android:background="@drawable/action_bar_left_button"
        android:src="@drawable/notcolor" />
    <ImageView
        android:id="@+id/open"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight=".14"
        android:background="@drawable/action_bar_left_button"
        android:src="@drawable/openit"
        />
    <ImageView
        android:id="@+id/color"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight=".14"
        android:background="@drawable/action_bar_left_button"
        android:src="@drawable/colored" />
        <ImageView
        android:id="@+id/rborder"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:background="@drawable/action_bar_left_button"
        android:src="@drawable/frames"
        android:layout_weight=".14" />


</LinearLayout>  

puis créez header.xml et mettez ce code dedans:

<?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="@dimen/action_bar_height"
    android:layout_gravity="top"
    android:baselineAligned="true"
    android:orientation="horizontal"
    android:background="@drawable/actionbar_dark_background_tile" >
    <ImageView
        android:id="@+id/contact"
        android:layout_width="37dp"
        android:layout_height="wrap_content"
        android:layout_gravity="start"
        android:layout_weight=".18"
        android:scaleType="fitCenter"
        android:background="@drawable/action_bar_left_button"
        android:src="@drawable/logo"/>

    <ImageView
        android:id="@+id/share"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_gravity="start"
        android:layout_weight=".14"
        android:background="@drawable/action_bar_left_button"
        android:src="@drawable/share" />

    <ImageView
        android:id="@+id/save"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight=".14"
        android:background="@drawable/action_bar_left_button"
        android:src="@drawable/save" />

    <ImageView
        android:id="@+id/set"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight=".14"
        android:background="@drawable/action_bar_left_button"
        android:src="@drawable/set" />

    <ImageView
        android:id="@+id/fix"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight=".14"
        android:background="@drawable/action_bar_left_button"
        android:src="@drawable/light" />

    <ImageView
        android:id="@+id/rotate"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight=".14"
        android:background="@drawable/action_bar_left_button"
        android:src="@drawable/ic_menu_rotate" />

    <ImageView
        android:id="@+id/stock"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight=".14"
        android:background="@drawable/action_bar_left_button"
        android:src="@drawable/stock" />

</LinearLayout>

puis dans votre main_activity.xmlet mettez ce code à l'intérieur: -

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="fill_parent"
tools:context=".MainActivity"
android:id="@+id/relt"
android:background="@drawable/background" >

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="78dp"
    android:id="@+id/down"
    android:layout_alignParentBottom="true" >

    <include
        android:layout_width="fill_parent"
        android:layout_height="78dp"
        layout="@layout/footer" >
    </include>
</LinearLayout>
<ImageView
    android:id="@+id/view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_above="@+id/down"
    android:layout_alignParentLeft="true"
    android:layout_alignParentRight="true"
    android:layout_below="@+id/inc"
   >  
    </ImageView> 
    <include layout="@layout/header"
        android:id="@+id/inc"
        android:layout_width="fill_parent"
        android:layout_height="50dp"></include> 

bon codage :)

k0sh
la source
L'ordre est-il important? J'ai remarqué que vous aviez mis le pied de page comme premier élément et l'en-tête comme dernier.
Martin Konecny
@MartinKonecny ​​non cela n'a pas d'importance car RelativeLayout a ses propres attributs afin que vous puissiez contrôler où les autres mises en page s'insèrent à l'intérieur. comme: layout_below, etc.
k0sh
3

Vous pouvez le faire en prenant une mise en page Frame comme mise en page parent, puis en y insérant une mise en page linéaire. Voici un exemple:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
 >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">

<TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="5dp"
    android:textSize="16sp"/>


<TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="5dp"      
    android:textSize="16sp"
    />

<TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="5dp"
    android:textSize="16sp"/>

<TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="5dp"
     android:textSize="16sp"/>




</LinearLayout>

<Button
    android:id="@+id/button2"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="10dp"
    android:layout_gravity="bottom"
    />
 </FrameLayout>
Diya Bhat
la source
3
<LinearLayout
 android:id="@+id/LinearLayouts02"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:orientation="vertical"
 android:gravity="bottom|end">

<TextView
android:id="@+id/texts1"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_weight="2"
android:text="@string/forgotpass"
android:padding="7dp"
android:gravity="bottom|center_horizontal"
android:paddingLeft="10dp"
android:layout_marginBottom="30dp"
android:bottomLeftRadius="10dp"
android:bottomRightRadius="50dp"
android:fontFamily="sans-serif-condensed"
android:textColor="@color/colorAccent"
android:textStyle="bold"
android:textSize="16sp"
android:topLeftRadius="10dp"
android:topRightRadius="10dp"/>

</LinearLayout>
Syed Danois Haider
la source
1

Ajoutez simplement layout_weight = "1" dans votre linearLayout qui a des boutons.

Edit: - laissez-moi faire simple

suivez quelque chose comme ci-dessous, le nom des balises peut ne pas être correct, ce n'est qu'une idée

<LL>// Top Parrent LinearLayout
   <LL1 height="fill_parent" weight="1" "other tags as requirement"> <TV /><Butons /></LL1> // this layout will fill your screen.
   <LL2 height="wrap_content" weight="1"  orientation="Horizontal" "other tags as requirement"> <BT1 /><BT2/ ></LL2> // this layout gonna take lower part of button height of your screen

<LL/> TOP PARENT CLOSED
AAnkit
la source
l'ajout d'anroid: layout_weight = "1" ne déplace pas la disposition linéaire (et les boutons) vers le bas ...
thedeepfield
@AND_DEV, vous avez oublié de définir android: gravity. À l'heure actuelle, les boutons seront toujours en haut, même si le LinearLayout qui les contient remplit toute la zone inférieure.
Brian Attwell
Non, les boutons seront dans LL2 et ce sera dans la zone inférieure. Peut définir la gravité si OP veut Button dans la ligne inférieure exacte. Je donnais juste une idée approximative, afin qu'il puisse le faire selon ses besoins.
AAnkit
Dois-je vous lire correctement, que vous utilisez l' LL1élément comme espaceur, donc tout ce qui suit sera en bas? Jolie astuce.
greenoldman
0

Ajouter android:windowSoftInputMode="adjustPan"au manifeste - à l'activité correspondante:

  <activity android:name="MyActivity"
    ...
    android:windowSoftInputMode="adjustPan"
    ...
  </activity>
Oskarko
la source
0

Vous pouvez regrouper vos boutons dans une mise en page relative même si votre mise en page parent est linéaire. Assurez- vous que l' attribut android: layout_height est défini sur match_parent pour le parent le plus externe . Et dans cette balise Button, ajoutez 'android: alignParentBottom = "True"'

vidit pandey
la source