Question

我正在使用Constraint Layout并尝试放入如图所示的东西：

问题是，当我启动它时，单词00上方的最后一个stars跳到了屏幕的右侧。而且由于它们都已连接在一起，因此其他所有内容都会随之出现。但是我认为，这一切都应取决于左侧的元素，但它们都仍应遵循00上方的stars。

自从我尝试解决这一问题以来，我一直以为我对Constrain Layout的理解不正确。

这里是XML：

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:fresco="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <com.facebook.drawee.view.SimpleDraweeView
        android:id="@+id/sdvProfilePic"
        android:layout_width="90dp"
        android:layout_height="90dp"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="16dp"
        fresco:actualImageScaleType="fitCenter"
        fresco:failureImage="@drawable/edit_profile_profile_default_image"
        fresco:failureImageScaleType="fitCenter"
        fresco:layout_constraintEnd_toEndOf="parent"
        fresco:layout_constraintStart_toStartOf="parent"
        fresco:layout_constraintTop_toTopOf="parent"
        fresco:placeholderImage="@drawable/edit_profile_profile_default_image"
        fresco:placeholderImageScaleType="fitCenter"
        fresco:roundAsCircle="true"
        fresco:roundedCornerRadius="0.5dp" />

    <TextView
        android:id="@+id/llPostsCount"
        android:layout_width="wrap_content"
        android:layout_height="26dp"
        android:layout_marginStart="84dp"
        android:layout_marginTop="16dp"
        android:text="@string/_00_text"
        android:textColor="@color/balck282828"
        android:textSize="18sp"
        android:textStyle="bold"
        fresco:layout_constraintStart_toStartOf="parent"
        fresco:layout_constraintTop_toBottomOf="@+id/sdvProfilePic" />

    <TextView
        android:id="@+id/textView4"
        android:layout_width="40dp"
        android:layout_height="19dp"
        android:layout_marginStart="76dp"
        android:layout_marginTop="8dp"
        android:text="@string/posts"
        android:textColor="@color/regularTextColora5a7aa"
        android:textSize="14sp"
        fresco:layout_constraintStart_toStartOf="parent"
        fresco:layout_constraintTop_toBottomOf="@+id/llPostsCount" />


    <TextView
        android:id="@+id/tvFollowersCount"
        android:layout_width="wrap_content"
        android:layout_height="26dp"
        android:layout_marginStart="48dp"
        android:layout_marginTop="16dp"
        android:text="00"
        android:textColor="@color/balck282828"
        android:textSize="18sp"
        android:textStyle="bold"
        fresco:layout_constraintStart_toEndOf="@+id/llPostsCount"
        fresco:layout_constraintTop_toBottomOf="@+id/sdvProfilePic" />

    <TextView
        android:id="@+id/textView5"
        android:layout_width="59dp"
        android:layout_height="19dp"
        android:layout_marginStart="25dp"
        android:layout_marginTop="8dp"
        android:text="@string/followers"
        android:textColor="@color/regularTextColora5a7aa"
        android:textSize="14sp"
        fresco:layout_constraintStart_toEndOf="@+id/textView4"
        fresco:layout_constraintTop_toBottomOf="@+id/tvFollowersCount" />


    <TextView
        android:id="@+id/tvFollowingCount"
        android:layout_width="wrap_content"
        android:layout_height="26dp"
        android:layout_marginStart="48dp"
        android:layout_marginTop="16dp"
        android:text="00"
        android:textColor="@color/balck282828"
        android:textSize="18sp"
        android:textStyle="bold"
        fresco:layout_constraintStart_toEndOf="@+id/tvFollowersCount"
        fresco:layout_constraintTop_toBottomOf="@+id/sdvProfilePic" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="57dp"
        android:layout_height="19dp"
        android:layout_marginStart="14dp"
        android:layout_marginTop="8dp"
        android:text="@string/following"
        android:textColor="@color/regularTextColora5a7aa"
        android:textSize="14sp"
        fresco:layout_constraintStart_toEndOf="@+id/textView5"
        fresco:layout_constraintTop_toBottomOf="@+id/tvFollowingCount" />


    <TextView
        android:id="@+id/tvEditProfile"
        android:layout_width="0dp"
        android:layout_height="43dp"
        android:layout_marginBottom="2dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:layout_weight="1"
        android:background="@drawable/selector_rcorner_white_box_lgray_ltgray"
        android:gravity="center"
        android:paddingBottom="5dp"
        android:paddingTop="5dp"
        android:text="@string/EDIT_PROFILE"
        android:textColor="@color/balck282828"
        android:textSize="14sp"
        android:textStyle="bold"
        fresco:layout_constraintBottom_toBottomOf="parent"
        fresco:layout_constraintEnd_toEndOf="parent"
        fresco:layout_constraintHorizontal_bias="0.0"
        fresco:layout_constraintStart_toStartOf="parent"
        fresco:layout_constraintTop_toBottomOf="@+id/textView3"
        fresco:layout_constraintVertical_bias="0.178" />


    <TextView
        android:id="@+id/user_stars"
        android:layout_width="21dp"
        android:layout_height="26dp"
        android:layout_marginEnd="68dp"
        android:layout_marginStart="52dp"
        android:layout_marginTop="16dp"
        android:text="00"
        android:textColor="@color/balck282828"
        android:textSize="18sp"
        android:textStyle="bold"
        fresco:layout_constraintEnd_toEndOf="parent"
        fresco:layout_constraintStart_toEndOf="@+id/tvFollowingCount"
        fresco:layout_constraintTop_toBottomOf="@+id/sdvProfilePic" />

    <TextView
        android:id="@+id/user_stars_text"
        android:layout_width="32dp"
        android:layout_height="19dp"
        android:layout_marginEnd="57dp"
        android:layout_marginStart="24dp"
        android:layout_marginTop="8dp"
        android:text="@string/userstars"
        android:textColor="@color/regularTextColora5a7aa"
        android:textSize="14sp"
        fresco:layout_constraintEnd_toEndOf="parent"
        fresco:layout_constraintStart_toEndOf="@+id/textView3"
        fresco:layout_constraintTop_toBottomOf="@+id/user_stars" />


</android.support.constraint.ConstraintLayout>

我做错了什么？

编辑

我有一个模拟器来对我得到的结果进行屏幕截图，它看起来不像在手机上那样糟糕，但仍然不是我想要的：

对不起，质量不好，但这是我从电话中得到的：

Answer 1

我建议您将fresco:layout_constraintEnd_toStartOf="@id/some-id"添加到中间项。这样，所有四个项目都可以水平居中。例如，ID为TextView的{{1}}应该有allPostsCount。

fresco:layout_constraintEnd_toStartOf="@id/tvFollowersCount"

Answer 2

这里有一些建议：

更精确地命名您的观点。您不应使用@+id/textView5之类的ID（这是单词水平列表中的第二个视图），要正确构建布局会造成很大的混乱。
您正在为文本视图指定确切的宽度，以便切出单词，如果可以的话，最好使用wrap_content。
您使用精确的边距将00标签居中。如果它在布局编辑器上似乎可以正常运行，则不会在所有设备上都获得相同的结果，尤其是在较大的设备上。您宁愿使用约束来居中
要构建布局，我会在标签上使用一个压缩的“水平”链（因为它们较大）https://developer.android.com/training/constraint-layout/#constrain-chain。然后，根据相应的标签将数字居中。

以下是您根据最后的建议可以得到的结果：

继续尝试，我确定您可以做到！

Android约束布局跳至屏幕右侧

2 个答案: