android 将项目符号与 Package 的TextView的第一行对齐

qzwqbdag  于 2023-10-14  发布在  Android
关注(0)|答案(3)|浏览(130)

我尝试在Android中创建一个项目符号列表,其中项目符号与TextView中第一行的垂直中心对齐,如下所示:

单个项目符号/文本行的XML如下所示:

<android.support.constraint.ConstraintLayout
    android:id="@+id/setup_intro_bullet_first_container"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toTopOf="parent">

    <TextView
        android:id="@+id/setup_intro_bullet_first"
        style="@style/TextAppearance.AppCompat.Headline"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="@string/bullet"
        android:textColor="@color/colorAccent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/setup_intro_bullet_first_text"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="4dp"
        android:paddingTop="14dp"
        android:text="@string/setup_intro_benefit_notification"
        android:textColor="@android:color/white"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toRightOf="@id/setup_intro_bullet_first"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>

在这里,我在TextView上使用填充来与项目符号对齐,但这不是一个解决方案,因为在其他分辨率下对齐不一致。我也试过把项目符号字符放在文本字符串中,但是第二行文本会放在项目符号下面,这不是我想要的。我想听听你的建议。

sc4hvdpw

sc4hvdpw1#

我想到的解决方案是创建一个圆Drawable并在ImageView中使用它。您可以定义ImageView的基线,这允许我将其与TextView的基线正确对齐。下面是循环XML:

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid android:color="@color/colorAccent" />
</shape>

布局XML:

<ImageView
    android:id="@+id/setup_intro_bullet_first"
    style="@style/TextAppearance.AppCompat.Headline"
    android:layout_width="4dp"
    android:layout_height="4dp"
    android:baseline="7dp"
    android:src="@drawable/circle"
    app:layout_constraintBaseline_toBaselineOf="@+id/setup_intro_bullet_first_text"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toLeftOf="@+id/setup_intro_bullet_first_text" />

<TextView
    android:id="@+id/setup_intro_bullet_first_text"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginLeft="4dp"
    style="@style/TextAppearance.AppCompat.Subhead"
    android:text="@string/setup_intro_benefit_notification"
    android:textColor="@android:color/white"
    app:layout_constraintLeft_toRightOf="@id/setup_intro_bullet_first"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toTopOf="parent" />
jjhzyzn0

jjhzyzn02#

使用app:layout_constraintBaseline_toBaselineOf属性将“bullet”视图的基线约束为文本视图的基线。
项目符号视图的约束:

app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="@+id/setup_intro_bullet_first_text"
app:layout_constraintBaseline_toBaselineOf="@+id/setup_intro_bullet_first_text"

对于你的文本:

app:layout_constraintTop_toTopOf="parent"
app:layout_constraintLeft_toRightOf="@id/setup_intro_bullet_first"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
sqougxex

sqougxex3#

对于Android Pie(28)及以上版本,您可以直接使用BulletSpan。对于下面的版本,您可以使用DrawableMarginSpan,但带有一个破碎的drawable加上项目符号"\u2022"

val yourSpan = if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.P) {
        BulletSpan(
            8.px,
            ContextCompat.getColor(requireContext(), R.color.gray),
            2.px,
        )
    } else {
        DrawableMarginSpan(ContextCompat.getDrawable(requireContext(), R.drawable.ic_circle)!!, 20)
    }

val yourString = if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.P) {
   "Just string"
} else {
    "\u2022" + " Just string"
}

yourTextView.text = SpannableStringBuilder(yourString).apply {
                setSpan(
                    yourSpan,
                    startIndex,
                    endIndex,
                    Spannable.SPAN_EXCLUSIVE_EXCLUSIVE
                )
            }

可拉伸件断裂代码:

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid android:color="@color/gray"/>
</shape>

相关问题