首页 文章

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

提问于
浏览 次
600

这是我的布局代码;

<?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 user-interface android-layout

18 回答

  • 15

    您可以给您的顶级子视图（TextView @+id/TextView ）一个属性： android:layout_weight="1" .

    这将强制它下面的所有其他元素到底 .

    回复于
  • 0

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

    回复于
  • 2

    对于这样的情况，请始终使用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>
    回复于
  • 500

    在 <RelativeLayout> 中使用 android:layout_alignParentBottom="true" .

    这肯定会有所帮助 .

    回复于
  • 4

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

    <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>
    回复于
  • 29

    继Timores的优雅解决方案之后，我发现以下内容在垂直LinearLayout中创建了一个垂直填充，在水平LinearLayout中创建了一个水平填充：

    <Space
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_weight="1" />
    回复于
  • 18

    现代的方法是使用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 将布局的其余部分放在视图上方 . 这使得底部视图可以占用所需的空间，其余布局可以填充屏幕的其余部分 .

    回复于
  • 2

    我使用了Janusz发布的解决方案，但添加了填充到最后一个View，因为我的布局的顶部是ScrollView . 随着内容的增长，ScrollView将被部分隐藏 . 在最后一个View上使用android：paddingBottom有助于显示ScrollView中的所有内容 .

    回复于
  • 67

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

    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>
    回复于
  • 0

    使用下面的代码对齐按钮来设置它的工作

    <?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>
    回复于
  • 2

    您也可以使用LinearLayout或ScrollView执行此操作 . 有时，实现RelativeLayout更容易 . 您唯一需要做的是添加以下视图 before 要对齐到屏幕底部的视图：

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

    这将创建一个空视图，填充空白区域并将下一个视图推送到屏幕底部 .

    回复于
  • 39

    这也有效 .

    <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

    回复于
  • 27

    在 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>
    回复于
  • 11

    上面的答案（由Janusz提供）是非常正确的，但我个人并不觉得100％与RelativeLayouts相容，所以我更喜欢引入一个'填充'，空TextView，如下所示：

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

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

    回复于
  • 3

    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.在根布局中使用LinearLayout（android：orientation =“vertical”）

    (1)Set a layout android:layout_weight="1" on the top of the your Layout

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

    (2)Set the child LinearLayout for android:layout_width="match_parent" android:layout_height="match_parent" android:gravity="bottom"

    主要属性是 ndroid:gravity="bottom" ，让子视图在Layout的底部 .

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

    OUTPUT

    回复于
  • 144

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

    <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>
    回复于
  • 13

    创建HEADER和FOOTER，这是一个例子

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

    [ Screenshot ]

    enter image description here

    希望这有用 . 谢谢！！

    回复于
  • 7

    这也可以通过线性布局来完成 . 只需在上面的布局中提供Height = 0dp和weight = 1，在底部提供你想要的那个只是写高度=换行内容而不是重量 . 它的作用是为布局提供包装内容（包含编辑文本和按钮的内容），然后具有权重的内容占据布局的其余部分 . 我偶然发现了这个 .

    回复于

相关问题