Add hide show keyboard function. Fix keyboard too big on small screens. Improve colors.

app/src/main/java/me/zobrist/tichucounter/MainActivity.kt

@@ -67,10 +67,20 @@ class MainActivity : BaseActivity() {
     fun MyScaffoldLayout(
         drawerState: DrawerState,
         scope: CoroutineScope,
-        navController: NavHostController
+        navController: NavHostController,
+        showFab: Boolean,
+        fabAction: () -> Unit
     ) {
 
         Scaffold(
+            floatingActionButton = {
+                if (showFab) {
+                    FloatingActionButton(
+                        onClick = { fabAction() }) {
+                        Icon(Icons.Outlined.Keyboard, null)
+                    }
+                }
+            },
             topBar = {
                 TopBar(
                     mainViewModel.topBarTitle,
@@ -238,9 +248,15 @@ class MainActivity : BaseActivity() {
                         )
                     }
                 }
-            },
-            content = { MyScaffoldLayout(drawerState, scope, navController) }
-        )
+            }
+        ) {
+            MyScaffoldLayout(
+                drawerState,
+                scope,
+                navController,
+                counterViewModel.keyboardHidden
+            ) { counterViewModel.keyboardHidden = false }
+        }
     }
 
     private class Screen(val route: String, val icon: ImageVector, @StringRes val resourceId: Int)

app/src/main/java/me/zobrist/tichucounter/ui/counter/CounterView.kt

@@ -61,11 +61,11 @@ fun Landscape(viewModel: ICounterViewModel) {
                 { viewModel.digitClicked(it) },
                 { viewModel.addSub100Clicked(it) },
                 { viewModel.deleteClicked() },
-                { viewModel.negateClicked() }
-            ) { viewModel.submitClicked() }
+                { viewModel.negateClicked() },
+                { viewModel.submitClicked() },
+                { viewModel.keyboardHidden = true })
         }
     }
-
 }
 
 @Composable
@@ -89,6 +89,7 @@ fun Portrait(viewModel: ICounterViewModel) {
             Modifier.weight(1f)
         )
 
+        if (!viewModel.keyboardHidden) {
             KeyboardView(
                 viewModel.currentScoreA,
                 viewModel.currentScoreB,
@@ -99,8 +100,10 @@ fun Portrait(viewModel: ICounterViewModel) {
                 { viewModel.digitClicked(it) },
                 { viewModel.addSub100Clicked(it) },
                 { viewModel.deleteClicked() },
-            { viewModel.negateClicked() }
-        ) { viewModel.submitClicked() }
+                { viewModel.negateClicked() },
+                { viewModel.submitClicked() },
+                { viewModel.keyboardHidden = true })
+        }
     }
 }
 
