Jak ve svém kódu používáte modifikátory?

Modifikátory v Android vývoji, zejména při použití Jetpack Compose, hrají klíčovou roli při nastavování vzhledu a chování Composable funkcí.

Hlavní způsoby použití:

1. Velikost a okraje:

   • Nastavení šířky a výšky: Modifier.width(...), Modifier.height(...), Modifier.size(...).
   • Přidání vnitřních okrajů: Modifier.padding(...).
   • Přidání vnějších okrajů: Modifier.offset(...).

   // Příklad použití modifikátorů velikosti a okrajů
   Box(
       modifier = Modifier
           .size(100.dp) // Nastavení velikosti
           .padding(16.dp) // Přidání vnitřních okrajů
   ) {
       // Obsah Box
   }
   

2. Pozadí a rámeček:

   • Nastavení barvy nebo štětce pozadí: Modifier.background(...).
   • Přidání rámečku: Modifier.border(...).

   // Příklad použití modifikátorů pozadí a rámečku
   Text(
       "Ahoj!",
       modifier = Modifier
           .background(Color.Blue) // Modré pozadí
           .border(2.dp, Color.Red) // Červený rámeček, tloušťka 2dp
   )
   

3. Interakce a zpracování událostí:

   • Reakce na kliknutí: Modifier.clickable(...).
   • Reakce na dlouhý stisk: Modifier.pointerInput(...) nebo Modifier.combinedClickable(...).
   • Správa posouvání: Modifier.verticalScroll(...), Modifier.horizontalScroll(...).

   // Příklad modifikátoru kliknutí
   Button(
       onClick = { /* Provedení akce při kliknutí */ },
       modifier = Modifier.padding(8.dp) // Okraje tlačítka
   ) {
       Text("Klikni na mě")
   }
   

4. Umístění a zarovnání:

   • Vyplnění dostupného prostoru: Modifier.fillMaxSize(), Modifier.fillMaxWidth(), Modifier.fillMaxHeight().
   • Zarovnání obsahu: Modifier.align(...).

   // Příklad použití modifikátoru vyplnění prostoru
   Column(
       modifier = Modifier.fillMaxSize() // Vyplní celý dostupný prostor
   ) {
       // Dceřiné prvky
   }
   

5. Stav a efekty:

   • Změna průhlednosti: Modifier.alpha(...).
   • Otočení a škálování: Modifier.rotate(...), Modifier.scale(...).
   • Použití stínů: Modifier.shadow(...).

   // Příklad použití modifikátoru průhlednosti
   Image(
       painter = painterResource(id = R.drawable.my_image),
       contentDescription = "Moje obrázek",
       modifier = Modifier.alpha(0.5f) // Udělá obrázek poloprůhledným
   )
   

6. Specializované modifikátory UI-komponent: Některé komponenty mají své vlastní modifikátory pro specifické nastavení, například:

   • Modifier.weight(...) pro Column a Row.
   • Modifier.constrainAs(...) pro ConstraintLayout.

Modifikátory se skládají a jejich pořadí má význam. Používají se postupně zleva doprava.

// Příklad složení modifikátorů
Text(
    "Kombinovaný",
    modifier = Modifier
        .padding(16.dp) // Nejprve okraje
        .background(Color.Yellow) // Poté pozadí
        .clickable { /* Akce */ } // A nakonec klikatelnost
)

Efektivní použití modifikátorů umožňuje vytvářet flexibilní, adaptivní a interaktivní UI v deklarativním stylu Jetpack Compose.