android 我可以在jetpack compose viewModel中创建2个空单元格网格吗?

brqmpdu1  于 2024-01-04  发布在  Android
关注(0)|答案(1)|浏览(140)

我正在做一个益智游戏项目,我已经有1个空单元格,它与旁边的所有单元格交换位置,但我希望有2个空单元格。我已经尝试了一切,我可以无济于事。是否可以在jetpackcompose中实现这一点?
我尝试创建2个空单元格,但只有一个工作

nle07wnf

nle07wnf1#

是的,你可以创建一个有多个空单元格的益智游戏,这些空单元格与相邻的单元格交换位置。要实现这一点,你需要管理你的益智单元格的状态并相应地更新它们。你可以看到下面的代码,它可能会帮助你理解如何处理益智网格中的两个空单元格:

  1. import android.os.Bundle
  2. import androidx.activity.ComponentActivity
  3. import androidx.activity.compose.setContent
  4. import androidx.compose.foundation.background
  5. import androidx.compose.foundation.layout.*
  6. import androidx.compose.foundation.lazy.LazyColumn
  7. import androidx.compose.foundation.lazy.items
  8. import androidx.compose.foundation.shape.CircleShape
  9. import androidx.compose.material3.MaterialTheme
  10. import androidx.compose.material3.Surface
  11. import androidx.compose.material3.SurfaceColor
  12. import androidx.compose.material3.icons.Icons
  13. import androidx.compose.material3.icons.filled.Refresh
  14. import androidx.compose.material3.icons.filled.SwapHoriz
  15. import androidx.compose.material3.icons.filled.SwapVert
  16. import androidx.compose.material3.materialIcon
  17. import androidx.compose.material3.rememberAppBarConfiguration
  18. import androidx.compose.material3.rememberBottomSheetState
  19. import androidx.compose.material3.rememberScaffoldState
  20. import androidx.compose.material3.rememberSwipeableState
  21. import androidx.compose.material3.swipeable
  22. import androidx.compose.material3.textfield.TextFieldDefaults
  23. import androidx.compose.material3.*
  24. import androidx.compose.runtime.*
  25. import androidx.compose.ui.Alignment
  26. import androidx.compose.ui.Modifier
  27. import androidx.compose.ui.draw.clip
  28. import androidx.compose.ui.graphics.Color
  29. import androidx.compose.ui.platform.LocalDensity
  30. import androidx.compose.ui.res.painterResource
  31. import androidx.compose.ui.text.input.TextFieldValue
  32. import androidx.compose.ui.tooling.preview.Preview
  33. import androidx.compose.ui.unit.dp
  34. import com.example.featherandroidtasks.ui.theme.FeatherAndroidTasksTheme
  35. data class PuzzleCell(
  36. val value: Int,
  37. val isEmpty: Boolean,
  38. )
  39. @Composable
  40. fun PuzzleGame() {
  41. var puzzleCells by remember { mutableStateOf(generateInitialPuzzle()) }
  42. Column(
  43. modifier = Modifier
  44. .fillMaxSize()
  45. .padding(16.dp),
  46. verticalArrangement = Arrangement.Center,
  47. horizontalAlignment = Alignment.CenterHorizontally
  48. ) {
  49. Grid(cells = puzzleCells) { row, col ->
  50. onCellClick(row, col, puzzleCells)
  51. }
  52. Spacer(modifier = Modifier.height(16.dp))
  53. Row(
  54. modifier = Modifier.fillMaxWidth(),
  55. horizontalArrangement = Arrangement.Center,
  56. verticalAlignment = Alignment.CenterVertically
  57. ) {
  58. IconButton(
  59. onClick = {
  60. puzzleCells = generateInitialPuzzle()
  61. }
  62. ) {
  63. Icon(imageVector = Icons.Default.Refresh, contentDescription = "Restart")
  64. }
  65. }
  66. }
  67. }
  68. @Composable
  69. fun Grid(
  70. cells: List<List<PuzzleCell>>,
  71. onCellClick: (row: Int, col: Int) -> Unit
  72. ) {
  73. Column {
  74. for (row in cells.indices) {
  75. Row {
  76. for (col in cells[row].indices) {
  77. PuzzleCell(
  78. cell = cells[row][col],
  79. onCellClick = { onCellClick(row, col) }
  80. )
  81. }
  82. }
  83. }
  84. }
  85. }
  86. @Composable
  87. fun PuzzleCell(
  88. cell: PuzzleCell,
  89. onCellClick: () -> Unit
  90. ) {
  91. Box(
  92. modifier = Modifier
  93. .size(50.dp)
  94. .clickable { onCellClick() }
  95. .background(MaterialTheme.colorScheme.primary)
  96. .clip(CircleShape)
  97. ) {
  98. if (!cell.isEmpty) {
  99. Text(
  100. text = cell.value.toString(),
  101. color = MaterialTheme.colorScheme.onPrimary,
  102. modifier = Modifier
  103. .align(Alignment.Center)
  104. .padding(8.dp)
  105. )
  106. }
  107. }
  108. }
  109. fun generateInitialPuzzle(): List<List<PuzzleCell>> {
  110. val size = 4
  111. val values = (1..size * size - 1).shuffled() + listOf(0) // 0 represents the empty cell
  112. return values.chunked(size)
  113. .mapIndexed { row, list ->
  114. list.mapIndexed { col, value ->
  115. PuzzleCell(value = value, isEmpty = value == 0)
  116. }
  117. }
  118. }
  119. fun moveEmptyCell(
  120. puzzleCells: List<List<PuzzleCell>>,
  121. emptyCellRow: Int,
  122. emptyCellCol: Int,
  123. newRow: Int,
  124. newCol: Int
  125. ): List<List<PuzzleCell>> {
  126. return puzzleCells.mapIndexed { row, list ->
  127. list.mapIndexed { col, cell ->
  128. if ((row == emptyCellRow && col == emptyCellCol) ||
  129. (row == newRow && col == newCol)
  130. ) {
  131. PuzzleCell(value = cell.value, isEmpty = !cell.isEmpty)
  132. } else {
  133. cell
  134. }
  135. }
  136. }
  137. }
  138. @Composable
  139. fun onCellClick(row: Int, col: Int, puzzleCells: List<List<PuzzleCell>>) {
  140. val emptyCell = puzzleCells.flatten().first { it.isEmpty }
  141. val emptyCellRow = puzzleCells.indexOfFirst { it.contains(emptyCell) }
  142. val emptyCellCol = puzzleCells[emptyCellRow].indexOf(emptyCell)
  143. // Check if the clicked cell is a neighbor of the empty cell
  144. if ((row == emptyCellRow && (col == emptyCellCol - 1 || col == emptyCellCol + 1)) ||
  145. (col == emptyCellCol && (row == emptyCellRow - 1 || row == emptyCellRow + 1))
  146. ) {
  147. puzzleCells = moveEmptyCell(puzzleCells, emptyCellRow, emptyCellCol, row, col)
  148. }
  149. }
  150. @Preview(showBackground = true)
  151. @Composable
  152. fun PuzzleGamePreview() {
  153. PuzzleGame()
  154. }

字符串
在上面,我创建了一个PuzzleCell数据类来表示谜题网格中的每个单元格。PuzzleGame可组合函数管理谜题单元格的状态,并提供一个具有可点击单元格的网格。onCellClick函数处理将空单元格与其相邻单元格交换的逻辑。
此外,这是一个简单的示例,您可能需要根据特定的益智游戏需求对其进行调整。此外,您可能需要考虑使用更高级的状态管理解决方案,具体取决于游戏的复杂性。
请让我知道它是否有效,希望它有帮助!

展开查看全部

相关问题