@@ -129,6 +132,7 @@ internal class PreviewViewModel : ICounterViewModel {
     override var requestFocusA: FocusRequester = FocusRequester()
     override var activeValue: String = currentScoreA
     override var inactiveValue: String = currentScoreB
+    override var keyboardHidden: Boolean = false
 
     override fun giveFocusToAIfNone() {
     }

app/src/main/java/me/zobrist/tichucounter/ui/counter/CounterViewModel.kt

@@ -29,6 +29,7 @@ interface ICounterViewModel {
     var requestFocusA: FocusRequester
     var activeValue: String
     var inactiveValue: String
+    var keyboardHidden: Boolean
 
     fun giveFocusToAIfNone()
     fun updateOtherScore()
@@ -75,6 +76,8 @@ class CounterViewModel @Inject constructor(
 
     override var requestFocusA by mutableStateOf(FocusRequester())
 
+    override var keyboardHidden by mutableStateOf(false)
+
     override var activeValue: String
         get() {
             return if (isBFocused) {

app/src/main/java/me/zobrist/tichucounter/ui/counter/KeyboardView.kt

@@ -5,6 +5,7 @@ import androidx.compose.foundation.layout.*
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.outlined.Backspace
 import androidx.compose.material.icons.outlined.Check
+import androidx.compose.material.icons.outlined.KeyboardHide
 import androidx.compose.material3.*
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.ExperimentalComposeUiApi
@@ -13,6 +14,7 @@ import androidx.compose.ui.focus.FocusRequester
 import androidx.compose.ui.focus.focusRequester
 import androidx.compose.ui.focus.onFocusChanged
 import androidx.compose.ui.graphics.vector.ImageVector
+import androidx.compose.ui.platform.LocalConfiguration
 import androidx.compose.ui.platform.LocalSoftwareKeyboardController
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.Preview
@@ -33,7 +35,8 @@ fun KeyboardView(
     addSub100Clicked: (Int) -> Unit,
     deleteClicked: () -> Unit,
     negateClicked: () -> Unit,
-    submitClicked: () -> Unit
+    submitClicked: () -> Unit,
+    hideKeyboardClicked: () -> Unit
 ) {
     val keyboardController = LocalSoftwareKeyboardController.current
 
@@ -136,8 +139,8 @@ fun KeyboardView(
 
         Row {
             Column(Modifier.weight(1f)) {
-                KeyboardTextButton("+/-") {
-                    negateClicked()
+                KeyboardIconButton(Icons.Outlined.KeyboardHide) {
+                    hideKeyboardClicked()
                 }
             }
             Column(Modifier.weight(1f)) {
@@ -145,7 +148,13 @@ fun KeyboardView(
                     digitClicked("0")
                 }
             }
-            Column(Modifier.weight(2f)) {
+
+            Column(Modifier.weight(1f)) {
+                KeyboardTextButton("+/-") {
+                    negateClicked()
+                }
+            }
+            Column(Modifier.weight(1f)) {
                 KeyboardIconButton(Icons.Outlined.Check, enableSubmit) {
                     submitClicked()
                 }
@@ -156,13 +165,25 @@ fun KeyboardView(
 
 @Composable
 fun KeyboardTextButton(text: String, onClicked: () -> Unit) {
+
+    val configuration = LocalConfiguration.current
+
+    val screenWidth = configuration.screenWidthDp.dp
+
+    val style = if(screenWidth < 350.dp)
+    {
+         MaterialTheme.typography.labelSmall
+    }else {
+        MaterialTheme.typography.labelLarge
+    }
+
     ElevatedButton(
         modifier = Modifier
             .fillMaxWidth()
             .height(50.dp)
             .padding(2.dp),
         onClick = { onClicked() },
-    ) { Text(text) }
+    ) { Text(text, style = style) }
 }
 
 @Composable
@@ -225,6 +246,7 @@ fun KeyboardViewPreview() {
                 {},
                 {},
                 {},
+                {},
                 {})
         }
     }

app/src/main/java/me/zobrist/tichucounter/ui/counter/TeamNamesView.kt

@@ -8,6 +8,7 @@ import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
 import me.zobrist.tichucounter.ui.AppTheme
 
 @OptIn(ExperimentalMaterial3Api::class)
@@ -18,13 +19,18 @@ fun TeamNamesView(
     updateA: (String) -> Unit,
     updateB: (String) -> Unit
 ) {
+
+    val color = TextFieldDefaults.textFieldColors(
+        containerColor = MaterialTheme.colorScheme.surfaceColorAtElevation(1.dp))
+
     Row {
         TextField(
             value = nameA,
             textStyle = LocalTextStyle.current.copy(textAlign = TextAlign.Center),
             onValueChange = { updateA(it) },
             singleLine = true,
-            modifier = Modifier.weight(1f)
+            modifier = Modifier.weight(1f),
+            colors = color
         )
 
         TextField(
@@ -32,7 +38,8 @@ fun TeamNamesView(
             textStyle = LocalTextStyle.current.copy(textAlign = TextAlign.Center),
             onValueChange = { updateB(it) },
             singleLine = true,
-            modifier = Modifier.weight(1f)
+            modifier = Modifier.weight(1f),
+            colors = color
         )
     }
 }

app/src/main/java/me/zobrist/tichucounter/ui/counter/TeamScoresView.kt

@@ -4,10 +4,7 @@ import android.content.res.Configuration
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.padding
-import androidx.compose.material3.ElevatedCard
-import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.Surface
-import androidx.compose.material3.Text
+import androidx.compose.material3.*
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.text.style.TextAlign
@@ -19,7 +16,7 @@ import me.zobrist.tichucounter.ui.AppTheme
 @Composable
 fun TeamScoresView(scoreA: Int, scoreB: Int) {
 
-    ElevatedCard {
+    ElevatedCard(elevation = CardDefaults.elevatedCardElevation(3.dp)) {
         Row {
             Text(
                 style = MaterialTheme.typography.headlineSmall,