Hoe lijn ik weergaven aan de onderkant van het scherm uit?

Hier's mijn layout 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>

Hoe dit eruit ziet staat links en hoe ik wil dat het eruit ziet staat rechts.

Android Layout - Werkelijke (Links) en Gewenste (Rechts)]1

Het voor de hand liggende antwoord is om de TextView in te stellen op fill_parent on height, maar dit zorgt ervoor dat er geen ruimte overblijft voor de knop of het invoerveld.

In wezen is het probleem dat ik wil dat de verzendknop en de tekstinvoer onderaan een vaste hoogte hebben en dat de tekstweergave de rest van de ruimte vult. Op dezelfde manier wil ik in de horizontale lineaire lay-out dat de verzendknop zijn inhoud omhult en dat de tekstinvoer de rest van de ruimte vult.

Als het eerste item in een lineaire layout wordt verteld om fill_parent te vullen, doet het precies dat, waardoor er geen ruimte overblijft voor andere items. Hoe kan ik ervoor zorgen dat het eerste element in een lineaire opmaak alle ruimte opvult, behalve het minimum dat de rest van de elementen in de opmaak nodig hebben?


Relatieve lay-outs waren inderdaad het antwoord:

    <?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>
Oplossing

De moderne manier om dit te doen is om een ConstraintLayout te hebben en de onderkant van de view te constrainen naar de onderkant van de ConstraintLayout met app:layout_constraintBottom_toBottomOf="parent"

Het onderstaande voorbeeld maakt een FloatingActionButton die zal worden uitgelijnd aan het einde en de onderkant van het scherm.





Ter referentie zal ik mijn oude antwoord bewaren.

Voor de introductie van ConstraintLayout was het antwoord een relatieve lay-out.


Als je een relatieve layout hebt die het hele scherm vult, zou je android:layout_alignParentBottom moeten kunnen gebruiken om de knop naar de onderkant van het scherm te verplaatsen.

Als uw weergaven aan de onderkant niet worden weergegeven in een relatieve lay-out dan is het mogelijk dat de lay-out erboven alle ruimte inneemt. In dit geval kunt u de view, die onderaan zou moeten staan, als eerste in uw layout-bestand zetten en de rest van de layout boven de views plaatsen met android:layout_above. Hierdoor kan het onderste aanzicht zoveel ruimte innemen als het nodig heeft, en kan de rest van de opmaak de rest van het scherm vullen.

Commentaren (6)

In een ScrollView werkt dit niet, omdat de RelativeLayout dan zou overlappen wat er in de ScrollView onderaan de pagina staat.

Ik heb het opgelost door gebruik te maken van een dynamisch uitrekkende FrameLayout :















Commentaren (4)

Je hoeft de tweede relatieve layout niet eens in de eerste te nesten. Gebruik gewoon de android:layout_alignParentBottom="true" in de Button en EditText.

Commentaren (1)