Anatomia funkcji @Composable
Czytaj funkcję Composable i rozpoznawaj, co ją wyróżnia
Anatomia funkcji @Composable to bezpłatna lekcja Jetpack Compose Academy na CoddyKit. To lekcja 3 z 4. Możesz przeczytać całą lekcję poniżej za darmo — a potem ćwiczyć ją interaktywnie w przeglądarce z wbudowanym edytorem kodu i tutorem AI dostępnym 24/7. To część ścieżki edukacyjnej Jetpack Compose Academy, a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs Jetpack Compose Academy zawiera 4 lekcji w sumie.
Części tej lekcji nie zostały jeszcze przetłumaczone i są wyświetlane po angielsku.
What Is a Composable?
A Composable is just a Kotlin function that describes a piece of UI. Call it, and Compose draws that UI on screen. It is the building block of everything. 🧱
The @Composable Annotation
The magic marker is @Composable above the function. It tells the Compose compiler this function can emit UI and may be recomposed when data changes.
@Composable
fun Greeting() {
Text("Hello!")
}Name It Like a UI Piece
By convention, Composable names use PascalCase nouns like Greeting or ProfileCard, not verbs. The name describes the thing on screen, not an action.
It Returns Unit
A Composable usually returns nothing (Unit). Instead of returning UI, it emits it by calling other Composables inside its body. The side effect is the drawing.
Built-In Composables
Compose ships ready-made Composables like Text, Button, Image, and Icon. You combine these to build your own, so you rarely start from a blank canvas.
@Composable
fun Welcome() {
Text("Welcome to Compose")
}Parameters Pass In Data
Composables take parameters just like any function. Pass data in, and the UI reflects it. This is how the same component shows different content.
@Composable
fun Greeting(name: String) {
Text("Hello, " + name)
}The Modifier Parameter
Most Composables accept a modifier to control size, padding, and layout. By convention it is the first optional parameter, ready for you to customize.
Composables Call Composables
A Composable can only be called from another Composable. This rule lets Compose track the tree of UI and recompose the right parts when state changes.
Keep Them Small
Aim for small, focused Composables that do one thing. Tiny pieces are easier to reuse, preview, and combine into bigger screens later on.
Prefer No Side Effects
A good Composable is predictable: same inputs, same UI. Avoid surprises like network calls in the body, since Compose may run it many times.
Compose Builds a Tree
As Composables call each other, they form a UI tree. Compose walks this tree to draw the screen and to update only the branches that changed.
Quick Check
Let's verify what marks a function as a UI builder.
Recap: The Composable
A Composable is a Kotlin function with @Composable that emits UI, takes parameters, accepts a modifier, and calls other Composables to build a tree.
Często zadawane pytania
Czy lekcja „Anatomia funkcji @Composable” jest bezpłatna?
Tak — pełny tekst „Anatomia funkcji @Composable” jest dostępny za darmo tutaj w sieci. Aby ćwiczyć ją interaktywnie (wbudowany edytor kodu i tutor AI dostępny 24/7) i odblokować resztę kursu Jetpack Compose Academy, przejdź na CoddyKit PRO. Kurs Jetpack Compose Academy zawiera 4 lekcji w sumie.
Co nauczysz się w „Anatomia funkcji @Composable”?
Czytaj funkcję Composable i rozpoznawaj, co ją wyróżnia Ćwiczysz Jetpack Compose Academy z praktycznym kodem, który uruchamiasz bezpośrednio w przeglądarce, a tutor AI dostępny 24/7 odpowiada na Twoje pytania podczas pracy nad lekcją.
Czy potrzebuję doświadczenia, aby zacząć Jetpack Compose Academy?
Nie wymagamy żadnego doświadczenia. Jetpack Compose Academy w CoddyKit jest strukturyzowany dla początkujących i zaawansowanych użytkowników, więc możesz zacząć tutaj lub od początku i uczyć się w swoim tempie. To lekcja 3 z 4.
Ile czasu zajmuje lekcja „Anatomia funkcji @Composable”?
Większość lekcji CoddyKit trwa około 5–10 minut. Każda lekcja to mały, interaktywny krok, dzięki czemu robisz systematyczne postępy i zawsze wracasz dokładnie do tego samego miejsca — na webie i w aplikacji.
Czy mogę pisać i uruchamiać kod w tej lekcji Jetpack Compose Academy?
Tak. Każda lekcja Jetpack Compose Academy zawiera wbudowany edytor kodu, więc piszesz i uruchamiasz prawdziwy kod bezpośrednio w przeglądarce i od razu otrzymujesz sprzężenie zwrotne od AI — bez konfiguracji na komputerze.
Wszystkie lekcje w tym kursie
- Co zastępuje Compose: pożegnanie z XML
- Konfigurowanie Android Studio dla Compose
- Anatomia funkcji @Composable
- Uruchamianie pierwszej aplikacji na emulatorze