Texto en Jetpack Compose Glimmer

Dispositivos de realidad extendida correspondientes

Esta guía te ayuda a crear experiencias para estos tipos de dispositivos de realidad extendida.

Más información sobre los tipos de dispositivos de realidad extendida →

Más información sobre los tipos de dispositivos de realidad extendida →

En Jetpack Compose Glimmer, el Text componente te permite establecer varias propiedades de texto, como el color, el tamaño de la fuente, el estilo de la fuente, el peso de la fuente, la familia de fuentes, el espacio entre letras y la alineación del texto.

El texto de Jetpack Compose Glimmer es único porque administra de forma inteligente la coincidencia de colores. Por ejemplo, si no se especifica una anulación de color, el texto se establece de forma predeterminada en el color de contenido que proporciona la superficie más cercana en la que se encuentra.

Ejemplo: Crea un encabezado de texto en un cuadro

@Composable
fun TextSample() {
    Text(
        text = "Hello Glimmer",
        style = GlimmerTheme.typography.titleLarge
    )
}
TextSample.kt

Puntos clave sobre el código

• Como no se especifica ningún color, este texto busca la superficie más cercana para elegir el color más legible (por lo general, blanco).

Tamaño

La escala tipográfica en Jetpack Compose Glimmer es mucho más grande que el diseño de Material Design estándar para dispositivos móviles. Los estilos como TitleLarge y BodyLarge son 30.sp, y la leyenda es 18.sp:

Usa Google Sans Flex

Google Sans Flex es una fuente variable elegida específicamente para los lentes de IA que se proporciona como parte de Jetpack Compose Glimmer. Las esquinas redondeadas y los ejes ajustables de la fuente permiten un tamaño óptico ideal, lo que garantiza que el texto siga siendo legible y se pueda ver de un vistazo. Si es posible, para mejorar la coherencia de los usuarios entre tu app y el sistema, usa Google Sans Flex para todo el texto que se muestra en los lentes de visualización.

Para usar Google Sans Flex, agrega la biblioteca glimmer-google-fonts a las dependencias de tu app y, luego, aplica la fuente de forma global a GlimmerTheme:

@Composable
fun GoogleSansFlexTypographySample() {
    val typography = createGoogleSansFlexTypography()
    GlimmerTheme(typography = typography) {
        Text("Hello World", style = GlimmerTheme.typography.titleLarge)
    }
}