فعال کردن تعامل‌های کاربر

Jetpack Compose تعامل‌پذیری دقیق را در Text فعال می‌کند. انتخاب نوشتار اکنون انعطاف‌پذیرتر است و می‌توان آن را در سراسر طرح‌بندی‌های قابل‌ترکیب انجام داد. تعاملات کاربر در نوشتار با سایر چیدمان‌های ترکیب‌پذیر متفاوت است، زیرا نمی‌توانید اصلاح‌کننده به بخشی از ترکیب‌پذیر Text اضافه کنید. این صفحه APIهایی را که تعاملات کاربر را فعال می‌کنند برجسته می‌کند.

انتخاب نوشتار

به‌طور پیش‌فرض، composableها قابل‌انتخاب نیستند، یعنی کاربران نمی‌توانند نوشتار را از برنامه‌تان انتخاب و کپی کنند. برای فعال کردن انتخاب نوشتار، عناصر نوشتاری‌تان را با composable SelectionContainer بپوشانید:

@Composable
fun SelectableText() {
    SelectionContainer {
        Text("This text is selectable")
    }
}

بخش کوتاهی از نوشتار که کاربر انتخاب کرده است.

شاید بخواهید انتخاب را در بخش‌های خاصی از ناحیه قابل‌انتخاب غیرفعال کنید. برای انجام این کار، باید بخش غیرقابل‌انتخاب را با یک ترکیب‌پذیر DisableSelection بپوشانید:

@Composable
fun PartiallySelectableText() {
    SelectionContainer {
        Column {
            Text("This text is selectable")
            Text("This one too")
            Text("This one as well")
            DisableSelection {
                Text("But not this one")
                Text("Neither this one")
            }
            Text("But again, you can select this one")
            Text("And this one too")
        }
    }
}

بخش طولانی‌تری از نوشتار. کاربر سعی کرد کل متن را انتخاب کند، اما چون DisableSelection برای دو خط اعمال شده بود، آن دو خط انتخاب نشدند.

ایجاد بخش‌های قابل‌کلیک نوشتار با LinkAnnotation

برای گوش دادن به کلیک‌ها روی Text، می‌توانید اصلاح‌کننده clickable را اضافه کنید. بااین‌حال، ممکن است بخواهید اطلاعات بیشتری را به بخش خاصی از مقدار Text پیوست کنید، مثلاً نشانی وبی که به کلمه خاصی پیوست شده است تا در مرورگر باز شود. در چنین مواردی، باید از LinkAnnotation استفاده کنید که حاشیه‌نویسی‌ای است که بخشی از نوشتار را کلیک‌کردنی می‌کند.

با LinkAnnotation، می‌توانید نشانی وبی را به بخشی از یک Text ترکیب‌پذیر پیوست کنید که پس‌از کلیک کردن به‌طور خودکار باز می‌شود، همان‌طور که در قطعه کد زیر نشان داده شده است:

@Composable
fun AnnotatedStringWithLinkSample() {
    // Display multiple links in the text
    Text(
        buildAnnotatedString {
            append("Go to the ")
            withLink(
                LinkAnnotation.Url(
                    "https://developer.android.com/",
                    TextLinkStyles(style = SpanStyle(color = Color.Blue))
                )
            ) {
                append("Android Developers ")
            }
            append("website, and check out the")
            withLink(
                LinkAnnotation.Url(
                    "https://developer.android.com/jetpack/compose",
                    TextLinkStyles(style = SpanStyle(color = Color.Green))
                )
            ) {
                append("Compose guidance")
            }
            append(".")
        }
    )
}

همچنین می‌توانید کنش سفارشی‌ای را پیکربندی کنید تا در پاسخ به کلیک کاربر روی بخشی از Text composable اجرا شود. در قطعه زیر، وقتی کاربر روی «Jetpack Compose» کلیک می‌کند، پیوندی نمایش داده می‌شود و اگر کاربر روی پیوند کلیک کند، سنجه‌ها ثبت می‌شوند:

@Composable
fun AnnotatedStringWithListenerSample() {
    // Display a link in the text and log metrics whenever user clicks on it. In that case we handle
    // the link using openUri method of the LocalUriHandler
    val uriHandler = LocalUriHandler.current
    Text(
        buildAnnotatedString {
            append("Build better apps faster with ")
            val link =
                LinkAnnotation.Url(
                    "https://developer.android.com/jetpack/compose",
                    TextLinkStyles(SpanStyle(color = Color.Blue))
                ) {
                    val url = (it as LinkAnnotation.Url).url
                    // log some metrics
                    uriHandler.openUri(url)
                }
            withLink(link) { append("Jetpack Compose") }
        }
    )
}