Как използвате модификаторите във вашия код?

Модификаторите в разработката на Android, особено при използване на Jetpack Compose, играят ключова роля в настройката на външния вид и поведението на Composable функциите.

Основните начини на използване:

1. Размер и отстояния:

   • Задаване на ширина и височина: Modifier.width(...), Modifier.height(...), Modifier.size(...).
   • Добавяне на вътрешни отстояния: Modifier.padding(...).
   • Добавяне на външни отстояния: Modifier.offset(...).

   // Пример за използване на модификатори за размер и отстояния
   Box(
       modifier = Modifier
           .size(100.dp) // Задава размер
           .padding(16.dp) // Добавя вътрешни отстояния
   ) {
       // Съдържание на Box
   }
   

2. Фон и рамка:

   • Настройка на цвят или четка за фон: Modifier.background(...).
   • Добавяне на рамка: Modifier.border(...).

   // Пример за използване на модификатори за фон и рамка
   Text(
       "Здравей!",
       modifier = Modifier
           .background(Color.Blue) // Син фон
           .border(2.dp, Color.Red) // Червена рамка с дебелина 2dp
   )
   

3. Взаимодействие и обработка на събития:

   • Реакция на клик: Modifier.clickable(...).
   • Реакция на дълго натискане: Modifier.pointerInput(...) или Modifier.combinedClickable(...).
   • Управление на превъртане: Modifier.verticalScroll(...), Modifier.horizontalScroll(...).

   // Пример за използване на модификатор за клик
   Button(
       onClick = { /* Изпълнение на действие при клик */ },
       modifier = Modifier.padding(8.dp) // Отстояния за бутона
   ) {
       Text("Натисни ме")
   }
   

4. Разположение и подравняване:

   • Запълване на наличното пространство: Modifier.fillMaxSize(), Modifier.fillMaxWidth(), Modifier.fillMaxHeight().
   • Подравняване на съдържанието: Modifier.align(...).

   // Пример за използване на модификатор за запълване на пространство
   Column(
       modifier = Modifier.fillMaxSize() // Запълва цялото налично пространство
   ) {
       // Дъщерни елементи
   }
   

5. Състояние и ефекти:

   • Промяна на прозрачността: Modifier.alpha(...).
   • Завъртане и мащабиране: Modifier.rotate(...), Modifier.scale(...).
   • Прилагане на сенки: Modifier.shadow(...).

   // Пример за използване на модификатор за прозрачност
   Image(
       painter = painterResource(id = R.drawable.my_image),
       contentDescription = "Моето изображение",
       modifier = Modifier.alpha(0.5f) // Прави изображението полупрозрачно
   )
   

6. Специализирани модификатори за UI-компоненти: Някои компоненти имат свои собствени модификатори за специфична настройка, например:

   • Modifier.weight(...) за Column и Row.
   • Modifier.constrainAs(...) за ConstraintLayout.

Модификаторите се съчетават, и тяхната поредност има значение. Те се прилагат последователно отляво надясно.

// Пример за съчетаване на модификатори
Text(
    "Комбиниран",
    modifier = Modifier
        .padding(16.dp) // Първо отстояния
        .background(Color.Yellow) // След това фон
        .clickable { /* Действие */ } // И накрая, кликваемост
)

Ефективното използване на модификаторите позволява създаването на гъвкави, адаптивни и интерактивни UI в декларативен стил с Jetpack Compose.