📖 Teorija
Compose UI: funkcijos, ne XML
1 pamokoje matei: Compose UI — funkcijos su @Composable, ne XML failai. Šiandien iš to sudėsim tikrą meniu.
Trys sąvokos, kurių reikės:
- Kompozuojamas elementas — funkcija, aprašanti UI gabalą:
Text(...),Card { ... },Column { ... }. Vieni kviečia kitus — taip auga ekranas. Modifier— kaip elementas atrodo ir elgiasi:Modifier.fillMaxWidth().padding(16.dp). Grandinėlė skaitosi iš kairės į dešinę.LazyColumn— slenkamas sąrašas, kuris atvaizduoja tik matomus elementus (ne visą šimtą iškart). Meniu gali būti ilgas, todėlColumnčia netinka — reikiaLazyColumn.
Material 3 duoda paruoštus komponentus tinkama Android išvaizda: Scaffold (ekrano karkasas su viršutine juosta), TopAppBar, Card, Text su MaterialTheme.typography stiliais.
Meniu ekrano planas:
Scaffold
└─ TopAppBar("Pica Menu")
└─ LazyColumn
└─ kiekvienai picai: Card { pavadinimas · aprašymas · kaina }
Duomenys šiandien bus statiniai — trumpas picų sąrašas kode. Tikrą meniu iš serverio (GET /menu) prijungsim 5 pamokoje; kol kas svarbu, kad ekranas atrodytų teisingai. Pradėkim nuo modelio — kaip atrodo viena pica kode.