O Glance fornece uma API para gerenciar o tema de cores. Para outros atributos de estilo,
como TextStyle, declare variáveis de nível superior.
Adicionar cores
O Glance fornece uma implementação de cores do Material Design pronta para uso. Para usar o
tema integrado, envolva o elemento combinável de nível superior com GlanceTheme, conforme mostrado no
exemplo abaixo.
Em dispositivos com suporte a cores dinâmicas, esse tema é derivado das
cores da plataforma específicas do usuário. Em outros dispositivos, isso retoma o tema
de referência do Material Design. Use GlanceTheme.colors para definir o estilo com as cores do tema
agrupado. Você pode usar esses valores do tema em qualquer lugar em que uma cor seja necessária.
override suspend fun provideGlance(context: Context, id: GlanceId) {
provideContent {
GlanceTheme {
MyContent()
}
}
}
@Composable
private fun MyContent() {
Image(
colorFilter = ColorFilter.tint(GlanceTheme.colors.secondary),
// ...
)
}
Para personalizar o tema, transmita o colors para o GlanceTheme. O Glance
fornece a biblioteca de interoperabilidade androidx.glance:glance-material para o
Material 2 e androidx.glance:glance-material3 para o suporte a cores
do Material 3.
Por exemplo, forneça as cores do Material Design do seu app à API ColorProviders
para criar um esquema de cores Glance, conforme mostrado no snippet abaixo:
// Remember, use the Glance imports
// import androidx.glance.material3.ColorProviders
// Example Imports from your own app
// import com.example.myapp.ui.theme.DarkColors
// import com.example.myapp.ui.theme.LightColors
object MyAppWidgetGlanceColorScheme {
val colors = ColorProviders(
light = LightColors,
dark = DarkColors
)
}
Forneça as cores do esquema para o GlanceTheme que envolve todos os
elementos combináveis, conforme mostrado no exemplo abaixo:
override suspend fun provideGlance(context: Context, id: GlanceId) {
// ...
provideContent {
GlanceTheme(colors = MyAppWidgetGlanceColorScheme.colors) {
MyContent()
}
}
}
@Composable
private fun MyContent() {
Image(
colorFilter = ColorFilter.tint(GlanceTheme.colors.secondary),
// ...
)
}
Se você preferir usar cores dinâmicas do plano de fundo quando houver suporte e, caso contrário, o
esquema de cores do app, é possível transmitir condicionalmente o esquema de cores
do app para a GlanceTheme. Isso é mostrado neste snippet:
override suspend fun provideGlance(context: Context, id: GlanceId) {
provideContent {
GlanceTheme(
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.S)
GlanceTheme.colors
else
MyAppWidgetGlanceColorScheme.colors
) {
MyContent()
}
}
}
@Composable
private fun MyContent() {
// ...
Image(
colorFilter = ColorFilter.tint(GlanceTheme.colors.secondary),
// ...
)
}
Adicionar formas
Para fornecer formas ou sombras especiais ao widget do app, use a API Android Drawables.
Por exemplo, o snippet abaixo mostra como criar um drawable (uma forma):
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="16dp"/>
<stroke android:color="@color/outline_color" android:width="1dp"/>
</shape>
Forneça ao elemento combinável de destino:
GlanceModifier.background(
imageProvider = ImageProvider(R.drawable.button_outline)
)