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

android xml user-interface android-layout

这是我的布局代码；

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

这看起来像在左边，我希望它看起来像在右边。

https://lh4.ggpht.com/_EW60jqE5_B0/S5D_wMGvK7I/AAAAAAAAALs/p5YdtjqMr-E/s800/Android%20Layout.png

显而易见的答案是将 TextView 在高度上设置为 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>

@oneself Paint ;) 我在模拟器上使用了皮肤，虽然由 Tea Vui Huang teavuihuang.com/android 提供

+1 用于发布解决它的布局 XML。帮助我弄清楚我的问题是什么。

Peter Mortensen

执行此操作的现代方法是使用 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 之前，答案是 relative layout。

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

如果您在底部的视图未以相对布局显示，那么它上面的布局可能会占用所有空间。在这种情况下，您可以将应该位于底部的视图首先放在布局文件中，然后使用 android:layout_above 将布局的其余部分放在视图上方。这使得底部视图能够占用所需的空间，并且布局的其余部分可以填满屏幕的所有其余部分。

仅供参考：这在 ScrollView 中不起作用。这是我现在面临的问题。请参阅stackoverflow.com/questions/3126347/…

那是正确的 ScrollViews 和相对布局不能很好地混合。如果你有很多内容要在一页上显示所有内容，只需使用线性布局并最后放入底部视图。如果您希望视图最后出现在小屏幕上的滚动视图中以及较大手机上的页面底部，请考虑使用不同的布局文件并使用资源限定符让设备选择正确的布局文件。

好的..这里答案的第二段有什么意义？ “你应该先找到一个覆盖屏幕底部的布局”？那么我们应该在布局内使用 layout_alignParentBottom 吗？我们需要 android:layout_above 做什么？

如果您想要底部的条形图，然后在此条形图上方有一个从屏幕顶部延伸到条形图的 LinearLayout，则需要上述内容。

我在“Android 周刊”that RelativeLayout 中读过其中一篇文章会消耗内存，应尽可能避免使用。

Mykola

在 ScrollView 中这是行不通的，因为 RelativeLayout 会与页面底部 ScrollView 中的任何内容重叠。

我使用动态拉伸 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>

这很棒 - 而且，它是“微创”，并且比 RelativeLayout 方法更直观。如果可以的话，我会投不止一个赞成票！

我在我的应用程序中使用您的解决方案，但在我的情况下，我希望当键盘出现时，按钮保持在屏幕底部（键盘后面）有解决办法吗？谢谢。

@DoubleYo：在清单中 android:windowSoftInputMode="adjustPan"

如果您希望将底部永久固定，以便始终显示这不起作用。否则它工作。

pseudosudo

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

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

这是一种混乱的方法，因为它不是非常模块化的。你不应该有重叠的布局。当您想要更改 RelativeLayout 的背景或想要使任何视图更大或添加视图时，此设计将不起作用。

Timores

上面的答案（由 Janusz 提出）是非常正确的，但我个人对 RelativeLayouts 感觉不是 100% 满意，所以我更喜欢引入一个“填充”，即空的 TextView，如下所示：

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

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

这会扩展到 x 轴还是 y 轴。给高度 0dip 会使 textview 没有任何高度？还是会尽可能多地扩展到 x 轴？

这会垂直扩展，因为高度（垂直轴）设置为 0，权重设置为 1（假设其他元素的权重为零）。

在 x 轴上，它将作为其父 (fill_parent)

我会使用另一种线性布局，而不是 textview。布局视图似乎暗示它可以用来填充空间？

Peter Mortensen

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

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

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

这个概念类似于@Timores 之前所说的填充物。

这就是我从几个小时以来一直在寻找的东西。谢谢！

Michael Reed

这也有效。

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

https://i.stack.imgur.com/Kln1g.png

android:layout_alignParentBottom="true" 没有效果，除非 LinearLayout 嵌套在 RelativeLayout 中。

解释将是有序的（例如，基本的变化，它是如何工作的，它为什么工作，等等）。

Peter Mortensen

1. 在你的根布局中使用 ConstraintLayout

并设置 app:layout_constraintBottom_toBottomOf="parent" 让 Layout 在屏幕底部：

<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. 在你的根布局中使用 LinearLayout (android: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) 将子 LinearLayout 设置为 android:layout_width="match_parent" android:layout_height="match_parent" android:gravity="bottom"

主要属性是ndroid:gravity="bottom"，让子View在Layout的底部。

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

4.在根Layout中使用RelativeLayout

并设置 android:layout_alignParentBottom="true" 让 Layout 在屏幕底部

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

输出

https://i.stack.imgur.com/UKHiP.png

Peter Mortensen

跟进 Timores's elegant solution，我发现以下内容会在垂直 LinearLayout 中创建垂直填充，在水平 LinearLayout 中创建水平填充：

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

@sepehr 如果您发现我的解决方案不起作用，那么肯定还有另一个因素在起作用。我刚刚在片段布局中尝试了我的解决方案，它也可以在那里工作。

线性布局支持权重，@sepehr 它们也可以在片段、活动、通知、对话框中工作；）

Android

您甚至不需要将第二个 relative 布局嵌套在第一个布局中。只需在 Button 和 EditText 中使用 android:layout_alignParentBottom="true"。

请注意，尽管这适用于 Button 和 EditText，但如果您尝试以这种方式对齐 TableLayout，它将无法正常工作。您必须将它嵌套在另一个RelativeLayout 中。

chiwangc

如果你不想做很多改变，那么你可以放：

android:layout_weight="1"

对于 ID 为 @+id/TextView 的 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>

或者使用 android:layout_weight="1" 添加一个环绕的 LinearLayout - 这在 ScrollView 中也很有效！

Peter Mortensen

创建页眉和页脚，这是一个示例：

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

截屏

https://i.stack.imgur.com/HKAT2.png

Peter Mortensen

对于这种情况，请始终使用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>

Peter Mortensen

使用下面的代码。将按钮与按钮对齐。它正在工作。

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

Jorgesys

在您的 <RelativeLayout> 中使用 android:layout_alignParentBottom="true"。

这肯定会有所帮助。

这假定用户想要使用RelativeLayout。

Prince

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

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

首先，将 android:fillViewport="true" 应用于 ScrollView，然后将 android: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>

IgorGanapolsky

您可以只为您的顶级子视图（TextView @+id/TextView）提供一个属性：android:layout_weight="1"。

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

Peter Mortensen

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

只需为上面的布局和底部的布局提供 Height = 0dp 和 weight = 1。只需写高度 = 包装内容，没有重量。

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

我偶然发现了这一点。

Peter Mortensen

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

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

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

关注公众号

想领先一步获取最新的外包任务吗？

相似问题

平台

支持

联系我们