Android：间距和 TextView 换行问题答案

【问题标题】：Android: spacing and TextView wrapping issueAndroid：间距和 TextView 换行问题
【发布时间】：2018-03-25 17:35:13
【问题描述】：

我想要这样的布局：

这是我的代码：

 <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="I. ISI PELATIHAN"/>


        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal" >

            <TextView
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:text="1. "
                />

            <TextView
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:text=" Kejelasan tujuan dan manfaat pelatihan"
               />

            <RatingBar
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                style="?android:attr/ratingBarStyleSmall"
                android:numStars="5"
                android:stepSize="1"
                android:layout_gravity="right"/>
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal" >

            <TextView
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:text="2. "
                />

            <TextView
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:text=" Penampilan bahan/materi pelatihan"
                />

            <RatingBar
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                style="?android:attr/ratingBarStyleSmall"
                android:numStars="5"
                android:stepSize="1"
                android:layout_gravity="right"/>
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal" >

            <TextView
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:text="3. "
                />

            <TextView
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:text=" Kelengkapan bahan/materi pilihan"
                />

            <RatingBar
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                style="?android:attr/ratingBarStyleSmall"
                android:numStars="5"
                android:stepSize="1"
                android:layout_gravity="right"/>
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal" >

            <TextView
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:text="4. "
                />

            <TextView
                android:layout_width="wrap_content"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:text=" Metode yang digunakan membantu pemahaman isi program"
                />

            <RatingBar
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                style="?android:attr/ratingBarStyleSmall"
                android:numStars="5"
                android:stepSize="1"
                android:layout_gravity="right"/>
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal" >

            <TextView
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:text="5. "
                />

            <TextView
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:text=" Saya mengerti/memahami program/materi yang diberikan"
                />

            <RatingBar
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                style="?android:attr/ratingBarStyleSmall"
                android:numStars="5"
                android:stepSize="1"
                android:layout_gravity="right"/>
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal" >

            <TextView
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:text="6. "
                />

            <TextView
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:text=" Saya belajar sesuatu yang baru dari materi yang diberikan"
                />

            <RatingBar
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                style="?android:attr/ratingBarStyleSmall"
                android:numStars="5"
                android:stepSize="1"
                android:layout_gravity="right"/>
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal" >

            <TextView
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:text="7. "
                />

            <TextView
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:text=" Efisiensi penggunaan waktu"
                />

            <RatingBar
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                style="?android:attr/ratingBarStyleSmall"
                android:numStars="5"
                android:stepSize="1"
                android:layout_gravity="right"/>
        </LinearLayout>


    </LinearLayout>

结果是：

我想知道的是：

如何在行号之前和 RatingBar 之后添加填充？
我在文本上使用 wrap_content。对于较短的文本似乎还可以，但对于较长的文本，它就搞砸了。如何将所有文本设置为使用相同的长度，如果文本长度超过某个值，它将被正确包装，如第一张图片所示？

【问题讨论】：

您已将 RatingBar 属性 numStars 设置为 5，因此宽度将由该值定义 --> 因此您不应将 layout_width 设置为 match_parent 尝试使用 wrap_content .然后将每一行包装在RelativeLayout 中，而不是LinearLayout。现在将 TextView 固定到父级 (RelativeLayout) 的开头并在 RateBar 处结束。现在将RatingBar 固定到父级（RelativeLayout）的末尾
嗨@Barns。嗯，我仍然很难理解这一点。您介意提供一些示例代码吗？
我添加一个例子。看一看。希望对您有所帮助。

标签： android android-layout textview

【解决方案1】：

在 guildLine 的帮助下使用约束布局和单独的评分栏

您可以在一个布局中设置所有视图..

使用最新的 beta 版本的依赖

编译 'com.android.support.constraint:constraint-layout:1.1.0-beta5'

这里是示例教程

https://constraintlayout.com/basics/

官方教程

https://developer.android.com/reference/android/support/constraint/ConstraintLayout.html

此处为带有 guideLine 的 ConstraintLayout 的示例代码

<?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"
android:padding="16dp"
tools:context="android.itomerbu.layoutdemo.MainActivity">

