Voici mon code de mise en page ;
<?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 à quoi cela ressemble est à gauche et ce à quoi je veux que cela ressemble est à droite.
![Mise en page Android - actuelle (gauche) et souhaitée (droite)][1]
La réponse évidente est de définir le TextView en fill_parent sur la hauteur, mais cela ne laisse pas de place pour le bouton ou le champ de saisie.
Essentiellement, le problème est que je veux que le bouton d'envoi et le champ de saisie aient une hauteur fixe en bas et que la vue texte remplisse le reste de l'espace. De même, dans la mise en page linéaire horizontale, je souhaite que le bouton d'envoi soit enveloppé dans son contenu et que l'entrée de texte occupe le reste de l'espace.
Si l'on demande au premier élément d'une mise en page linéaire de remplir son parent, c'est exactement ce qu'il fait, ne laissant aucune place aux autres éléments. Comment faire en sorte que le premier élément d'une présentation linéaire remplisse tout l'espace, à l'exception du minimum requis par les autres éléments de la présentation ?
Les mises en page relatives sont en effet la réponse :
<?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>
[1] : https://lh4.ggpht.com/_EW60jqE5_B0/S5D_wMGvK7I/AAAAAAAAALs/p5YdtjqMr-E/s800/Android%20Layout.png
La façon moderne de procéder consiste à avoir un [ConstraintLayout][1] et à contraindre le bas de la vue au bas du ConstraintLayout avec app:layout_constraintBottom_toBottomOf="parent"
.
L'exemple ci-dessous crée un FloatingActionButton qui sera aligné sur la fin et le bas de l'écran.
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_height="match_parent"
android:layout_width="match_parent">
<android.support.design.widget.FloatingActionButton
android:layout_height="wrap_content"
android:layout_width="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
</android.support.constraint.ConstraintLayout>
Pour référence, je vais garder mon ancienne réponse.
Avant l'introduction de ConstraintLayout, la réponse était une [disposition relative][2].
Si vous avez une disposition relative qui remplit tout l'écran, vous devriez pouvoir utiliser [android:layout_alignParentBottom
][3] pour déplacer le bouton vers le bas de l'écran.
Si vos vues en bas de l'écran ne sont pas affichées dans une disposition relative, alors peut-être que la disposition au-dessus d'elle prend tout l'espace. Dans ce cas, vous pouvez placer la vue, qui devrait être en bas, en premier dans votre fichier de disposition et positionner le reste de la disposition au-dessus des vues avec android:layout_above
. Cela permet à la vue du bas de prendre tout l'espace dont elle a besoin, et le reste du layout peut remplir tout le reste de l'écran.
[1] : https://developer.android.com/reference/android/support/constraint/ConstraintLayout [2] : http://developer.android.com/guide/topics/ui/layout/relative.html [3] : http://developer.android.com/reference/android/widget/RelativeLayout.LayoutParams.html#attr_android:layout_alignParentBottom
Dans un ScrollView
, cela ne fonctionne pas, car le RelativeLayout
chevaucherait alors ce qui se trouve dans le ScrollView
en bas de la page.
J'ai résolu ce problème en utilisant un FrameLayout
qui s'étire dynamiquement :
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:fillViewport="true">
<LinearLayout
android:id="@+id/LinearLayout01"
android:layout_width="match_parent"
android:layout_height="match_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="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
</FrameLayout>
<!-- content fixated to the bottom of the screen -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<!-- your bottom content -->
</LinearLayout>
</LinearLayout>
</ScrollView>
Vous n'avez même pas besoin d'imbriquer le deuxième layout relative
dans le premier. Utilisez simplement l'option android:layout_alignParentBottom="true"
dans le Bouton et le EditText.