如何对齐屏幕底部的视图?

How do I align views at the bottom of the screen?

提问人:gav 提问时间:3/5/2010 最后编辑:Peter Mortensengav 更新时间:9/24/2019 访问量:622490

问:

这是我的布局代码;

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

左边是左边,右边是我希望它的样子。

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

显而易见的答案是将 TextView 设置为高度fill_parent,但这会导致没有空间留给按钮或输入字段。

从本质上讲,问题在于我希望提交按钮和文本条目在底部是固定高度,而文本视图则填充其余空间。同样,在水平线性布局中,我希望提交按钮包装其内容,并让文本条目填充其余空间。

如果告诉线性布局中的第一个项目fill_parent它就会这样做,不会为其他项目留出空间。如何让线性布局中第一个项目填充除布局中其余项目所需的最小空间之外的所有空间?


相对布局确实是答案:

    <?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>
Android XML 用户界面 android-layout

评论

7赞 gav 4/24/2011
@oneself 油漆;)我在模拟器上使用皮肤,尽管由 Tea Vui Huang 提供 teavuihuang.com/android
19赞 Howler 3/1/2012
+1 用于发布解决该问题的布局 XML。帮助我弄清楚我的问题。

答:

548赞 Janusz 3/5/2010 #1

执行此操作的新式方法是使用 ConstraintLayout,并使用 app:layout_constraintBottom_toBottomOf=“parent” 将视图的底部约束到 ConstraintLayout 的底部

下面的示例创建一个 FloatingActionButton,它将与屏幕的末尾和底部对齐。

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

作为参考,我将保留我的旧答案。

在引入 ConstraintLayout 之前,答案是相对布局


如果你有一个填满整个屏幕的相对布局,你应该能够使用 android:layout_alignParentBottom 将按钮移动到屏幕底部。

如果底部的视图未以相对布局显示,那么它上面的布局可能会占用所有空间。在这种情况下,您可以将视图(应位于底部)放在布局文件中的第一位,然后将布局的其余部分放在视图上方。这使底部视图能够根据需要占用尽可能多的空间,并且布局的其余部分可以填充屏幕的所有其余部分。android:layout_above

评论

6赞 IgorGanapolsky 5/23/2012
仅供参考:这在 ScrollView 中不起作用。这就是我现在面临的问题。查看 stackoverflow.com/questions/3126347/...
6赞 Janusz 5/23/2012
没错,ScrollView 和 Relative Layouts 不能很好地混合。如果您需要很多内容才能在一个页面上显示所有内容,只需使用线性布局并最后放在底部视图中即可。如果希望视图在小屏幕上的滚动视图中最后显示,在大手机上显示在页面底部,请考虑使用不同的布局文件,并使用 ressource 限定符让设备选择正确的布局文件。
0赞 eugene 7/7/2013
还行。。答案的第二段在这里有什么意义?“你应该先找到一个覆盖屏幕底部的布局”?那么我们应该在布局中使用layout_alignParentBottom吗?我们需要什么?android:layout_above
0赞 Janusz 10/18/2014
如果您想要在底部设置一个条形图,然后在此条形图上方使用从屏幕顶部延伸到该条形图的 LinearLayout,则需要上述内容。
1赞 Tomasz Mularczyk 6/28/2015
我在“Android Weekly”之一中读到过会消耗内存,应尽可能避免。that RelativeLayout
20赞 Steve Haley 3/5/2010 #2

您甚至不需要将第二个布局嵌套在第一个布局中。只需在 ButtonEditText 中使用即可。relativeandroid:layout_alignParentBottom="true"

评论

0赞 4/12/2011
请注意,尽管这适用于 Button 和 EditText,但如果您尝试以这种方式对齐 TableLayout,它将不起作用。您必须将其嵌套在另一个 RelativeLayout 中。
164赞 Bram Avontuur 11/5/2010 #3

这在 这是行不通的,因为 会重叠页面底部的任何内容。ScrollViewRelativeLayoutScrollView

我使用动态拉伸修复了它:FrameLayout

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

评论

