When player decides to quit game in middle, disabled the back press b…

…utton to trigger modal sheet asking user permission to quit the game. Now game screen shows player selected difficulty words.
RajashekarRaju · Apr 8, 2022 · 051499f · 051499f
1 parent c97a56f
commit 051499f
Show file tree

Hide file tree

Showing 2 changed files with 162 additions and 28 deletions.
diff --git a/app/src/main/java/com/hangman/hangman/ui/game/GameExitModalSheetContent.kt b/app/src/main/java/com/hangman/hangman/ui/game/GameExitModalSheetContent.kt
@@ -0,0 +1,81 @@
+package com.hangman.hangman.ui.game
+
+import androidx.compose.foundation.BorderStroke
+import androidx.compose.foundation.layout.*
+import androidx.compose.material.*
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.rememberCoroutineScope
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import kotlinx.coroutines.launch
+
+
+@OptIn(ExperimentalMaterialApi::class)
+@Composable
+fun ShowExitGameModalSheet(
+    navigateUp: () -> Unit,
+    modalSheetState: ModalBottomSheetState
+) {
+    val coroutineScope = rememberCoroutineScope()
+
+    Column(
+        modifier = Modifier.padding(horizontal = 40.dp, vertical = 60.dp),
+        horizontalAlignment = Alignment.CenterHorizontally
+    ) {
+        Text(
+            text = "Exit Game ?",
+            style = MaterialTheme.typography.h5,
+            color = MaterialTheme.colors.primary.copy(0.75f),
+        )
+
+        Spacer(modifier = Modifier.height(48.dp))
+
+        Button(
+            onClick = {
+                coroutineScope.launch {
+                    modalSheetState.hide()
+                }
+                navigateUp()
+            },
+            shape = MaterialTheme.shapes.medium,
+            colors = ButtonDefaults.outlinedButtonColors(backgroundColor = Color.Transparent),
+            border = BorderStroke(
+                width = 2.dp,
+                color = MaterialTheme.colors.primary.copy(0.5f)
+            ),
+            modifier = Modifier.fillMaxWidth()
+        ) {
+            Text(
+                text = "Exit",
+                letterSpacing = 4.sp,
+                style = MaterialTheme.typography.button,
+                color = MaterialTheme.colors.primary.copy(0.75f),
+                modifier = Modifier.padding(vertical = 4.dp)
+            )
+        }
+
+        Spacer(modifier = Modifier.height(8.dp))
+
+        Button(
+            modifier = Modifier.fillMaxWidth(),
+            elevation = ButtonDefaults.elevation(defaultElevation = 0.dp),
+            colors = ButtonDefaults.buttonColors(backgroundColor = Color.Transparent),
+            onClick = {
+                coroutineScope.launch {
+                    modalSheetState.hide()
+                }
+            },
+        ) {
+            Text(
+                text = "Keep Playing",
+                letterSpacing = 2.sp,
+                style = MaterialTheme.typography.button,
+                color = MaterialTheme.colors.primary.copy(0.75f),
+                modifier = Modifier.padding(vertical = 4.dp)
+            )
+        }
+    }
+}
diff --git a/app/src/main/java/com/hangman/hangman/ui/game/GameScreen.kt b/app/src/main/java/com/hangman/hangman/ui/game/GameScreen.kt
@@ -1,20 +1,20 @@
 package com.hangman.hangman.ui.game
 
+import androidx.activity.compose.BackHandler
 import androidx.compose.foundation.background
 import androidx.compose.foundation.clickable
-import androidx.compose.foundation.layout.Arrangement
-import androidx.compose.foundation.layout.PaddingValues
-import androidx.compose.foundation.layout.fillMaxSize
-import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.lazy.grid.GridCells
 import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
 import androidx.compose.foundation.lazy.grid.items
 import androidx.compose.foundation.shape.CircleShape
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.Surface
-import androidx.compose.material.Text
-import androidx.compose.runtime.*
-import androidx.compose.runtime.saveable.rememberSaveable
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material.*
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.rememberCoroutineScope
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.alpha
 import androidx.compose.ui.draw.clip
@@ -26,8 +26,10 @@ import androidx.lifecycle.viewmodel.compose.viewModel
 import com.hangman.hangman.HangmanApp
 import com.hangman.hangman.modal.Alphabets
 import com.hangman.hangman.repository.GameRepository
