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

yam*_*pog 229 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>
Run Code Online (Sandbox Code Playgroud)

Dan*_*yer 324

扩展fedj的答案,如果设置layout_width0dp并将layout_weight每个按钮设置为1,则可用宽度将在按钮之间平均分配.

  • 要对此进行扩展,如果您不希望按钮的宽度为屏幕的1/3,请将每个按钮包裹在LinearLayout中,并在3 LinearLayouts上设置layout_width ="0dp"和layout_weight ="1".此外,将LinearLayouts上的重力设置为"居中",以便按钮将在每个LinearLayout的中心对齐. (78认同)
  • 就我而言,我使用layout_width =“wrap_content”,并且仅使用layout_weight =“1”效果很好! (2认同)

sto*_*fln 212

如果您不希望按钮缩放,但调整按钮之间的间距(所有按钮之间的间距相等),您可以使用权重="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>
Run Code Online (Sandbox Code Playgroud)

  • 这绝对是最简单,最低开销的方法(对于您希望视图之间的空间扩展而不是视图本身的情况).我正在垂直使用它,所以只需交换宽度和高度值.谢谢. (15认同)
  • 这是一个优雅的解决方案.您可能更喜欢使用`Space`视图类型.使事情更具可读性. (7认同)
  • Ryan,是的,如果您使用的是API 14+(我们应该这样做). (2认同)

San*_*dhu 22

您可以像下面这样使用它.

<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>
Run Code Online (Sandbox Code Playgroud)


Gib*_*olt 21

对此的现代解决方案是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>
Run Code Online (Sandbox Code Playgroud)

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

Flexbox更强大;它是对 的一个很好的补充ConstraintLayout这是了解更多信息的绝佳资源

space_around、space_between 和 space_evenly 之间的区别

  • 感谢您让我(我们)意识到这一点。绝对有用。我使用了“space_around”,当 FlexBox 中有 1 或 3 个可见时,按钮很好地居中 (2认同)

Joo*_*oop 19

您可以通过给双方做ViewSA layout_width0dplayout_weight1:

<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>
Run Code Online (Sandbox Code Playgroud)

android layout_weight的工作方式是:

  • 首先,它看起来View通常采用的大小并保留此空间.
  • 第二,如果布局是match_parent那么它将以s 的比例划分剩余空间layout_weight.因此,如果你给视图layout_weight="2"layout_weight="1",得到的比例为2比1,即:第一视图将得到所留下的空间和其他视图1/3的2/3.

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

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>
Run Code Online (Sandbox Code Playgroud)


mar*_*ear 13

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

您可以使用layout_alignParentBottom将所有按钮与布局底部对齐.使用layout_alignParentLeft and Right的外部按钮和layout_centerHorizontal中按键.

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


fed*_*edj 11

你应该看看android:layout_weight属性

  • 据我了解,layout_weight 属性将拉伸按钮的大小以填充布局。我想保持按钮的大小不变,只增加按钮之间的填充。 (2认同)

Kes*_*hav 8

您应该使用android: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>
Run Code Online (Sandbox Code Playgroud)

为了动态地做到这一点

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

}
Run Code Online (Sandbox Code Playgroud)


Sat*_*pta 6

不要linearLayout将权重设置为Button自身,而是将权重设置为<Space>View,这不会拉伸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>
Run Code Online (Sandbox Code Playgroud)

因为我使用的是 4<Space>我设置了android:weightSum="4"Inlinear layout这也是结果::

布局预览