是否可以在android linearlayout的宽度上均匀分布按钮

时间:2010-08-12 17:36:15

标签: android android-linearlayout

我有一个线性布局(水平定向),包含3个按钮。我希望3个按钮具有固定的宽度,并且均匀分布在线性布局的宽度上。

我可以通过将linearlayout的重力设置为居中,然后调整按钮的填充来管理这个,但这适用于固定宽度,不适用于更改设备或方向。

<LinearLayout android:id="@+id/LinearLayout01" 
android:layout_height="wrap_content" 
android:orientation="horizontal" 
android:layout_width="fill_parent" 
android:gravity="center">

<Button 
android:id="@+id/btnOne"
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:width="120dip"></Button>

<Button 
android:id="@+id/btnTwo"
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:width="120dip"></Button>


<Button 
android:id="@+id/btnThree"
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:width="120dip"></Button>

</LinearLayout>

22 个答案:

答案 0 :(得分:306)

展开fedj's answer,如果您将layout_width设置为0dp并将每个按钮的layout_weight设置为1,则可用宽度将在的按钮。

答案 1 :(得分:204)

如果您不希望按钮缩放,但调整按钮之间的间距(所有按钮之间的间距相等),您可以使用权重=“1”的视图,这将填充按钮之间的空间:

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

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        android:background="@null"
        android:gravity="center_horizontal|center_vertical"
        android:src="@drawable/tars_active" />

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

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        android:background="@null"
        android:gravity="center_horizontal|center_vertical"
        android:src="@drawable/videos_active" />

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

答案 2 :(得分:21)

您可以像以下一样使用它。

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:layout_marginTop="15dp">
    <Space
        android:layout_weight="1"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"/>
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Save"/>
    <Space
        android:layout_weight="1"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"/>
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Reset"/>
    <Space
        android:layout_weight="1"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"/>
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="cancel"/>
    <Space
        android:layout_weight="1"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"/>
</LinearLayout>

答案 3 :(得分:19)

您可以同时为View layout_width 0dplayout_weight 1提供<{1}}:

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

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

    <TextView
        android:layout_width="0dp"
        android:text="example text"
        android:layout_height="wrap_content"
        android:layout_weight="1"/>

</LinearLayout>

android layout_weight的工作方式是:

  • 首先,它会查看View通常会占用的大小并保留此空间。
  • 第二,如果布局为match_parent,那么它会将空间除以layout_weight s的比例。因此,如果您提供了视图layout_weight="2"layout_weight="1",则结果比率将为2比1,即:第一个视图将获得剩余空间的2/3,另一个视图将获得1 / 3。

这就是为什么如果你给layout_width大小0dp,第一步没有任何附加含义,因为两个视图都没有分配任何空格。然后只有第二个点决定每个View获得的空间,从而根据比率给View s指定的空间!

通过提供显示相反的示例来解释为什么0dp会导致空间平均分配:下面的代码会导致一些不同的内容,因为example text现在有一个宽度大于0dp,因为它有wrap_content而不是使剩余的空间小于100%,因为文本占用空间。结果是他们确实获得了50%的可用空间,但文本已经占用了一些空间,因此TextView远远超过总空间的50%

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

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

    <TextView
        android:layout_width="wrap_content"
        android:text="example text"
        android:layout_height="wrap_content"
        android:layout_weight="1"/>

</LinearLayout>

答案 4 :(得分:13)

好吧,如果你有3个按钮,并且如果外部按钮与左侧和右侧对齐就可以(或者甚至计划好),那么您可能想要尝试一个较少开销的RelativeLayout(在许多情况下)

您可以使用layout_alignParentBottom将所有按钮与布局底部对齐。外部按钮使用layout_alignParentLeft and Right,中间按钮使用layout_centerHorizontal

这将适用于不同的方向和屏幕尺寸。

答案 5 :(得分:11)

你应该看看android:layout_weight属性

答案 6 :(得分:9)

对此的现代解决方案是Flexbox

<com.google.android.flexbox.FlexboxLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:justifyContent="space_around"> <!-- or "space_between", "space_evenly" -->

    <Button 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:width="120dp" />

    <Button 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:width="120dp" />

    <Button 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:width="120dp" />
</com.google.android.flexbox.FlexboxLayout>

请确保导入implementation 'com.google.android:flexbox:2.0.0'

Flexbox功能更强大;它是ConstraintLayout的很好的补充。 This is a great resource了解更多信息。

