V Compose používame funkcie Text pre zobrazenie textu. Text môžeme štýlovať pomocou parametrov:

import androidx.compose.desktop.ui.tooling.preview.Preview
import androidx.compose.material3.*
import androidx.compose.runtime.*
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.unit.sp
import androidx.compose.ui.window.Window
import androidx.compose.ui.window.application

@Composable
fun Texty() {
    MaterialTheme {
        Surface {
            Text("Normalny text")
            Text("Velky text", fontSize = 24.sp)
            Text("Cerveny text", color = Color.Red)
            Text("Tlsty text", fontWeight = FontWeight.Bold)
            Text("Styl", style = TextStyle(
                fontSize = 20.sp,
                fontWeight = FontWeight.Medium,
                color = Color.Blue
            ))
        }
    }
}

fun main() = application {
    Window(onCloseRequest = ::exitApplication, title = "Texty") {
        Texty()
    }
}

20.1.1 Modifier

Text môžeme ďalej štýlovať pomocou Modifier:

import androidx.compose.foundation.layout.padding
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp

@Composable
fun Texty() {
    Text("Text s paddingom", modifier = Modifier.padding(16.dp))
    Text("Text s pozadim", modifier = Modifier.padding(8.dp))
}

Modifier je reťazec modifikátorov, ktoré menia vzhľad alebo správanie prvku.

20.1.2 Poznámka o remember

remember si pamätá hodnotu počas životnosti Composable funkcie. Ak chceme zdieľať stav medzi viacerými funkciami, použijeme remember { mutableStateOf(...) } na vyššej úrovni.

Úlohy

Úloha 1

Vytvor composable funkciu s tromi textami s rozdielnou veľkosťou, farbou a hrúbkou písma.

Úloha 2

Pridaj textu Modifier.padding s hodnotou 16 dp.

Úloha 3

Vytvor stav textu pomocou remember a zobraz jeho aktuálnu hodnotu.