一、问题
cy老师第五次作业
结合LaunchedEffect实现计时器功能。要求：动态计时，每秒修改时间，计时的时间格式为“00：00：00”（小时：分钟：秒）提交源代码的文本和运行截图。
二、结果
三、代码
package com.example.test02
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.layout.wrapContentSize
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.automirrored.filled.ExitToApp
import androidx.compose.material.icons.filled.PlayArrow
import androidx.compose.material3.Icon
import androidx.compose.material3.IconButton
import androidx.compose.material3.LinearProgressIndicator
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.MutableState
import androidx.compose.runtime.mutableIntStateOf
import androidx.compose.runtime.mutableLongStateOf
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.rememberUpdatedState
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import kotlinx.coroutines.delay
@Preview
@Composable
fun MainScreen_04(){
//函数作用域内
val timer = remember{ mutableLongStateOf(0) }
var runningState = remember{ mutableStateOf(true) }
val timerState = rememberUpdatedState(newValue = timer)
val formattedTime = formatTime(timerState.value.value)
LaunchedEffect(Unit){
while(runningState.value){
delay(100)
timerState.value.value +=1
// if(timerState.value.value == 100)
// runningState.value =false
}
}
Box(modifier = Modifier.fillMaxSize(),
contentAlignment = Alignment.Center){
Column(modifier = Modifier.fillMaxWidth(),
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center){
// LinearProgressIndicator(
// progress = { timer.value.toFloat()/100 },
// modifier = Modifier.size(800.dp,10.dp),
// color = Color.Green,
// trackColor = Color.LightGray,
// )
Text(text = "计时器",fontSize=30.sp,color= MaterialTheme.colorScheme.primary)
Text(text = "${timerState.value.value}秒",fontSize = 24.sp)
// TimerDisplay(timerState.value)
Row(modifier = Modifier.fillMaxWidth(),
horizontalArrangement = Arrangement.Center){
IconButton(modifier = Modifier.width(100.dp),
onClick={
runningState.value = true
timer.value = 0
}){
Row{
Icon(imageVector = Icons.Filled.PlayArrow,tint = Color.Green,contentDescription = null)
Text("计时")
}
}
IconButton(modifier = Modifier.width(100.dp),
onClick={
runningState.value = false
timer.value +=1
}){
Row{
Icon(imageVector = Icons.AutoMirrored.Filled.ExitToApp,
tint = Color.Green,contentDescription = null)
Text("停止")
}
}
}
}
}
}
@Composable
fun TimerDisplay(timerState: MutableState<Long>) {
val formattedTime = formatTime(timerState.value)
Text(text = formattedTime,
color = Color.Red, // 字体颜色为红色
fontSize = 24.sp, // 字体大小
)
}
private fun formatTime(seconds: Long): String {
return String.format(" %02d:%02d:%02d",seconds/3600, seconds / 60, seconds % 60)
}
