Ejemplo práctico 5: Fondo decorativo con formas

 1@Composable
 2fun FondoDecorativo(modifier: Modifier = Modifier) {
 3    Canvas(modifier = modifier.fillMaxSize()) {
 4        val ancho = size.width
 5        val alto = size.height
 6
 7        // Fondo general
 8        drawRect(Color(0xFFEFEFEF))
 9
10        // Círculo azul en esquina superior izquierda
11        drawCircle(
12            color = Color.Blue,
13            radius = ancho / 4,
14            center = Offset(ancho / 4, alto / 4)
15        )
16
17        // Línea diagonal decorativa
18        drawLine(
19            color = Color.Magenta,
20            start = Offset(0f, alto),
21            end = Offset(ancho, 0f),
22            strokeWidth = 10f
23        )
24
25        // Pequeños círculos decorativos
26        for (i in 1..5) {
27            drawCircle(
28                color = Color.Green,
29                radius = 20f,
30                center = Offset(ancho * i / 6, alto * i / 6)
31            )
32        }
33    }
34}

 1@Preview(showBackground = true)
 2@Composable
 3fun VistaPreviaFondoDecorativo() {
 4    Box(modifier = Modifier.size(300.dp, 300.dp)) {
 5        FondoDecorativo()
 6        Text(
 7            text = "Contenido",
 8            modifier = Modifier.align(Alignment.Center),
 9            color = Color.Black,
10            fontSize = 18.sp
11        )
12    }
13}