元素之间的Android布局间距答案

【问题标题】：Android layout spacing between elements元素之间的Android布局间距
【发布时间】：2021-10-16 18:13:18
【问题描述】：

我有以下 xml 布局：

我目前的结果：

我想要的结果：

我必须确保将 currentTime 和 endTime 放在左侧，而不是将 screenRotationButton 放在右侧。

使用下面的 FocusAwareSeekBar，如图所示。

你建议我如何出行？

编辑：

<LinearLayout
                android:id="@+id/bottomControls"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_alignParentBottom="true"
                android:gravity="center"
                android:minHeight="40dp"
                android:orientation="horizontal"
                android:paddingLeft="@dimen/player_main_controls_padding"
                android:paddingRight="@dimen/player_main_controls_padding">

                <TextView
                    android:id="@+id/playbackCurrentTime"
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"
                    android:gravity="center"
                    android:minHeight="30dp"
                    android:text="-:--:--"
                    android:textColor="@android:color/white"
                    tools:ignore="HardcodedText"
                    tools:text="1:06:29" />

                <TextView
                    android:id="@+id/separated"
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"
                    android:gravity="center"
                    android:paddingLeft="4dp"
                    android:paddingRight="4dp"
                    android:minHeight="30dp"
                    android:text="/"
                    android:textColor="@android:color/white"
                    tools:ignore="HardcodedText"
                    tools:text="/" />

                <TextView
                    android:id="@+id/playbackEndTime"
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"
                    android:gravity="center"
                    android:text="-:--:--"
                    android:textColor="@android:color/white"
                    tools:ignore="HardcodedText"
                    tools:text="1:23:49" />

                <org.schabi.newpipe.views.FocusAwareSeekBar
                    android:id="@+id/playbackSeekBar"
                    style="@style/Widget.AppCompat.SeekBar"
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_marginTop="2dp"
                    android:layout_weight="1"
                    tools:progress="25"
                    tools:secondaryProgress="50" />

                <TextView
                    android:id="@+id/playbackLiveSync"
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"
                    android:background="?attr/selectableItemBackground"
                    android:gravity="center"
                    android:paddingLeft="4dp"
                    android:paddingRight="4dp"
                    android:text="@string/duration_live"
                    android:textAllCaps="true"
                    android:textColor="@android:color/white"
                    android:visibility="gone"
                    tools:ignore="HardcodedText,RtlHardcoded,RtlSymmetry" />

                <androidx.appcompat.widget.AppCompatImageButton
                    android:id="@+id/screenRotationButton"
                    android:layout_width="40dp"
                    android:layout_height="40dp"
                    android:layout_marginStart="4dp"
                    android:background="?attr/selectableItemBackground"
                    android:clickable="true"
                    android:focusable="true"
                    android:padding="@dimen/player_main_buttons_padding"
                    android:scaleType="fitCenter"
                    android:visibility="gone"
                    app:srcCompat="@drawable/ic_fullscreen"
                    app:tint="@color/white"
                    tools:ignore="ContentDescription,RtlHardcoded"
                    tools:visibility="visible" />
            </LinearLayout>

【问题讨论】：

标签： android xml android-layout android-linearlayout android-custom-view

【解决方案1】：

如你所见here

android:gravity 设置使用它的View 的内容（即其子视图）的比重。

android:layout_gravity 设置 View 或 Layout 相对于其父级的重力。

使用LinearLayout 上的android:gravity="center"，您可以处理内部所有元素的重力，因此请摆脱它。

相反，将android:layout_gravity 设置为内部元素，start 用于左侧，end 用于右侧。

另一种方法请检查ConstraintLayout

【讨论】：

我编辑了帖子，添加了更多信息。通过更好地修复代码。如果可能的话，我可以请你审查此事。

【解决方案2】：

您可以通过ConstraintLayout联系它

   <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:id="@+id/bottomControls"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:gravity="center"
    android:minHeight="40dp"
    android:orientation="horizontal"
    android:paddingLeft="@dimen/player_main_controls_padding"
    android:paddingRight="@dimen/player_main_controls_padding">

    <TextView
        android:id="@+id/playbackCurrentTime"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:gravity="center"
        android:minHeight="30dp"
        android:text="-:--:--"
        android:textColor="@android:color/white"
        app:layout_constraintEnd_toStartOf="@+id/separated"
        app:layout_constraintStart_toStartOf="parent"
        tools:ignore="HardcodedText"
        tools:text="1:06:29" />

    <TextView
        android:id="@+id/separated"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:gravity="center"
        android:minHeight="30dp"
        android:paddingLeft="4dp"
        android:paddingRight="4dp"
        android:text="/"
        android:textColor="@android:color/white"
        app:layout_constraintEnd_toStartOf="@+id/playbackEndTime"
        app:layout_constraintStart_toEndOf="@+id/playbackCurrentTime"
        tools:ignore="HardcodedText"
        tools:text="/" />

    <TextView
        android:id="@+id/playbackEndTime"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:gravity="center"
        android:text="-:--:--"
        android:textColor="@android:color/white"
        app:layout_constraintStart_toEndOf="@+id/separated"
        app:layout_constraintEnd_toStartOf="@+id/playbackLiveSync"
        tools:ignore="HardcodedText"
        tools:text="1:23:49" />

    <org.schabi.newpipe.views.FocusAwareSeekBar
        android:id="@+id/playbackSeekBar"
        style="@style/Widget.AppCompat.SeekBar"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintEnd_toStartOf="@+id/screenRotationButton"
        android:layout_gravity="center"
        android:layout_marginTop="2dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/playbackCurrentTime"
        android:layout_weight="1"
        tools:progress="25"
        tools:secondaryProgress="50" />

    <TextView
        android:id="@+id/playbackLiveSync"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:background="?attr/selectableItemBackground"
        android:gravity="center"
        android:paddingLeft="4dp"
        android:paddingRight="4dp"
        android:text="@string/duration_live"
        android:textAllCaps="true"
        android:textColor="@android:color/white"
        android:visibility="gone"
        app:layout_constraintEnd_toStartOf="@+id/screenRotationButton"
        app:layout_constraintStart_toEndOf="@+id/playbackEndTime"
        tools:ignore="HardcodedText,RtlHardcoded,RtlSymmetry" />

    <androidx.appcompat.widget.AppCompatImageButton
        android:id="@+id/screenRotationButton"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_marginStart="4dp"
        android:background="?attr/selectableItemBackground"
        android:clickable="true"
        android:focusable="true"
        android:padding="@dimen/player_main_buttons_padding"
        android:scaleType="fitCenter"
        android:visibility="gone"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/playbackLiveSync"
        app:srcCompat="@drawable/ic_fullscreen"
        app:tint="@color/white"
        tools:ignore="ContentDescription,RtlHardcoded"
        tools:visibility="visible" />

</androidx.constraintlayout.widget.ConstraintLayout>

在playbackEndTime 上使用android:layout_width="0dp"，您告诉组件占用整个空白空间，该视图具有。所以playbackEndTime之后定义的所有东西都会放在右边

【讨论】：

我按照您所说的进行了尝试，但它给了我中心放置的播放结束时间的问题。我编辑了帖子，更多信息也清理了代码，你能帮我吗？
@Paul ，我已经更新了答案。请检查
这是我从你的代码中得到的结果：i.stack.imgur.com/L9fQU.png

【解决方案3】：

修改@anatoli 的答案，你可以试试下面的代码来达到你想要的结果。我在 3 个 textView 之间创建了一个链，以便它们始终粘在一起。另外，还有一个 textView 我不明白它的用法，所以我暂时没有将它包含在链中，并且默认全屏按钮始终粘在右侧。

另外，我认为 fullScreen 按钮的高度和宽度应为 24dp，因为它看起来更像是发布的所需屏幕截图。

<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:id="@+id/bottomControls"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:gravity="center"
    android:minHeight="40dp"
    android:orientation="horizontal"
    android:paddingLeft="@dimen/player_main_controls_padding"
    android:paddingRight="@dimen/player_main_controls_padding">

    <TextView
        android:id="@+id/playbackCurrentTime"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:gravity="center"
        android:minHeight="30dp"
        android:text="-:--:--"
        android:textColor="@android:color/white"
        app:layout_constraintEnd_toStartOf="@+id/separated"
        app:layout_constraintHorizontal_chainStyle="packed"
        app:layout_constraintStart_toStartOf="parent"
        tools:ignore="HardcodedText"
        tools:text="1:06:29" />

    <TextView
        android:id="@+id/separated"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:gravity="center"
        android:minHeight="30dp"
        android:paddingLeft="4dp"
        android:paddingRight="4dp"
        android:text="/"
        android:textColor="@android:color/white"
        app:layout_constraintEnd_toStartOf="@+id/playbackEndTime"
        app:layout_constraintStart_toEndOf="@+id/playbackCurrentTime"
        tools:ignore="HardcodedText"
        tools:text="/" />

    <TextView
        android:id="@+id/playbackEndTime"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:gravity="center"
        android:minHeight="30dp"
        android:text="-:--:--"
        android:textColor="@android:color/white"
        app:layout_constraintStart_toEndOf="@+id/separated"
        tools:ignore="HardcodedText"
        tools:text="1:23:49" />

    <org.schabi.newpipe.views.FocusAwareSeekBar
        android:id="@+id/playbackSeekBar"
        style="@style/Widget.AppCompat.SeekBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginTop="2dp"
        app:layout_constraintTop_toBottomOf="@+id/playbackCurrentTime"
        tools:progress="25"
        tools:secondaryProgress="50" />

    <TextView
        android:id="@+id/playbackLiveSync"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:background="?attr/selectableItemBackground"
        android:gravity="center"
        android:paddingLeft="4dp"
        android:paddingRight="4dp"
        android:text="@string/duration_live"
        android:textAllCaps="true"
        android:textColor="@android:color/white"
        android:visibility="gone"
        app:layout_constraintEnd_toStartOf="@+id/screenRotationButton"
        app:layout_constraintStart_toEndOf="@+id/playbackEndTime"
        tools:ignore="HardcodedText,RtlHardcoded,RtlSymmetry" />

    <androidx.appcompat.widget.AppCompatImageButton
        android:id="@+id/screenRotationButton"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_marginStart="4dp"
        android:background="?attr/selectableItemBackground"
        android:clickable="true"
        android:focusable="true"
        android:padding="@dimen/player_main_buttons_padding"
        android:scaleType="fitCenter"
        android:visibility="gone"
        app:layout_constraintBottom_toBottomOf="@id/playbackCurrentTime"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="@id/playbackCurrentTime"
        app:srcCompat="@drawable/ic_fullscreen"
        app:tint="@color/white"
        tools:ignore="ContentDescription,RtlHardcoded"
        tools:visibility="visible" />
</androidx.constraintlayout.widget.ConstraintLayout>

【讨论】：