<android.support.constraint.Guideline
    android:id="@+id/guideline"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    app:layout_constraintGuide_percent="0.44"/>

<TextView
    android:id="@+id/btnThird"
    android:layout_width="0dp"
    app:layout_constraintHorizontal_weight="1"
    android:layout_height="wrap_content"
    android:text="@string/btnThird"
    app:layout_constraintLeft_toLeftOf="parent"
    android:layout_marginBottom="8dp"
    app:layout_constraintRight_toLeftOf="@+id/btnTwoThirds"
    app:layout_constraintBottom_toTopOf="@+id/guideline"
    android:layout_marginStart="8dp"
    android:layout_marginLeft="8dp"/>

<RatingBar
    android:id="@+id/btnTwoThirds"
    app:layout_constraintHorizontal_weight="2"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="@string/btnTwoThirds"
    app:layout_constraintBottom_toBottomOf="@+id/btnThird"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintLeft_toRightOf="@+id/btnThird"/>
  </android.support.constraint.ConstraintLayout>

【讨论】：

【解决方案2】：

您可以使用RelativeLayout 来实现您想要的。将此 xml 布局示例插入到您的 xml 布局文件中。您可以根据需要更改id，并使用填充和边距来满足您的需要。根据需要为您添加任意数量的RelativeLayout 组Activity。

如果您有任何问题或疑问，请告诉我。

<LinearLayout
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingTop="5dp"
        >
        <TextView
            android:id="@+id/tvFirst"
            android:layout_width="25dp"
            android:layout_height="wrap_content"
            android:layout_alignParentStart="true"
            android:paddingEnd="4dp"
            android:paddingStart="4dp"
            android:text="1"
            android:textAlignment="center"/>
        <TextView
            android:id="@+id/tvFirstTitle"
            android:text="@string/SomeTextString"
            android:layout_toEndOf="@id/tvFirst"
            android:layout_toStartOf="@id/rBarFirst"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            />

        <RatingBar
            android:id="@+id/rBarFirst"
            style="@style/Widget.AppCompat.RatingBar.Small"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentEnd="true"
            android:numStars="5"
            android:stepSize="1"
            android:layout_marginEnd="10dp"
            />
    </RelativeLayout>
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingTop="5dp"
        >
        <TextView
            android:id="@+id/tvSecond"
            android:layout_width="25dp"
            android:layout_height="wrap_content"
            android:layout_alignParentStart="true"
            android:paddingEnd="4dp"
            android:paddingStart="4dp"
            android:text="2"
            android:textAlignment="center"/>
        <TextView
            android:id="@+id/tvSecondTitle"
            android:text="@string/SomeTextString"
            android:layout_toEndOf="@id/tvSecond"
            android:layout_toStartOf="@id/rBarSecond"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            />

        <RatingBar
            android:id="@+id/rBarSecond"
            style="@style/Widget.AppCompat.RatingBar.Small"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentEnd="true"
            android:numStars="5"
            android:stepSize="1"
            android:layout_marginEnd="10dp"
            />
    </RelativeLayout>
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingTop="5dp"
        >
        <TextView
            android:id="@+id/tvThird"
            android:layout_width="25dp"
            android:layout_height="wrap_content"
            android:layout_alignParentStart="true"
            android:paddingEnd="4dp"
            android:paddingStart="4dp"
            android:text="3"
            android:textAlignment="center"/>
        <TextView
            android:id="@+id/tvThirdTitle"
            android:text="@string/SomeTextString"
            android:layout_toEndOf="@id/tvThird"
            android:layout_toStartOf="@id/rBarThird"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            />

        <RatingBar
            android:id="@+id/rBarThird"
            style="@style/Widget.AppCompat.RatingBar.Small"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentEnd="true"
            android:numStars="5"
            android:stepSize="1"
            android:layout_marginEnd="10dp"
            />
    </RelativeLayout>
</LinearLayout>

请注意：

我刚刚注意到您正在使用：style="?android:attr/ratingBarStyleSmall" 您可能需要更改我在示例中使用的 RatingBar 的 style 以与您的应用兼容！

【讨论】：