Jetpack Composable — изменение изображения после щелчка по нему. ⇐ Android
-
Гость
Jetpack Composable — изменение изображения после щелчка по нему.
В настоящее время я работаю над простым приложением в Android Studio из курса, доступного онлайн для Kotlin. Основная идея состоит в том, чтобы сделать изображение в центре кликабельным и менять его при достижении определенного количества кликов. На 1-е изображение мне нужно нажать один раз. На 2-е изображение мне приходится кликать от 2 до 4 раз и это случайно. На третьем изображении мне нужно нажать один раз. То же самое касается четвертого изображения, чтобы перезапустить весь процесс.
Мне удалось разместить все элементы на экране, и изображение стало кликабельным. Я вижу, что переменная currentPosition увеличивается, но изображение, используемое в приложении, не меняется. Я понимаю, что это может быть вопрос для новичков, но я только начинаю свой путь в Kotlin и Android Studio.
Кто-нибудь может мне помочь в этом деле? Я буду очень вам обязан. Весь код размещен ниже:
пакет com.example.lemonade импортировать android.os.Bundle импортировать android.text.style.BackgroundColorSpan импортировать androidx.activity.ComponentActivity импортировать androidx.activity.compose.setContent импортировать androidx.compose.foundation.Image импортировать androidx.compose.foundation.background импортировать androidx.compose.foundation.clickable импортировать androidx.compose.foundation.layout.Arrangement импортировать androidx.compose.foundation.layout.Column импортировать androidx.compose.foundation.layout.Row импортировать androidx.compose.foundation.layout.Spacer импортировать androidx.compose.foundation.layout.fillMaxSize импортировать androidx.compose.foundation.layout.fillMaxWidth импортировать androidx.compose.foundation.layout.height импортировать androidx.compose.foundation.layout.padding импортировать androidx.compose.foundation.layout.size импортировать androidx.compose.foundation.layout.wrapContentSize импортировать androidx.compose.foundation.shape.AbsoluteCutCornerShape импортировать androidx.compose.foundation.shape.AbsoluteRoundedCornerShape импортировать androidx.compose.material3.Button импортировать androidx.compose.material3.CenterAlignedTopAppBar импортировать androidx.compose.material3.ExperimentalMaterial3Api импортировать androidx.compose.material3.MaterialTheme импортировать androidx.compose.material3.Text импортировать androidx.compose.material3.TopAppBar импортировать androidx.compose.material3.TopAppBarDefaults импортировать androidx.compose.runtime.Composable импортировать androidx.compose.ui.Alignment импортировать androidx.compose.ui.Modifier импортировать androidx.compose.ui.graphics.Color импортировать androidx.compose.ui.graphics.Shape импортировать androidx.compose.ui.graphics.painter.Painter импортировать androidx.compose.ui.modifier.modifierLocalConsumer импортировать androidx.compose.ui.res.painterResource импортировать androidx.compose.ui.res.stringResource импортировать androidx.compose.ui.tooling.preview.Preview импортировать androidx.compose.ui.unit.dp импортировать com.example.lemonade.ui.theme.LemonadeTheme класс MainActivity : ComponentActivity() { @OptIn(ExperimentalMaterial3Api::class) переопределить fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { Лимонадная тема { ЛимонадWithTextAndImage() } } } } @Предварительный просмотр @Композитный веселое приложение Lemonade() { ЛимонадWithTextAndImage() } @OptIn(ExperimentalMaterial3Api::class) @Композитный весело LemonadeWithTextAndImage( модификатор: Модификатор = Модификатор .fillMaxSize() .wrapContentSize(Alignment.Center) .background(color = Цвет.Белый) ) { вар currentPosition = 1 вар NumberOfClicks = (2..4).random() var beforeLast = 1 + число кликов + 1 вар imageSource = когда (currentPosition) { 1 -> R.drawable.lemon_tree numberOfClicks -> R.drawable.lemon_squeeze beforeLast -> R.drawable.lemon_drink еще -> R.drawable.lemon_restart } вар totalNumberOfClicks = beforeLast++; Столбец( модификатор = modifier.fillMaxSize(), HorizontalAlignment = Alignment.CenterHorizontally ) { Централигнедтопаппбар( заголовок = { Текст("Лимонад") }, цвета = TopAppBarDefaults.smallTopAppBarColors( контейнерЦвет = Цвет.Желтый, titleContentColor = Цвет.Черный ) ) Spacer(модификатор = Modifier.height(200.dp)) Изображение( художник = PainterResource (id = imageSource), contentDescription = imageSource.toString(), Модификатор .кликабельный { println("Текущая позиция — $currentPosition") текущая позиция++ PainterResource (id = currentPosition) } .фон( цвет = Цвет(R.color.icons_background), форма = AbsoluteRoundedCornerShape(10) ) ) Spacer(модификатор = Modifier.height(16.dp)) Текст (текст = stringResource (id = R.string.tap_the_lemon_tree)) } }
В настоящее время я работаю над простым приложением в Android Studio из курса, доступного онлайн для Kotlin. Основная идея состоит в том, чтобы сделать изображение в центре кликабельным и менять его при достижении определенного количества кликов. На 1-е изображение мне нужно нажать один раз. На 2-е изображение мне приходится кликать от 2 до 4 раз и это случайно. На третьем изображении мне нужно нажать один раз. То же самое касается четвертого изображения, чтобы перезапустить весь процесс.
Мне удалось разместить все элементы на экране, и изображение стало кликабельным. Я вижу, что переменная currentPosition увеличивается, но изображение, используемое в приложении, не меняется. Я понимаю, что это может быть вопрос для новичков, но я только начинаю свой путь в Kotlin и Android Studio.
Кто-нибудь может мне помочь в этом деле? Я буду очень вам обязан. Весь код размещен ниже:
пакет com.example.lemonade импортировать android.os.Bundle импортировать android.text.style.BackgroundColorSpan импортировать androidx.activity.ComponentActivity импортировать androidx.activity.compose.setContent импортировать androidx.compose.foundation.Image импортировать androidx.compose.foundation.background импортировать androidx.compose.foundation.clickable импортировать androidx.compose.foundation.layout.Arrangement импортировать androidx.compose.foundation.layout.Column импортировать androidx.compose.foundation.layout.Row импортировать androidx.compose.foundation.layout.Spacer импортировать androidx.compose.foundation.layout.fillMaxSize импортировать androidx.compose.foundation.layout.fillMaxWidth импортировать androidx.compose.foundation.layout.height импортировать androidx.compose.foundation.layout.padding импортировать androidx.compose.foundation.layout.size импортировать androidx.compose.foundation.layout.wrapContentSize импортировать androidx.compose.foundation.shape.AbsoluteCutCornerShape импортировать androidx.compose.foundation.shape.AbsoluteRoundedCornerShape импортировать androidx.compose.material3.Button импортировать androidx.compose.material3.CenterAlignedTopAppBar импортировать androidx.compose.material3.ExperimentalMaterial3Api импортировать androidx.compose.material3.MaterialTheme импортировать androidx.compose.material3.Text импортировать androidx.compose.material3.TopAppBar импортировать androidx.compose.material3.TopAppBarDefaults импортировать androidx.compose.runtime.Composable импортировать androidx.compose.ui.Alignment импортировать androidx.compose.ui.Modifier импортировать androidx.compose.ui.graphics.Color импортировать androidx.compose.ui.graphics.Shape импортировать androidx.compose.ui.graphics.painter.Painter импортировать androidx.compose.ui.modifier.modifierLocalConsumer импортировать androidx.compose.ui.res.painterResource импортировать androidx.compose.ui.res.stringResource импортировать androidx.compose.ui.tooling.preview.Preview импортировать androidx.compose.ui.unit.dp импортировать com.example.lemonade.ui.theme.LemonadeTheme класс MainActivity : ComponentActivity() { @OptIn(ExperimentalMaterial3Api::class) переопределить fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { Лимонадная тема { ЛимонадWithTextAndImage() } } } } @Предварительный просмотр @Композитный веселое приложение Lemonade() { ЛимонадWithTextAndImage() } @OptIn(ExperimentalMaterial3Api::class) @Композитный весело LemonadeWithTextAndImage( модификатор: Модификатор = Модификатор .fillMaxSize() .wrapContentSize(Alignment.Center) .background(color = Цвет.Белый) ) { вар currentPosition = 1 вар NumberOfClicks = (2..4).random() var beforeLast = 1 + число кликов + 1 вар imageSource = когда (currentPosition) { 1 -> R.drawable.lemon_tree numberOfClicks -> R.drawable.lemon_squeeze beforeLast -> R.drawable.lemon_drink еще -> R.drawable.lemon_restart } вар totalNumberOfClicks = beforeLast++; Столбец( модификатор = modifier.fillMaxSize(), HorizontalAlignment = Alignment.CenterHorizontally ) { Централигнедтопаппбар( заголовок = { Текст("Лимонад") }, цвета = TopAppBarDefaults.smallTopAppBarColors( контейнерЦвет = Цвет.Желтый, titleContentColor = Цвет.Черный ) ) Spacer(модификатор = Modifier.height(200.dp)) Изображение( художник = PainterResource (id = imageSource), contentDescription = imageSource.toString(), Модификатор .кликабельный { println("Текущая позиция — $currentPosition") текущая позиция++ PainterResource (id = currentPosition) } .фон( цвет = Цвет(R.color.icons_background), форма = AbsoluteRoundedCornerShape(10) ) ) Spacer(модификатор = Modifier.height(16.dp)) Текст (текст = stringResource (id = R.string.tap_the_lemon_tree)) } }
Мобильная версия