0

这是一个专门针对的问题ConstraintLayout- 我们可以在使用UI 元素的宽度时将其margins用作属性或属性。layout_constraintWidth_percent

示例 - 我的 UI 中心有一个按钮,其左右两侧有一些空白区域。说这样的话——

  • Approach1 - 使用“marginLeft”和“marginRight”

    <Button
        android:id="@+id/button"
        android:layout_width="0dp"
        android:layout_height="40dp"
        android:layout_marginLeft="24dp"
        android:layout_marginRight="24dp"
        android:text="@string/button"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

或者

  • Approach2 - 使用“app:layout_constraintWidth_percent”

    <Button
        android:id="@+id/button"
        android:layout_width="0dp"
        android:layout_height="40dp"
        app:layout_constraintWidth_percent="0.8"
        android:text="@string/button"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

以下哪种方式会更有效地呈现 UI 元素?

4

2 回答 2

1

利润

无论是 Web 开发还是 Android 开发,边距都是定位和样式用户界面元素的标准参数。它在容器外部提供了额外的空间/间隙......
简单来说,margin 意味着向外推。

layout_constraintWidth_percent

我们想要实现如下所示的布局。有两个 ImageView。两者都应该占据屏幕宽度的 50%。

预期结果:

在此处输入图像描述

解决方案:

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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">

    <ImageView
        android:id="@+id/textA"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintWidth_percent=".5"
        tools:src="@tools:sample/avatars" />

    <ImageView
        android:id="@+id/textB"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="1"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintWidth_percent=".5"
        tools:src="@tools:sample/avatars" />

</android.support.constraint.ConstraintLayout>

在此处输入图像描述

解释:

我们使用layout_constraintWidth_percent根据屏幕宽度以百分比值设置视图的宽度。

于 2021-02-08T07:48:13.023 回答
1

对于这两种方法的效率,两者之间不会有任何差异,至少您可以测量(IMO),但两种方法并不相同。

设置

android:layout_marginLeft="24dp"
android:layout_marginRight="24dp"

无论ConstraintLayout 的宽度如何,都将在ConstraintLayout24dp的右侧和左侧放置边距。视图的宽度将占据宽度的其余部分,这将根据ConstraintLayout的宽度而变化。

如果你设置

app:layout_constraintWidth_percent="0.8"

那么视图的宽度将是ConstraintLayout宽度的 80%,并且每个边距(左右)将有效地是ConstraintLayout宽度的 10%(20% 的 1/2)。因此,视图的宽度及其边距将根据ConstraintLayout的宽度而变化。

如果它对您的设计真的无关紧要,那么只需选择一个。但由于两种布局方式不同,我会查看您支持的最小屏幕和最大屏幕上的布局,并包括横向/纵向等任何其他替代布局。您可能会发现有充分的理由喜欢一个胜过另一个。

于 2021-02-08T13:10:58.733 回答