目前,我正在Android Studio中开发一个简单的应用程序,该应用程序可以在线使用Kotlin。一般的想法是使中心的图像可点击,并在满足一定数量的点击时更改图像。在第一张图片上,我必须点击一次。在第二张图片上,我必须点击2到4次,这是随机的。在第三张图片上,我必须点击一次。第四张图片也是如此,重新启动整个过程。
我能够把所有的元素在屏幕上,图像是可点击的。我可以看到currentPosition变量正在递增,但应用程序中使用的图像没有变化。我确实意识到这可能是一些新手问题,但我正处于Kotlin和Android Studio之路的起点。
有没有人能在这个案子上帮助我?我将不胜感激。整个代码放在下面:
package com.example.lemonade
import android.os.Bundle
import android.text.style.BackgroundColorSpan
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.wrapContentSize
import androidx.compose.foundation.shape.AbsoluteCutCornerShape
import androidx.compose.foundation.shape.AbsoluteRoundedCornerShape
import androidx.compose.material3.Button
import androidx.compose.material3.CenterAlignedTopAppBar
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Text
import androidx.compose.material3.TopAppBar
import androidx.compose.material3.TopAppBarDefaults
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.Shape
import androidx.compose.ui.graphics.painter.Painter
import androidx.compose.ui.modifier.modifierLocalConsumer
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import com.example.lemonade.ui.theme.LemonadeTheme
class MainActivity : ComponentActivity() {
@OptIn(ExperimentalMaterial3Api::class)
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContent {
LemonadeTheme {
LemonadeWithTextAndImage()
}
}
}
}
@Preview
@Composable
fun LemonadeApp() {
LemonadeWithTextAndImage()
}
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun LemonadeWithTextAndImage(
modifier: Modifier = Modifier
.fillMaxSize()
.wrapContentSize(Alignment.Center)
.background(color = Color.White)
) {
var currentPosition = 1
var numberOfClicks = (2..4).random()
var beforeLast = 1 + numberOfClicks + 1
var imageSource = when (currentPosition) {
1 -> R.drawable.lemon_tree
numberOfClicks -> R.drawable.lemon_squeeze
beforeLast -> R.drawable.lemon_drink
else -> R.drawable.lemon_restart
}
var totalNumberOfClicks = beforeLast++;
Column(
modifier = modifier.fillMaxSize(),
horizontalAlignment = Alignment.CenterHorizontally
) {
CenterAlignedTopAppBar(
title = {
Text("Lemonade")
},
colors = TopAppBarDefaults.smallTopAppBarColors(
containerColor = Color.Yellow,
titleContentColor = Color.Black
)
)
Spacer(modifier = Modifier.height(200.dp))
Image(
painter = painterResource(id = imageSource),
contentDescription = imageSource.toString(),
Modifier
.clickable {
println("The current position is $currentPosition")
currentPosition++
painterResource(id = currentPosition)
}
.background(
color = Color(R.color.icons_background),
shape = AbsoluteRoundedCornerShape(10)
)
)
Spacer(modifier = Modifier.height(16.dp))
Text(text = stringResource(id = R.string.tap_the_lemon_tree))
}
}
2条答案
按热度按时间roqulrg31#
如果你不使用observables,要使你的vars可观察和可变,你应该使用mutableStateOf(),尝试以下方法:
8zzbczxx2#
这是一个实践Jetpack Codelab:点击行为
您的答案可以在以下网址找到:https://developer.android.com/codelabs/basic-android-kotlin-compose-button-click-practice-problem#1