1赞 manmal 8/30/2011
这很棒 - 而且,它是“最小的侵入性”,并且比 RelativeLayout 方法更直观。如果可以的话,我会投不止一个赞成票!
4赞 Yoann 1/20/2012
我在我的应用程序中使用了您的解决方案,但就我而言,我希望当键盘出现时,按钮停留在屏幕底部(键盘后面)有一个解决方案吗?他克斯。
1赞 nspo 7/13/2012
@DoubleYo:在清单 android:windowSoftInputMode=“adjustPan” 中
2赞 basickarl 11/3/2012
如果您希望底部永久固定,以便一直显示,这是行不通的。否则它可以工作。
46赞 Timores 4/17/2011 #4

上面的答案(由 Janusz 提供)非常正确,但我个人对 RelativeLayouts 并不感到 100% 舒适,所以我更喜欢引入一个“填充物”,空的 TextView,如下所示:

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

在应该在屏幕底部的元素之前。

评论

0赞 Lukap 7/18/2011
这是要扩展到 x 轴还是 y 轴。给出 0dip 的高度会使 textview 没有任何高度吗?还是会尽可能多地扩展,就像 x 轴一样?
0赞 Timores 8/11/2011
这会垂直扩展,因为高度(垂直轴)设置为 0,权重设置为 1(假设其他元素的权重为零)。
0赞 Timores 8/11/2011
在 x 轴上,它将作为其父级 (fill_parent)
0赞 ComeIn 2/28/2017
我不会使用文本视图,而是使用另一种线性布局。布局视图似乎暗示它可以用来填充空间?
75赞 pseudosudo 4/24/2011 #5

您可以通过将相对布局嵌套在线性布局中来保留初始线性布局:

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

评论

2赞 Patrick 6/18/2015
这是一种混乱的方法,因为它不是很模块化。不应有重叠的布局。只要您想要更改 RelativeLayout 的背景或想要放大任何视图或添加视图,此设计将不起作用。
12赞 Kiran Parmar 9/23/2011 #6

如果你不想做很多改变,那么你可以把:

android:layout_weight="1"

对于 ID 为 的 TextView,即@+id/TextView

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

评论

0赞 bk138 11/12/2013
或者使用 android:layout_weight=“1” 添加周围的 LinearLayout - 这在 ScrollView 中也很好用!
29赞 Michael Reed 12/28/2011 #7

这也有效。

<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" to float LinearLayout elements to bottom

评论

12赞 Thomas Dignan 1/18/2012
android:layout_alignParentBottom=“true” 不起作用,除非 LinearLayout 嵌套在 RelativeLayout 中。
0赞 Peter Mortensen 9/24/2019
解释是有序的(例如,本质变化、它是如何工作的、它为什么起作用等)。
1赞 jeremyvillalobos 3/22/2012 #8

我使用了 Janusz 发布的解决方案,但我在最后一个视图中添加了填充,因为我的布局的顶部是 ScrollView。

随着内容的增长,ScrollView 将被部分隐藏。在最后一个视图上使用有助于显示 ScrollView 中的所有内容。android:paddingBottom

41赞 keybee 3/10/2013 #9

您也可以使用 LinearLayout 或 ScrollView 执行此操作。有时它比 RelativeLayout 更容易实现。您唯一需要做的就是在要对齐到屏幕底部的视图之前添加以下视图:

<View
    android:layout_width="wrap_content"
    android:layout_height="0dp"
    android:layout_weight="1" />

这将创建一个空视图,填充空白空间并将下一个视图推送到屏幕底部。

评论

1赞 gumuruh 3/1/2021
这个概念类似于@Timores前面所说的填充物。
0赞 ng-User 7/23/2021
这就是我几个小时以来一直在寻找的东西。谢谢!
4赞 jigar 7/4/2013 #10

在您的 .android:layout_alignParentBottom="true"<RelativeLayout>

这肯定会有所帮助。

评论

1赞 IgorGanapolsky 3/22/2016
这假定用户想要使用 RelativeLayout。
3赞 raihan ahmed 9/5/2013 #11

这也可以通过线性布局来完成。

只需为上面的布局提供高度 = 0dp 和重量 = 1 并在底部提供您想要的布局。只需写高度 = 包装内容,没有重量。

它为布局(包含编辑文本和按钮的布局)提供换行内容,然后具有权重的布局占据布局的其余部分。

我是偶然发现的。

5赞 sharma_kunal 12/17/2013 #12

使用以下代码。将按钮对准 buttom。它正在工作。

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

    <Button
        android:id="@+id/btn_back"
        android:layout_width="100dp"
        android:layout_height="80dp"
        android:text="Back" />

    <TextView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="0.97"
        android:gravity="center"
        android:text="Payment Page" />

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

        <EditText
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"/>

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Submit"/>
    </LinearLayout>

</LinearLayout>
3赞 Prince 4/15/2015 #13

如果您有这样的层次结构:

<ScrollView> 
  |-- <RelativeLayout> 
    |-- <LinearLayout>

首先,应用到 ,然后应用到 .android:fillViewport="true"ScrollViewandroid:layout_alignParentBottom="true"LinearLayout

这对我来说非常有效。

<ScrollView
    android:layout_height="match_parent"
    android:layout_width="match_parent"
    android:scrollbars="none"
    android:fillViewport="true">
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <LinearLayout
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:id="@+id/linearLayoutHorizontal"
            android:layout_alignParentBottom="true">
        </LinearLayout>
    </RelativeLayout>
</ScrollView>
11赞 Madan Sapkota 5/10/2015 #14

创建页页脚,下面是一个示例:

布局 XML

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@color/backgroundcolor"
    tools:context=".MainActivity">

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="40dp"
        android:background="#FF0000">
    </RelativeLayout>

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="40dp"
        android:layout_alignParentBottom="true"
        android:background="#FFFF00">
    </RelativeLayout>

</RelativeLayout>

截屏

Enter image description here

6赞 Shubham A. 5/20/2015 #15

对于此类情况,请始终使用 RelativeLayouts。LinearLayout 不适用于此类用途。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    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" >

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

        <!-- Place your layout here -->

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_gravity="bottom"
        android:orientation="horizontal"
        android:paddingLeft="20dp"
        android:paddingRight="20dp" >

        <Button
            android:id="@+id/setup_macroSavebtn"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="Save" />

        <Button
            android:id="@+id/setup_macroCancelbtn"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="Cancel" />

        </LinearLayout>

</RelativeLayout>
24赞 stevehs17 11/16/2015 #16

Timores 的优雅解决方案之后,我发现以下内容在垂直 LinearLayout 中创建垂直填充,在水平 LinearLayout 中创建水平填充:

<Space
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_weight="1" />

评论

0赞 stevehs17 7/12/2016
@sepehr 在您发现我的解决方案不起作用的情况下,一定有另一个因素在起作用。我刚刚在片段布局中尝试了我的解决方案,它在那里也有效。
0赞 Jan Rabe 1/30/2017
权重在线性布局中受支持,@sepehr它们将在片段、活动、通知、对话框以及;)
0赞 Asim 9/20/2022
这行得通!多么简单的解决方案。
3赞 IgorGanapolsky 2/18/2016 #17

您可以只为顶部子视图(TextView @+id/TextView)提供一个属性:.android:layout_weight="1"

这将迫使其下方的所有其他元素都位于底部。

34赞 KeLiuyue 10/16/2017 #18

1. 在根布局中使用ConstraintLayout

并设置为让屏幕底部的布局:app:layout_constraintBottom_toBottomOf="parent"

<LinearLayout
    android:id="@+id/LinearLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    app:layout_constraintBottom_toBottomOf="parent">
</LinearLayout>

2. 在根布局中使用FrameLayout

只需设置在您的布局中android:layout_gravity="bottom"

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

3. 在根布局中使用 (LinearLayoutandroid:orientation="vertical")

(1) 在你的布局顶部设置一个布局android:layout_weight=“1”

<TextView
    android:id="@+id/TextView"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1"
    android:text="welcome" />

(2) 为 android:layout_width=“match_parent” android:layout_height=“match_parent” android:gravity=“bottom” 设置子 LinearLayout

main 属性是 ,让子 View 放在 Layout 的底部。ndroid:gravity="bottom"

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

4. 在根布局中使用RelativeLayout

并设置为让布局在屏幕底部android:layout_alignParentBottom="true"

<LinearLayout
    android:id="@+id/LinearLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:orientation="horizontal">
</LinearLayout>

输出

Enter image description here