ConstraintLayout：将 TextView 的中心垂直对齐到有偏移的位置

Question

我想在图形的一些众所周知的位置上创建标签。为此，我必须将“Enable”TextView 的 vertical center exactly 对齐在图形的第一条水平线上，与 ImageView 顶部下方 16dp 偏移量对齐。

下面的布局将 TextView 的顶部与水平线对齐，如屏幕截图所示，但这并没有带来解决方案。不幸的是，我不能依赖 TextView 的固定高度来减去

android:layout_marginTop="16dp"

    <?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:id="@+id/id_content_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
    
        <ImageView
            android:id="@+id/image_network"
            android:layout_width="96dp"
            android:layout_height="192dp"
            android:layout_marginTop="32dp"
            app:srcCompat="@drawable/network_6x1"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            />
    
        <TextView
            android:id="@+id/id_enable"
            style="@style/Widget.AppTheme.Helper"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginStart="16dp"
            android:layout_marginTop="16dp"
            android:text="Enable"
            app:layout_constraintStart_toStartOf="@id/image_network"
            app:layout_constraintTop_toTopOf="@id/image_network"
            />
    
        <TextView
            android:id="@+id/id_out"
            style="@style/Widget.AppTheme.Helper"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginEnd="16dp"
            android:text="Out"
            app:layout_constraintEnd_toEndOf="@id/image_network"
            app:layout_constraintTop_toTopOf="@id/image_network"
            app:layout_constraintBottom_toBottomOf="@id/image_network"
            />
    
    </androidx.constraintlayout.widget.ConstraintLayout>

如果我将

app:layout_constraintBottom_toTopOf="@id/image_network"

添加到 TextView，两个水平边缘都会与 ImageView 的顶部对齐，它会使其垂直中心与 ImageView 的顶部对齐，但现在它会忽略

android:layout_marginTop="16dp"

    <TextView
        android:id="@+id/id_enable"
        style="@style/Widget.AppTheme.Helper"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginTop="16dp"
        android:text="Enable"
        app:layout_constraintStart_toStartOf="@id/image_network"
        app:layout_constraintTop_toTopOf="@id/image_network"
        app:layout_constraintBottom_toTopOf="@id/image_network"
        />

“Out”TextView 完全垂直居中于右侧的单行，但这只是随机的，因为该行正好位于图形的垂直中心。

到目前为止，我发现的唯一解决方法是使用带有

layout_height="16dp"

的附加空辅助视图，将其与 ImageView 的 Top_toTopOf 对齐，然后将 TextView 的两个水平边缘与辅助视图的底部对齐。

    <View
        android:id="@+id/id_enable_dummy"
        android:layout_width="96dp"
        android:layout_height="16dp"
        app:layout_constraintStart_toStartOf="@id/image_network"
        app:layout_constraintTop_toTopOf="@id/image_network"
        />
    
    <TextView
        android:id="@+id/id_enable"
        style="@style/Widget.AppTheme.Helper"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:text="Enable"
        app:layout_constraintStart_toStartOf="@id/image_network"
        app:layout_constraintTop_toBottomOf="@id/id_enable_dummy"
        app:layout_constraintBottom_toBottomOf="@id/id_enable_dummy"
        />

但这将需要为每个标签 TextView 提供额外的视图资源，这似乎开销太大。这真的有必要吗？或者有人知道更好的解决方案吗？

此外：如果我想将标签对齐在基线上而不是垂直中心，我观察到基本相同，

android:layout_marginTop="16dp"

不能组合使用。

Answer 1

我不确定我是否正确理解了您的问题，但这也许会对您有所帮助：通过这 3 行，TextView 被放置在例如ImageView 高度的 15%：

app:layout_constraintVertical_bias="0.15"
app:layout_constraintTop_toTopOf="@id/image_network"
app:layout_constraintBottom_toBottomOf="@id/image_network"