如何在线性布局中设置视图,使其适合从开始到结束的屏幕,并在一行中包含一定数量的元素?
Posted
技术标签:
【中文标题】如何在线性布局中设置视图,使其适合从开始到结束的屏幕,并在一行中包含一定数量的元素?【英文标题】:How to set the views in linear layout so that it fits in from start to end screen with a certain number of elements that are in a one row? 【发布时间】:2020-12-15 05:15:42 【问题描述】:我在 LinearLayout 中有 14 条(视图)水平线,它应该适合任何屏幕,所以是否知道如何设置线之间的宽度以适应任何屏幕尺寸的从头到尾? 查看图像的外观: screenshots
<LinearLayout
android:layout_
android:layout_
android:orientation="horizontal">
<View
android:id="@+id/one"
android:layout_
android:layout_
android:background="@color/blueTextColor" />
<View
android:id="@+id/two"
android:layout_
android:layout_
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_
android:layout_
android:layout_marginStart="27dp"
android:background="@color/blueTextColor" />
</LinearLayout>
我尝试了这个,但它不起作用
【问题讨论】:
【参考方案1】:我不确定,但我认为 @GuseeMofiddin 的答案不能如您所愿,因为它将视图扩展到全宽,您希望它只是 1dp
。您可以使用约束布局和链来做到这一点。示例:
-
像这样创建您的布局:
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_
android:layout_
android:orientation="horizontal">
<View
android:id="@+id/one"
android:layout_
android:layout_
android:background="#0000AA" />
<View
android:id="@+id/two"
android:layout_
android:layout_
android:background="#0000AA" />
<View
android:id="@+id/three"
android:layout_
android:layout_
android:background="#0000AA" />
<View
android:id="@+id/four"
android:layout_
android:layout_
android:background="#0000AA" />
</androidx.constraintlayout.widget.ConstraintLayout>
-
现在您必须创建水平链。
首先,全选(点击one
,按住Shift,然后点击four
)
接下来右击并选择这个:
您的 XML 文件应如下所示:
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_
android:layout_
android:orientation="horizontal">
<View
android:id="@+id/one"
android:layout_
android:layout_
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_
android:layout_
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_
android:layout_
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_
android:layout_
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_
android:layout_
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"
/>
【讨论】:
【参考方案2】:你只需要设置
android:weightSum="14"
到你的父母 LinearLayout 和
android:layout_weight="1"
您的孩子的意见,请试试这个,
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_
android:layout_>
<LinearLayout
android:layout_
android:layout_
android:orientation="horizontal"
android:weightSum="14">
<View
android:layout_
android:layout_
android:layout_weight="1"
android:background="#000" />
<View
android:layout_
android:layout_
android:layout_weight="1"
android:background="#fff" />
<View
android:layout_
android:layout_
android:layout_weight="1"
android:background="#000" />
<View
android:layout_
android:layout_
android:layout_weight="1"
android:background="#fff" />
<View
android:layout_
android:layout_
android:layout_weight="1"
android:background="#000" />
<View
android:layout_
android:layout_
android:layout_weight="1"
android:background="#fff" />
<View
android:layout_
android:layout_
android:layout_weight="1"
android:background="#000" />
<View
android:layout_
android:layout_
android:layout_weight="1"
android:background="#000" />
<View
android:layout_
android:layout_
android:layout_weight="1"
android:background="#000" />
<View
android:layout_
android:layout_
android:layout_weight="1"
android:background="#000" />
<View
android:layout_
android:layout_
android:layout_weight="1"
android:background="#000" />
<View
android:layout_
android:layout_
android:layout_weight="1"
android:background="#000" />
<View
android:layout_
android:layout_
android:layout_weight="1"
android:background="#000" />
<View
android:layout_
android:layout_
android:layout_weight="1"
android:background="#000" />
</LinearLayout>
</RelativeLayout>
【讨论】:
以上是关于如何在线性布局中设置视图,使其适合从开始到结束的屏幕,并在一行中包含一定数量的元素?的主要内容,如果未能解决你的问题,请参考以下文章
React-native:如何在布局(视图)的背景中设置图像