Instagram布局如何将textview和用户名textview一起注释？

Question

我在考虑Instagram评论卡的布局。布局范围如下所示，

在紫色块中，两个TextView对齐为一个，两个都可以单击为单独的。一个导航到用户页面，另一个选择评论卡。这怎么可能？我只能将其视为具有两个textviews的LinearLayout / RelativeLayout，我们如何使其外观和行为类似？

 <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginRight="60dp"
        android:layout_marginBottom="20dp">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="\@someusername"
            android:id="@+id/comment_username"
            android:layout_marginLeft="15dp"
            android:textSize="18sp"
            android:textStyle="bold"/>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. "
            android:layout_marginLeft="5dp"

            android:textSize="18sp"
            android:layout_toRightOf="@+id/comment_username"
            android:id="@+id/comment"/>
</RelativeLayout>

如下图所示，

Instagram如何使布局看起来如上图所示？

Answer 1

它使用SpannableString设置SpannableString的样式。您可以这样：

TextView

Answer 2

尝试使用跨度来设置文本样式。

阅读更多：

val username = "@username"
val comment = "This is a comment"
val text = username + comment

val startName = text.indexOf(username)
val endName = startName + username.length
val startComment = text.indexOf(comment)
val endComment = text.length

val spannableString = SpannableString(text)
val nameClickableSpan = object : ClickableSpan() {
    override fun onClick(widget: View) {
        // Username clicked
    }

    override fun updateDrawState(ds: TextPaint) {
        super.updateDrawState(ds)
        ds.typeface = Typeface.DEFAULT_BOLD
        ds.isUnderlineText = false
    }
}
val commentClickableSpan = object : ClickableSpan() {
    override fun onClick(widget: View) {
        // Comment clicked
    }

    override fun updateDrawState(ds: TextPaint) {
        super.updateDrawState(ds)
        ds.isUnderlineText = false
    }
}

spannableString.setSpan(nameClickableSpan, startName, endName, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE)
spannableString.setSpan(commentClickableSpan, startComment, endComment, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE)

textView.text = spannableString
textView.movementMethod = LinkMovementMethod.getInstance()