+import kotlinx.coroutines.launch
 
 
+@OptIn(ExperimentalMaterialApi::class)
 @Composable
 fun GameScreen(
     navigateUp: () -> Unit,
@@ -39,19 +41,39 @@ fun GameScreen(
         modelClass = GameViewModel::class.java
     )
 
+    val modalSheetState = rememberModalBottomSheetState(
+        initialValue = ModalBottomSheetValue.Hidden,
+        skipHalfExpanded = true,
+    )
+
+    val coroutineScope = rememberCoroutineScope()
+    BackHandler(enabled = true) {
+        coroutineScope.launch {
+            modalSheetState.show()
+        }
+    }
+
     Surface(
         color = MaterialTheme.colors.background
     ) {
-        GameScreenContent(
-            navigateUp = navigateUp,
-            viewModel = viewModel
-        )
+        ModalBottomSheetLayout(
+            sheetState = modalSheetState,
+            sheetShape = RoundedCornerShape(topStart = 16.dp, topEnd = 16.dp),
+            sheetBackgroundColor = MaterialTheme.colors.background,
+            scrimColor = Color.Black.copy(0.90f),
+            sheetContent = {
+                ShowExitGameModalSheet(navigateUp, modalSheetState)
+            },
+        ) {
+            GameScreenContent(
+                viewModel = viewModel
+            )
+        }
     }
 }
 
 @Composable
 private fun GameScreenContent(
-    navigateUp: () -> Unit,
     viewModel: GameViewModel
 ) {
     val randomGuessingWord = viewModel.guessingWord
@@ -65,7 +87,7 @@ private fun GameScreenContent(
     ) {
         val (
             pointsScoredText, currentLevelText, randomWordText,
-            alphabetsGridItems, attemptsLeftText, attemptsHintText
+            alphabetsGridItems, attemptsLeftText, attemptsHintText, gameDifficultyText
         ) = createRefs()
 
         Text(
@@ -88,13 +110,23 @@ private fun GameScreenContent(
             }
         )
 
+        Text(
+            text = "Difficulty : ${viewModel.gameDifficulty}",
+            style = MaterialTheme.typography.h4,
+            color = MaterialTheme.colors.primary,
+            modifier = Modifier.constrainAs(gameDifficultyText) {
+                centerHorizontallyTo(parent)
+                top.linkTo(currentLevelText.bottom, 16.dp)
+            }
+        )
+
         Text(
             text = randomGuessingWord,
             style = MaterialTheme.typography.h3,
             color = MaterialTheme.colors.primary,
             modifier = Modifier.constrainAs(randomWordText) {
                 centerHorizontallyTo(parent)
-                top.linkTo(currentLevelText.bottom)
+                top.linkTo(gameDifficultyText.bottom)
                 bottom.linkTo(attemptsHintText.top)
             }
         )
@@ -119,26 +151,47 @@ private fun GameScreenContent(
             }
         )
 
-        LazyVerticalGrid(
-            columns = GridCells.Adaptive(40.dp),
-            horizontalArrangement = Arrangement.spacedBy(12.dp),
-            verticalArrangement = Arrangement.spacedBy(12.dp),
-            contentPadding = PaddingValues(20.dp),
+        val playerWon = viewModel.playerWonTheGame
+
+        Box(
             modifier = Modifier
+                .fillMaxWidth()
                 .constrainAs(alphabetsGridItems) {
                     centerHorizontallyTo(parent)
                     start.linkTo(parent.start)
                     end.linkTo(parent.end)
                     bottom.linkTo(parent.bottom)
                 }
         ) {
-            items(
-                items = alphabets,
-                key = {
-                    it.alphabetId
+
+            if (playerWon) {
+
+                Text(
+                    text = "Moving Next Level",
+                    style = MaterialTheme.typography.h3,
+                    color = MaterialTheme.colors.primary,
+                    modifier = Modifier
+                        .fillMaxWidth()
+                        .align(alignment = Alignment.TopCenter),
+                    textAlign = TextAlign.Center,
+                )
+
+            } else {
+
+                LazyVerticalGrid(
+                    columns = GridCells.Adaptive(40.dp),
+                    horizontalArrangement = Arrangement.spacedBy(12.dp),
+                    verticalArrangement = Arrangement.spacedBy(12.dp),
+                    contentPadding = PaddingValues(20.dp),
+                    modifier = Modifier.fillMaxWidth()
+                ) {
+                    items(
+                        items = alphabets,
+                        key = { it.alphabetId }
+                    ) { alphabet ->
+                        ItemAlphabetText(alphabet, viewModel)
+                    }
                 }
-            ) { alphabet ->
-                ItemAlphabetText(alphabet, viewModel)
             }
         }
     }
@@ -149,7 +202,7 @@ private fun ItemAlphabetText(
     alphabet: Alphabets,
     viewModel: GameViewModel
 ) {
-    val showAlphabet = rememberSaveable { mutableStateOf(true) }
+    val showAlphabet = remember { mutableStateOf(true) }
     val isGameOver = viewModel.gameOver
 
     ConstraintLayout(