Difference between space_around, space_between, and space_evenly

答案 7 :(得分:4)

为了在水平线性布局中均匀地隔开两个按钮,我使用了3个LinearLayout对象作为空间,这些空间将自动调整大小。我将这些LinearLayout对象定位如下:

[] Button1 [] Button2 []

([]表示用于间距的LinearLayout对象)

然后我将每个[] LinearLayout对象的权重设置为1,并且我得到均匀间隔的按钮。

希望这有帮助。

答案 8 :(得分:4)

我创建了一个自定义视图DistributeLayout来执行此操作。

答案 9 :(得分:4)

我建议你使用LinearLayout的weightSum属性。

添加标签 android:weightSum="3"到您的LinearLayout的xml声明然后android:layout_weight="1"到您的按钮将导致3个按钮均匀分布。

答案 10 :(得分:4)

这可以实现为容器内添加的每个按钮分配 weight ,这对于定义水平方向非常重要:

full_path_filename = 'https://' + settings.AWS_STORAGE_BUCKET_NAME + '.s3.amazonaws.com/' + file_name
fd_img = open(full_path_filename, 'r')

所以我们可以在我们的设备中得到这个结果:

enter image description here

即使我们旋转设备,每个按钮中定义的 weight 也可以在容器中统一分配元素:

enter image description here

答案 11 :(得分:3)

最好的方法是使用TableLayout和android:layout_width =“match_parent”,并在列中使用android:layout_weight =“1”表示所有列

答案 12 :(得分:2)

使用layout_did的上述答案对我不起作用,但以下情况确实如此。

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:layout_weight="0.1"
    android:layout_gravity="center_horizontal"
    >

    <android.support.design.widget.FloatingActionButton
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_gravity="center"
       />

    <android.support.design.widget.FloatingActionButton
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_gravity="center"
        android:layout_marginLeft="40dp"
        android:layout_marginStart="40dp"/>

    <android.support.design.widget.FloatingActionButton
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_gravity="center"
        android:layout_marginLeft="40dp"
        android:layout_marginStart="40dp"
        />

    <android.support.design.widget.FloatingActionButton
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_gravity="center"
        android:layout_marginLeft="40dp"
        android:layout_marginStart="40dp"/>

</LinearLayout>

这就是它在屏幕上的样子,

enter image description here

答案 13 :(得分:2)

您应该使用 android:weightSum 属性的线性布局。给线性布局一个等于布局内按钮数量的 weightSum,然后设置 android:layout_weight="1" 并设置按钮的宽度 android:layout_width="0dp" 此外,您可以使用填充和布局边距来设置布局样式。

<LinearLayout android:id="@+id/LinearLayout01"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:gravity="center"
    android:weightSum="3">
    
    <Button
        android:id="@+id/btnOne"
        android:layout_width="0dp"
        android:text="1"
        android:layout_height="wrap_content"
        android:width="120dip"
        android:layout_weight="1"
        android:layout_margin="15dp" 
        />
    
    <Button
        android:id="@+id/btnTwo"
        android:text="2"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:width="120dip"
        android:layout_weight="1"
        android:layout_margin="15dp" />

    <Button
        android:id="@+id/btnThree"
        android:text="3"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:width="120dip"
        android:layout_weight="1"
        android:layout_margin="15dp" />

</LinearLayout>

为了动态地做

void initiate(Context context){
    LinearLayout parent = new LinearLayout(context);

    parent.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT));
    parent.setWeightSum(3);
    parent.setOrientation(LinearLayout.HORIZONTAL);

    AppCompatButton button1 = new AppCompatButton(context);
    button1.setLayoutParams(new LinearLayout.LayoutParams(0 ,LinearLayout.LayoutParams.WRAP_CONTENT,1.0f));

    AppCompatButton button2 = new AppCompatButton(context);
    button2.setLayoutParams(new LinearLayout.LayoutParams(0 ,LinearLayout.LayoutParams.WRAP_CONTENT,1.0f));

    AppCompatButton button3 = new AppCompatButton(context);
    button3.setLayoutParams(new LinearLayout.LayoutParams(0 ,LinearLayout.LayoutParams.WRAP_CONTENT,1.0f));
    
    parent.addView(button1);
    parent.addView(button2);
    parent.addView(button3);

}

答案 14 :(得分:2)

Equally weighted children

  

创建一个线性布局,其中每个孩子使用相同数量的   屏幕上的空格,设置每个视图的android:layout_height   “0dp”(用于垂直布局)或每个视图的android:layout_width   到“0dp”(对于水平布局)。然后设置android:layout_weight   每个视图为“1”。

