En Android, podemos personalizar varios aspectos de un texto para mostrarlos en consecuencia. Podemos cambiar el tamaño de fuente y la familia de fuentes, así como aplicar varias funciones como negrita, cursiva, etc. Sin embargo, no es posible mostrar una fuente de contorno para el mismo texto. En caso de que no sepa cuál es la fuente delineada, mire la siguiente imagen de texto delineado de muestra:
En este artículo, le mostraremos cómo puede crear texto delineado en Android usando Jetpack Compose . Siga los pasos a continuación una vez que el IDE esté listo.
Implementación paso a paso
Paso 1: crea un nuevo proyecto en Android Studio
Para crear un nuevo proyecto en Android Studio, consulte Cómo crear/iniciar un nuevo proyecto en Android Studio . Al elegir la plantilla, seleccione Actividad de composición vacía . Si no encuentra esta plantilla, intente actualizar Android Studio a la última versión. Demostramos la aplicación en Kotlin , así que asegúrese de seleccionar Kotlin como idioma principal al crear un nuevo proyecto.
Paso 2: trabajar con el archivo MainActivity.kt
Vaya al archivo MainActivity.kt y consulte el siguiente código. A continuación se muestra el código del archivo MainActivity.kt . Se agregan comentarios dentro del código para comprender el código con más detalle.
Kotlin
package com.geeksforgeeks.outlinedtext
import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.Canvas
import androidx.compose.foundation.layout.*
import androidx.compose.material.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.Paint
import androidx.compose.ui.graphics.drawscope.drawIntoCanvas
import androidx.compose.ui.graphics.nativeCanvas
import androidx.compose.ui.unit.dp
class MainActivity : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContent {
// Creating a Simple Scaffold
// Layout for the application
Scaffold(
// Creating a Top Bar
topBar = { TopAppBar(title = { Text("GFG | Outlined Text", color = Color.White) }, backgroundColor = Color(0xff0f9d58)) },
// Creating Content
content = {
// Creating a Column Layout
Column(Modifier.fillMaxSize(), horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement.Center) {
// Create a Paint that has black stroke
val textPaintStroke = Paint().asFrameworkPaint().apply {
isAntiAlias = true
style = android.graphics.Paint.Style.STROKE
textSize = 100f
color = android.graphics.Color.BLACK
strokeWidth = 12f
strokeMiter= 10f
strokeJoin = android.graphics.Paint.Join.ROUND
}
// Create a Paint that has white fill
val textPaint = Paint().asFrameworkPaint().apply {
isAntiAlias = true
style = android.graphics.Paint.Style.FILL
textSize = 100f
color = android.graphics.Color.WHITE
}
// Create a canvas, draw the black stroke and
// override it with the white fill
Canvas(
modifier = Modifier.fillMaxSize(),
onDraw = {
drawIntoCanvas {
it.nativeCanvas.drawText(
"GeeksforGeeks",
200f,
200.dp.toPx(),
textPaintStroke
)
it.nativeCanvas.drawText(
"GeeksforGeeks",
200f,
200.dp.toPx(),
textPaint
)
}
}
)
}
}
)
}
}
}
Producción:
Puede ver que podemos crear con éxito un texto delineado.
Publicación traducida automáticamente
Artículo escrito por aashaypawar y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA