google-developer-training / basic-android-kotlin-compose-training-unscramble

Apache License 2.0
98 stars 140 forks source link

Android Basics: Viewmodel and State in Compose #159

Open alghe-global opened 10 months ago

alghe-global commented 10 months ago
5. 
    Update the GameLayout() composable function to display currentScrambledWord. Set the text parameter of the first text field in the column to currentScrambledWord.

there's already a text field with hardcoded scrambled word. there's a contradiction between the instruction to update the text field to display the scrambledword and the text composable displayed as example

changes including both:

 @Composable
-fun GameLayout(modifier: Modifier = Modifier) {
+fun GameLayout(
+    currentScrambledWord: String,
+    modifier: Modifier = Modifier
+) {
     val mediumPadding = dimensionResource(R.dimen.padding_medium)

     Card(
@@ -146,8 +156,10 @@ fun GameLayout(modifier: Modifier = Modifier) {
                 color = colorScheme.onPrimary
             )
             Text(
-                text = "scrambleun",
-                style = typography.displayMedium
+                text = currentScrambledWord,
+                fontSize = 45.sp,
+                style = typography.displayMedium,
+                modifier = modifier.align(Alignment.CenterHorizontally)
             )
             Text(
                 text = stringResource(R.string.instructions),
@@ -155,7 +167,7 @@ fun GameLayout(modifier: Modifier = Modifier) {
                 style = typography.titleMedium
             )
             OutlinedTextField(
-                value = "",
+                value = currentScrambledWord,
                 singleLine = true,
                 shape = shapes.large,
                 modifier = Modifier.fillMaxWidth(),

changes to match screenshot in the codelab:

 @Composable
-fun GameLayout(modifier: Modifier = Modifier) {
+fun GameLayout(
+    currentScrambledWord: String,
+    modifier: Modifier = Modifier
+) {
     val mediumPadding = dimensionResource(R.dimen.padding_medium)

     Card(
@@ -146,8 +156,10 @@ fun GameLayout(modifier: Modifier = Modifier) {
                 color = colorScheme.onPrimary
             )
             Text(
-                text = "scrambleun",
-                style = typography.displayMedium
+                text = currentScrambledWord,
+                fontSize = 45.sp,
+                style = typography.displayMedium,
+                modifier = modifier.align(Alignment.CenterHorizontally)
             )
             Text(
                 text = stringResource(R.string.instructions),