GlanceのText ComposableでTextOverflow.Ellipsisを指定する方法

概要

Jetpack GlanceはJetpack Compose¹でApp Widgetsを作成できるフレームワークです。バージョンは2023年3月1日時点で1.0.0-alpha05になります。

GlanceのText Composable

GlanceのText Composableでは、overflowプロパティがありません。colorやfontSizeもTextStyleで指定します。

@Composable
fun Text(
    text: String,
    modifier: GlanceModifier = GlanceModifier,
    style: TextStyle? = null,
    maxLines: Int = Int.MAX_VALUE
): Unit

GlanceのText ComposableでのTextOverflow.Ellipsisの指定方法

1.0.0-alpha05の時点では、次のように maxLines を指定することで自動的にellipsisされるようになっていました。

Text(
    text = text,
    maxLines = 1,
)

まとめ

GlanceでのApp Widgets開発の体験はとても良かったです。一方通常のComposeと微妙に使い勝手が異なる点もあり、嵌るポイントにもなっています(α版なので今後変更があるかも)。

また、AndroidView ComposableのようにAndroidRemoteView Composableを使うと従来のRemoteViewと組み合わせてUIを構築することが可能です²。Glanceで実装が難しい場合、以前のようにlayout.xmlで実装することを検討しても良いでしょう。

参考資料

• https://android-developers.googleblog.com/2021/12/announcing-jetpack-glance-alpha-for-app.html
• https://developer.android.com/jetpack/androidx/releases/glance?hl=ja
• https://github.com/android/user-interface-samples
• https://stackoverflow.com/questions/65736375/how-to-show-ellipsis-three-dots-at-the-end-of-a-text-line-in-android-jetpack-c
• https://stackoverflow.com/questions/75138251/ellipsis-overflow-in-glance-widget/75590810#75590810

1. 通常のComposeと全く同じではありません。packageがandroidx.glanceに分かれ、Textでも指定できるプロパティが異なるなど同じComposeでも微妙に使い勝手が異なります。ModiferもGlanceModifierですし、Brashを取れるbackgroundがGlanceModifierに無かったり、Textのoverflowプロパティが無いなど違いがあります。 ↩

2. 既存のWidgetの資産を再利用できるのが良いポイント > AndroidRemoteView Composable ↩