Android 如何并排放置 4 个按钮(顶部 2 个,底部 2 个)?
How do you put 4 buttons side by side (2 on top, 2 on bottom) for Android?
我正在尝试创建 4 个图像按钮,它们的位置如下所示:
左上角---右上角
左下---右下
如果重要的话,我正在使用 LinearLayout。这是我到目前为止得到的(所有 4 个都有相同的代码):
<ImageButton
android:background="@drawable/pic"
android:id="@+id/multiButton"
android:layout_width="150dip"
android:layout_height="150dip"
android:text="cool"
android:textSize="50sp"
android:textStyle="bold"/>
我也试过将 layout_width 设置为 "fill_parent",将 layout_height 设置为 "wrap_content",但仍然没有帮助。
如果您使用相对布局作为这 4 个按钮的父级,那么您可以在按钮中使用,例如左下角,如下所示。您可以通过使用类似的参数对右上角、左上角和右下角应用相同的参数。
android:layout_alignParentLeft="true"
android:layout_alignParentBottom="true"
在线性布局中这样做需要线性布局的嵌套(这也是推荐相对布局的原因)伪代码如下:
<Linear-layout-parent>
orientation: vertical
<Linear-layout-a>
orientation: horizontal
align: parentTop/wrapcontent
<btn1 align:left/>
<btn2 align:right/>
</Linear-layout-a>
<Linear-layout-b>
orientation: horizontal
align: parentBottom/wrapcontent
<btn3 align:left/>
<btn4 align:right/>
</Linear-layout-b>
</Linear-layout-parent>
尝试使用 RelativeLayout,
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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/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:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:text="Button" />
<Button
android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:text="Button" />
<Button
android:id="@+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:text="Button" />
</RelativeLayout>
输出:
只需将此 xml 复制到您的布局中,您就会看到所有按钮在 4 个不同的角上对齐。
<?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" >
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button1" />
<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button2"
android:layout_alignParentRight="true"/>
<Button
android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button3"
android:layout_alignParentBottom="true" />
<Button
android:id="@+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button4"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true" />
</RelativeLayout>
试试这个
<Linear-layout-parent>
orientation: vertical
<Linear-layout-a>
orientation: horizontal
align: parentTop/wrapcontent
weightsum="100"
<btn1 align:left
weight="50"
height="wrapcontent"
width=0dp/>
<btn2 align:right
weight="50"
height="wrapcontent"
width=0dp/>
</Linear-layout-a>
<Linear-layout-b>
orientation: horizontal
align: parentBottom/wrapcontent
weightsum="100"
<btn3
weight="50"
height="wrapcontent"
width=0dp/>
<btn4
weight="50"
height="wrapcontent"
width=0dp/>
</Linear-layout-b>
</Linear-layout-parent>
试试这个代码。
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/LinearLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout
android:id="@+id/header"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal">
<LinearLayout
android:id="@+id/header1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="start"
android:layout_weight="1"
android:orientation="vertical" >
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
</LinearLayout>
<LinearLayout
android:id="@+id/header2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:layout_weight="1"
android:orientation="vertical" >
<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:text="Button" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="@+id/child"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
tools:context="com.example.stack.MainActivity" >
<LinearLayout
android:id="@+id/child1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_weight="1"
android:orientation="vertical" >
<Button
android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="start"
android:text="Button" />
</LinearLayout>
<LinearLayout
android:id="@+id/child2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_weight="1"
android:orientation="vertical" >
<Button
android:id="@+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:text="Button" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
我正在尝试创建 4 个图像按钮,它们的位置如下所示: 左上角---右上角
左下---右下
如果重要的话,我正在使用 LinearLayout。这是我到目前为止得到的(所有 4 个都有相同的代码):
<ImageButton
android:background="@drawable/pic"
android:id="@+id/multiButton"
android:layout_width="150dip"
android:layout_height="150dip"
android:text="cool"
android:textSize="50sp"
android:textStyle="bold"/>
我也试过将 layout_width 设置为 "fill_parent",将 layout_height 设置为 "wrap_content",但仍然没有帮助。
如果您使用相对布局作为这 4 个按钮的父级,那么您可以在按钮中使用,例如左下角,如下所示。您可以通过使用类似的参数对右上角、左上角和右下角应用相同的参数。
android:layout_alignParentLeft="true"
android:layout_alignParentBottom="true"
在线性布局中这样做需要线性布局的嵌套(这也是推荐相对布局的原因)伪代码如下:
<Linear-layout-parent>
orientation: vertical
<Linear-layout-a>
orientation: horizontal
align: parentTop/wrapcontent
<btn1 align:left/>
<btn2 align:right/>
</Linear-layout-a>
<Linear-layout-b>
orientation: horizontal
align: parentBottom/wrapcontent
<btn3 align:left/>
<btn4 align:right/>
</Linear-layout-b>
</Linear-layout-parent>
尝试使用 RelativeLayout,
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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/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:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:text="Button" />
<Button
android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:text="Button" />
<Button
android:id="@+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:text="Button" />
</RelativeLayout>
输出:
只需将此 xml 复制到您的布局中,您就会看到所有按钮在 4 个不同的角上对齐。
<?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" >
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button1" />
<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button2"
android:layout_alignParentRight="true"/>
<Button
android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button3"
android:layout_alignParentBottom="true" />
<Button
android:id="@+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button4"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true" />
</RelativeLayout>
试试这个
<Linear-layout-parent>
orientation: vertical
<Linear-layout-a>
orientation: horizontal
align: parentTop/wrapcontent
weightsum="100"
<btn1 align:left
weight="50"
height="wrapcontent"
width=0dp/>
<btn2 align:right
weight="50"
height="wrapcontent"
width=0dp/>
</Linear-layout-a>
<Linear-layout-b>
orientation: horizontal
align: parentBottom/wrapcontent
weightsum="100"
<btn3
weight="50"
height="wrapcontent"
width=0dp/>
<btn4
weight="50"
height="wrapcontent"
width=0dp/>
</Linear-layout-b>
</Linear-layout-parent>
试试这个代码。
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/LinearLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout
android:id="@+id/header"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal">
<LinearLayout
android:id="@+id/header1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="start"
android:layout_weight="1"
android:orientation="vertical" >
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
</LinearLayout>
<LinearLayout
android:id="@+id/header2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:layout_weight="1"
android:orientation="vertical" >
<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:text="Button" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="@+id/child"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
tools:context="com.example.stack.MainActivity" >
<LinearLayout
android:id="@+id/child1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_weight="1"
android:orientation="vertical" >
<Button
android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="start"
android:text="Button" />
</LinearLayout>
<LinearLayout
android:id="@+id/child2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_weight="1"
android:orientation="vertical" >
<Button
android:id="@+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:text="Button" />
</LinearLayout>
</LinearLayout>
</LinearLayout>