◆ Sparround

Compose UI-nin agent ilə yazılması

Compose agent üçün nisbətən əlverişli sahədir: kod deklarativdir, bir faylda cəmlənir, @Preview ilə tez yoxlanılır. Amma tipik səhvlər də var və onlar compile olur — yəni yalnız review və test tutur:

  • State hoisting pozuntusu — Composable öz state-ini içəridə saxlayır, nəticədə yenidən istifadə və test edilə bilmir.
  • Recomposition problemləri — hesablama birbaşa Composable gövdəsində, remember olmadan.
  • Modifier-in düzgün ötürülməməsi — parametr kimi qəbul edilmir və ya zəncirin əvvəlinə tətbiq olunmur.
  • Lifecycle-a həssas olmayan collect — collectAsState arxa fonda da collect etməyə davam edir.
kotlin
// WHAT THE AGENT OFTEN WRITES (compiles, but has problems)
@Composable
fun OrderScreen(viewModel: OrderViewModel) {
    val state by viewModel.uiState.collectAsState()   // not lifecycle-aware
    var filter by remember { mutableStateOf("") }      // state trapped inside
    val sorted = state.orders.sortedBy { it.date }     // re-sorts on every recomposition

    Column {
        // no modifier parameter — the caller cannot control sizing
        sorted.forEach { OrderRow(it) }
    }
}

// AFTER REVIEW
@Composable
fun OrderScreen(
    viewModel: OrderViewModel,
    modifier: Modifier = Modifier,
) {
    val state by viewModel.uiState.collectAsStateWithLifecycle()
    OrderScreen(
        state = state,
        onFilterChange = viewModel::onFilterChange,
        modifier = modifier,
    )
}

// The stateless version: testable and previewable
@Composable
fun OrderScreen(
    state: OrderUiState,
    onFilterChange: (String) -> Unit,
    modifier: Modifier = Modifier,
) {
    val sorted = remember(state.orders) { state.orders.sortedBy { it.date } }
    Column(modifier = modifier) {
        sorted.forEach { OrderRow(order = it) }
    }
}

Tipik fərq. `collectAsStateWithLifecycle` `androidx.lifecycle:lifecycle-runtime-compose` artefaktından gəlir və collect-i lifecycle-a bağlayır.

Nəyi tapşırıqda göstərməkNiyə
Nümunə ekran faylı ("ProfileScreen.kt kimi et")Layihənin state və naviqasiya pattern-i avtomatik təkrarlanır
State-li və state-siz versiyanın ayrılmasıTest və preview yalnız state-siz versiyada mümkündür
`@Preview` tələbiSürətli vizual yoxlama və sənədləşmə
Mətnlərin `strings.xml`-də olmasıAgent hardcode string-ə meyllidir
Compile əmriAgent özünü yoxlaya bilir

@Preview agentlə işləmədə xüsusi dəyərlidir: preview-lar compile olunur, yəni sintaktik və tip səhvləri dərhal ortaya çıxır, üstəlik siz nəticəni Android Studio-da göz ilə yoxlaya bilirsiniz. Ona görə "hər public Composable üçün preview" qaydası agentlə işləyəndə adi vaxtdakından daha faydalıdır.

📚 Mənbələr və sənədlər