如何使用 LinearLayout 定位 Button 死点
How to position a Button dead center using LinearLayout
我正在尝试将位于 TextView 下方的按钮设置为屏幕的死点。
目前,我只是让它们成为水平居中,而不是垂直居中,所以 Buttons 就在 TextView 的下面,这不是我想要的。
我什至尝试过使用 layout_gravity 而不是重力,但仍然没有成功。
这是我得到的
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
tools:context=".MainActivity">
<TextView android:text="CALCULATOR"
android:id="@+id/appTitle"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical" >
<Button android:text="BASIC MATH"
android:id="@+id/basicMath"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:gravity="center_horizontal|center"
/>
<Button android:text="BASIC ALGEBRA"
android:id="@+id/alg"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:gravity="center_horizontal|center"
/>
<Button android:text="BASIC CALCULUS"
android:id="@+id/calc"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:gravity="center_horizontal|center"
/>
<Button android:text="INFO"
android:id="@+id/info"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:gravity="center_horizontal|center"
/>
</LinearLayout>
更新您的布局如下:-
<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"
tools:context=".MainActivity">
<TextView android:text="CALCULATOR"
android:id="@+id/appTitle"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
/>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
>
<Button android:text="BASIC MATH"
android:id="@+id/basicMath"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:gravity="center_horizontal|center"
/>
<Button android:text="BASIC ALGEBRA"
android:id="@+id/alg"
android:layout_below="@+id/basicMath"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:gravity="center_horizontal|center"
/>
<Button android:text="BASIC CALCULUS"
android:id="@+id/calc"
android:layout_below="@+id/alg"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:gravity="center_horizontal|center"
/>
<Button android:text="INFO"
android:id="@+id/info"
android:layout_below="@+id/calc"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:gravity="center_horizontal|center"
/>
</RelativeLayout></RelativeLayout>
您可以使用 RelativeLayout 作为父级并添加 android:layout_centerInParent="true"
到 LinearLayout
来包装按钮。 LinearLayout
的宽度和高度也应设置为 wrap_content
.
您可以获得以下结果:
使用了以下xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity">
<TextView android:text="CALCULATOR"
android:id="@+id/appTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_centerInParent="true">
<Button android:text="BASIC MATH"
android:id="@+id/basicMath"
android:layout_width="200dp"
android:layout_height="wrap_content"
/>
<Button android:text="BASIC ALGEBRA"
android:id="@+id/alg"
android:layout_width="200dp"
android:layout_height="wrap_content"
/>
<Button android:text="BASIC CALCULUS"
android:id="@+id/calc"
android:layout_width="200dp"
android:layout_height="wrap_content"
/>
<Button android:text="INFO"
android:id="@+id/info"
android:layout_width="200dp"
android:layout_height="wrap_content"
/>
</LinearLayout>
</RelativeLayout>
最后的建议:
使用 LinearLayout match_parent
而不是 fill_parent
因为它在 API 8
之后就被弃用了
我真的受不了嵌套布局,抱歉。
因此我真的不得不提出一个替代方案。
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
>
<TextView
android:text="CALCULATOR"
android:id="@+id/appTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_alignParentTop="true"
/>
<!-- All you need is a little trick -->
<!-- This dummy View is invisible, but it's CENTERED -->
<!-- The 4 Buttons will be positioned in RELATION to this one -->
<!-- This is the power of RelativeLayouts -->
<View
android:id="@+id/vwDummy"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_centerInParent"true"
/>
<!-- These 2 are horizontally centered and go above the dummy -->
<Button
android:text="BASIC ALGEBRA"
android:id="@+id/alg"
android:layout_above="@id/vwDummy"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
/>
<Button
android:text="BASIC MATH"
android:id="@+id/basicMath"
android:layout_above="@id/alg"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
/>
<!-- These 2 are horizontally centered and go below the dummy -->
<Button
android:text="BASIC CALCULUS"
android:id="@+id/calc"
android:layout_below="@id/vwDummy"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
/>
<Button
android:text="INFO"
android:id="@+id/info"
android:layout_below="@id/calc"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
/>
</RelativeLayout>
如评论中所示,我利用了 RelativeLayout 子项的 相对性。
你只需要一个小技巧:
- 在中心创建一个不可见的虚拟视图。
- 将 RELATION 中的 4 个按钮与该按钮对齐。
我正在尝试将位于 TextView 下方的按钮设置为屏幕的死点。
目前,我只是让它们成为水平居中,而不是垂直居中,所以 Buttons 就在 TextView 的下面,这不是我想要的。
我什至尝试过使用 layout_gravity 而不是重力,但仍然没有成功。
这是我得到的
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
tools:context=".MainActivity">
<TextView android:text="CALCULATOR"
android:id="@+id/appTitle"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical" >
<Button android:text="BASIC MATH"
android:id="@+id/basicMath"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:gravity="center_horizontal|center"
/>
<Button android:text="BASIC ALGEBRA"
android:id="@+id/alg"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:gravity="center_horizontal|center"
/>
<Button android:text="BASIC CALCULUS"
android:id="@+id/calc"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:gravity="center_horizontal|center"
/>
<Button android:text="INFO"
android:id="@+id/info"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:gravity="center_horizontal|center"
/>
</LinearLayout>
更新您的布局如下:-
<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"
tools:context=".MainActivity">
<TextView android:text="CALCULATOR"
android:id="@+id/appTitle"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
/>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
>
<Button android:text="BASIC MATH"
android:id="@+id/basicMath"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:gravity="center_horizontal|center"
/>
<Button android:text="BASIC ALGEBRA"
android:id="@+id/alg"
android:layout_below="@+id/basicMath"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:gravity="center_horizontal|center"
/>
<Button android:text="BASIC CALCULUS"
android:id="@+id/calc"
android:layout_below="@+id/alg"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:gravity="center_horizontal|center"
/>
<Button android:text="INFO"
android:id="@+id/info"
android:layout_below="@+id/calc"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:gravity="center_horizontal|center"
/>
</RelativeLayout></RelativeLayout>
您可以使用 RelativeLayout 作为父级并添加 android:layout_centerInParent="true"
到 LinearLayout
来包装按钮。 LinearLayout
的宽度和高度也应设置为 wrap_content
.
您可以获得以下结果:
使用了以下xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity">
<TextView android:text="CALCULATOR"
android:id="@+id/appTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_centerInParent="true">
<Button android:text="BASIC MATH"
android:id="@+id/basicMath"
android:layout_width="200dp"
android:layout_height="wrap_content"
/>
<Button android:text="BASIC ALGEBRA"
android:id="@+id/alg"
android:layout_width="200dp"
android:layout_height="wrap_content"
/>
<Button android:text="BASIC CALCULUS"
android:id="@+id/calc"
android:layout_width="200dp"
android:layout_height="wrap_content"
/>
<Button android:text="INFO"
android:id="@+id/info"
android:layout_width="200dp"
android:layout_height="wrap_content"
/>
</LinearLayout>
</RelativeLayout>
最后的建议:
使用 LinearLayout match_parent
而不是 fill_parent
因为它在 API 8
我真的受不了嵌套布局,抱歉。
因此我真的不得不提出一个替代方案。
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
>
<TextView
android:text="CALCULATOR"
android:id="@+id/appTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_alignParentTop="true"
/>
<!-- All you need is a little trick -->
<!-- This dummy View is invisible, but it's CENTERED -->
<!-- The 4 Buttons will be positioned in RELATION to this one -->
<!-- This is the power of RelativeLayouts -->
<View
android:id="@+id/vwDummy"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_centerInParent"true"
/>
<!-- These 2 are horizontally centered and go above the dummy -->
<Button
android:text="BASIC ALGEBRA"
android:id="@+id/alg"
android:layout_above="@id/vwDummy"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
/>
<Button
android:text="BASIC MATH"
android:id="@+id/basicMath"
android:layout_above="@id/alg"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
/>
<!-- These 2 are horizontally centered and go below the dummy -->
<Button
android:text="BASIC CALCULUS"
android:id="@+id/calc"
android:layout_below="@id/vwDummy"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
/>
<Button
android:text="INFO"
android:id="@+id/info"
android:layout_below="@id/calc"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
/>
</RelativeLayout>
如评论中所示,我利用了 RelativeLayout 子项的 相对性。
你只需要一个小技巧:
- 在中心创建一个不可见的虚拟视图。
- 将 RELATION 中的 4 个按钮与该按钮对齐。