首页 > 解决方案 > 如何在线性布局中设置视图,使其适合从开始到结束的屏幕,并在一行中包含一定数量的元素?

问题描述

我在 LinearLayout 中有 14 条(视图)水平线,它应该适合任何屏幕,所以是否知道如何设置线之间的宽度以适应任何屏幕尺寸的从头到尾?查看图像的外观: 截图




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


        <View
            android:id="@+id/one"
            android:layout_width="1dp"
            android:layout_height="match_parent"
            android:background="@color/blueTextColor" />
        
        <View
            android:id="@+id/two"
            android:layout_width="1dp"
            android:layout_height="match_parent"
            android:layout_marginStart="27dp"
            android:background="@color/blueTextColor"/>
        <View/>
        <View/>
        <View/>
        <View/>
        <View/>
        <View/>
        <View/>
        <View/>
        <View/>
        <View/>
        <View
            android:id="@+id/fourteen"
            android:layout_width="1dp"
            android:layout_height="match_parent"
            android:layout_marginStart="27dp"
            android:background="@color/blueTextColor" />


    </LinearLayout>

我试试这个,但它不起作用

标签: androidxmlandroid-layoutuser-interface

解决方案


我不确定,但我认为@GuseeMofiddin 的答案不能按您的意愿工作,因为它将视图扩展到整个宽度并且您希望它只是1dp. 您可以使用约束布局和链来做到这一点。例子:

  1. 像这样创建您的布局:
<androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:orientation="horizontal">

    <View
        android:id="@+id/one"
        android:layout_width="1dp"
        android:layout_height="match_parent"
        android:background="#0000AA" />

    <View
        android:id="@+id/two"
        android:layout_width="1dp"
        android:layout_height="match_parent"
        android:background="#0000AA" />

    <View
        android:id="@+id/three"
        android:layout_width="1dp"
        android:layout_height="match_parent"
        android:background="#0000AA" />

    <View
        android:id="@+id/four"
        android:layout_width="1dp"
        android:layout_height="match_parent"
        android:background="#0000AA" />

</androidx.constraintlayout.widget.ConstraintLayout>
  1. 现在您必须创建水平链。

首先,全选(点击one,按住Shift,然后点击four

在此处输入图像描述

接下来右键单击并选择此:

在此处输入图像描述

您的 XML 文件应如下所示:

<androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:orientation="horizontal">

    <View
        android:id="@+id/one"
        android:layout_width="1dp"
        android:layout_height="match_parent"
        android:background="#0000AA"
        app:layout_constraintEnd_toStartOf="@+id/two"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent" />

    <View
        android:id="@+id/two"
        android:layout_width="1dp"
        android:layout_height="match_parent"
        android:background="#0000AA"
        app:layout_constraintEnd_toStartOf="@+id/three"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/one" />

    <View
        android:id="@+id/three"
        android:layout_width="1dp"
        android:layout_height="match_parent"
        android:background="#0000AA"
        app:layout_constraintEnd_toStartOf="@+id/four"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/two" />

    <View
        android:id="@+id/four"
        android:layout_width="1dp"
        android:layout_height="match_parent"
        android:background="#0000AA"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/three" />

</androidx.constraintlayout.widget.ConstraintLayout>

两种不同设备上的结果:

在此处输入图像描述

(此方法不会在左右边缘创建视图。要做到这一点,只需添加左右边缘之一,然后创建链但不包括它们)


编辑以回答评论:要将底部和顶部边距添加到特定视图您必须设置height顶部0dp和底部约束并将顶部和底部约束设置为父级的顶部和底部。视图应如下所示:

<View
    android:id="@+id/two"
    android:layout_width="1dp"
    android:layout_height="0dp"
    android:layout_marginTop="10dp"
    android:layout_marginBottom="10dp"
    android:background="#0000AA"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toStartOf="@+id/three"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toEndOf="@+id/one"
    app:layout_constraintTop_toTopOf="parent"
    />

推荐阅读