为了使其在LinearLayout视图组中有效,android:layout_widthandroid:layout_height的属性值必须等于"match_parent" ...

答案 15 :(得分:2)

最简单,最快捷的方式(但不是最好的方法)是添加一个带有空文本属性的TextView,就像这样

android:text=""

LinearLayout的背景颜色必须相同,那么你可以使用padding属性,就像这样

android:paddingBottom="250dp"

或任何你需要的东西。 Here is an example.

答案 16 :(得分:2)

以上所有答案都是正确的,但如果你需要可见和消失的功能,那么这个实用的方法将很好用

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:orientation="horizontal">

        <Button
            android:id="@+id/btnOne"
            android:layout_width="120dp"
            android:layout_height="match_parent"></Button>

        <Button
            android:id="@+id/btnTwo"
            android:layout_width="120dp"
            android:layout_height="match_parent"></Button>


        <Button
            android:id="@+id/btnThree"
            android:layout_width="120dp"
            android:layout_height="match_parent"></Button>
    </LinearLayout>



 float width=CommonUtills.getScreenWidth(activity);
            int cardWidth=(int)CommonUtills.convertDpToPixel (((width)/3),activity);

LinearLayout.LayoutParams params =
                new LinearLayout.LayoutParams(width,
                        LinearLayout.LayoutParams.MATCH_PARENT);

btnOne.setLayoutParams(params);
btnTwo.setLayoutParams(params);
btnThree.setLayoutParams(params);

public class CommonUtills {
public static float getScreenWidth(Context context) {
        float width = (float) 360.0;
        DisplayMetrics displayMetrics = context.getResources().getDisplayMetrics();
        width = displayMetrics.widthPixels / displayMetrics.density;
        return width;
    }
}

答案 17 :(得分:1)

<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">

<TextView
    android:text="Tom"
    android:layout_width="wrap_content"
    android:layout_height="200dp"
    android:textSize="24sp" />

<TextView
    android:text="Tim"
    android:layout_width="wrap_content"
    android:layout_height="200dp"
    android:textSize="24sp" />

<TextView
    android:text="Todd"
    android:layout_width="wrap_content"
    android:layout_height="200dp"
    android:textSize="24sp" />

答案 18 :(得分:1)

您可以使用this。很容易理解: 由https://developer.android

<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content">

<TextView
    android:text="Tom"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:textSize="24sp" />

<TextView
    android:text="Tim"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:textSize="24sp" />

<TextView
    android:text="Todd"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:textSize="24sp" />

答案 19 :(得分:1)

linearLayout 中,不是给 Button 本身赋予权重,而是将权重设置为 <Space> 查看这不会拉伸 Button

    <?xml version="1.0" encoding="utf-8"?>
    <androidx.constraintlayout.widget.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_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:weightSum="4"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.955">

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

        <Button
            android:layout_width="48dp"
            android:layout_height="48dp"
            android:background="@drawable/ic_baseline_arrow_back_24" />

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

        <Button
            android:id="@+id/captureButton"
            android:layout_width="72dp"
            android:layout_height="72dp"
            android:background="@drawable/ic_round_camera_24" />

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

        <Button
            android:id="@+id/cameraChangerBtn"
            android:layout_width="48dp"
            android:layout_height="48dp"
            android:background="@drawable/ic_round_switch_camera_24" />

        <Space
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_weight="1" />
    </LinearLayout>

    </androidx.constraintlayout.widget.ConstraintLayout>

当我使用 4 <Space> 时,我在 android:weightSum="4" 中设置了 linear layout 这也是结果 ::

layout preview

答案 20 :(得分:0)

如果您希望 3 个按钮具有固定宽度并均匀分布在布局的宽度上...为什么不使用约束布局?

html_*

答案 21 :(得分:0)

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:text="Tom"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:textSize="24sp" 
        android:layout_weight="3"/>

    <TextView
        android:text="Tim"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:textSize="24sp"
        android:layout_weight="3"/>

    <TextView
        android:text="Todd"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:textSize="24sp" 
        android:layout_weight="3"/>

</LinearLayout>

在圈子里,Tom,Tim和Todd被假定为3厘米。如果你想要它触摸屏幕,把它当作汤姆和蒂姆假设为1厘米,这意味着它们结合虚拟但其2D平面在底部。这将显示在屏幕上。