add character screen

klokidis · May 2, 2024 · 96d2832 · 96d2832
1 parent 62cfddd
commit 96d2832
Show file tree

Hide file tree

Showing 7 changed files with 146 additions and 17 deletions.
diff --git a/app/src/main/java/com/example/charactersheet/CharacterSheetScreen.kt b/app/src/main/java/com/example/charactersheet/CharacterSheetScreen.kt
@@ -24,6 +24,7 @@ import androidx.navigation.compose.NavHost
 import androidx.navigation.compose.composable
 import com.example.charactersheet.ui.ArtistList
 import com.example.charactersheet.ui.CharacterViewModel
+import com.example.charactersheet.ui.ChooseCharacter
 
 enum class CharacterScreen(@StringRes var title: Int) {
     Start(title = R.string.app_name),
@@ -95,7 +96,12 @@ fun CharacterSheetApp(
                 )
             }
             composable(route = CharacterScreen.Artist.name) {
-
+                ChooseCharacter(
+                    onButtonCard = {
+                        viewModel.selectedCharacter(it)
+                    },
+                    uiState.listOfCharacters
+                )
             }
         }
     }

diff --git a/app/src/main/java/com/example/charactersheet/data/Datasource.kt b/app/src/main/java/com/example/charactersheet/data/Datasource.kt
@@ -24,18 +24,16 @@ class Datasource() {
 //            Artist(R.string.affirmation10, R.drawable.image10)
         )
     }
-    fun loadCharacters(): List<Artist> {
-        return listOf<Artist>(
-//            Artist(R.string.affirmation1, R.drawable.image1),
-//            Artist(R.string.affirmation2, R.drawable.image2),
-//            Artist(R.string.affirmation3, R.drawable.image3),
-//            Artist(R.string.affirmation4, R.drawable.image4),
-//            Artist(R.string.affirmation5, R.drawable.image5),
-//            Artist(R.string.affirmation6, R.drawable.image6),
-//            Artist(R.string.affirmation7, R.drawable.image7),
-//            Artist(R.string.affirmation8, R.drawable.image8),
-//            Artist(R.string.affirmation9, R.drawable.image9),
-//            Artist(R.string.affirmation10, R.drawable.image10)
-    )
+    fun loadCharacters(): List<Character> {
+        return listOf<Character>(
+            Character(R.string.name1, R.drawable.artist1,R.string.name1),
+            Character(R.string.name1, R.drawable.artist1,R.string.name1),
+            Character(R.string.name1, R.drawable.artist1,R.string.name1),
+            Character(R.string.name1, R.drawable.artist1,R.string.name1),
+            Character(R.string.name1, R.drawable.artist1,R.string.name1),
+            Character(R.string.name1, R.drawable.artist1,R.string.name1),
+            Character(R.string.name1, R.drawable.artist1,R.string.name1),
+            Character(R.string.name1, R.drawable.artist1,R.string.name1),
+            )
     }
 }
diff --git a/app/src/main/java/com/example/charactersheet/ui/CharacterViewModel.kt b/app/src/main/java/com/example/charactersheet/ui/CharacterViewModel.kt
@@ -2,7 +2,7 @@ package com.example.charactersheet.ui
 
 import androidx.lifecycle.ViewModel
 import com.example.charactersheet.model.Artist
-import com.example.charactersheet.ui.UiState
+import com.example.charactersheet.model.Character
 import kotlinx.coroutines.flow.MutableStateFlow
 import kotlinx.coroutines.flow.StateFlow
 import kotlinx.coroutines.flow.asStateFlow
@@ -24,4 +24,11 @@ class CharacterViewModel : ViewModel(){
             )
         }
     }
+    fun selectedCharacter(character: Character){
+        _uiState.update { currentState ->
+            currentState.copy(
+                characterChosen = character
+            )
+        }
+    }
 }
diff --git a/app/src/main/java/com/example/charactersheet/ui/ChooseArtis.kt b/app/src/main/java/com/example/charactersheet/ui/ChooseArtis.kt
@@ -40,6 +40,7 @@ fun ArtistList(
         items(artistList) { artist ->
             ArtistCard(
                 artist = artist,
+                {onButtonCard(artist)},
                 modifier = modifier
                     .padding(
                         top = dimensionResource(R.dimen.padding_medium),
@@ -51,13 +52,14 @@ fun ArtistList(
     }
 }
 @Composable
-fun ArtistCard(artist: Artist, modifier: Modifier = Modifier) {
+fun ArtistCard(artist: Artist,onButtonCard: () -> Unit, modifier: Modifier = Modifier) {
     Card(
         modifier = modifier
             .fillMaxWidth()
             .clip(MaterialTheme.shapes.medium)
             .clickable {
             },
+        onClick = onButtonCard,
         colors = CardDefaults.cardColors(
             containerColor = MaterialTheme.colorScheme.inverseOnSurface,
         ),

diff --git a/app/src/main/java/com/example/charactersheet/ui/ChooseCharacter.kt b/app/src/main/java/com/example/charactersheet/ui/ChooseCharacter.kt
@@ -0,0 +1,114 @@
+package com.example.charactersheet.ui
+
+
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.aspectRatio
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.layout.wrapContentSize
+import androidx.compose.foundation.lazy.grid.GridCells
+import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
+import androidx.compose.foundation.lazy.grid.items
+import androidx.compose.material3.Card
+import androidx.compose.material3.CardDefaults
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.layout.ContentScale
+import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.res.dimensionResource
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import com.example.charactersheet.R
+import com.example.charactersheet.model.Character
+import com.example.charactersheet.ui.theme.CharacterSheetTheme
+
+@Composable
+fun ChooseCharacter(
+    onButtonCard: (Character) -> Unit,
+    characterList: List<Character>,
+    modifier: Modifier = Modifier
+){
+    LazyVerticalGrid(
+        columns = GridCells.Fixed(2),
+        verticalArrangement = Arrangement.spacedBy(10.dp),
+        horizontalArrangement = Arrangement.spacedBy(10.dp),
+        modifier = Modifier.padding(start = 10.dp, end = 10.dp)
+        ) {
+        items(characterList) { thisCharacter ->
+            CharacterCard(
+                character = thisCharacter,
+                {onButtonCard(thisCharacter)},
+                modifier = modifier
+                    .padding(
+                        top = dimensionResource(R.dimen.padding_medium),
+                        start = dimensionResource(R.dimen.padding_medium),
+                        end = dimensionResource(R.dimen.padding_medium)
+                    ),
+            )
+        }
+    }
+}
+
+@Composable
+fun CharacterCard(character: Character,onButtonCard: () -> Unit, modifier: Modifier) {
+    Card(
+        modifier = modifier
+            .clip(MaterialTheme.shapes.medium)
+            .wrapContentSize(),
+        onClick = onButtonCard,
+        colors = CardDefaults.cardColors(
+            containerColor = MaterialTheme.colorScheme.inverseOnSurface,
+        ),
+        elevation = CardDefaults.cardElevation(
+            defaultElevation = dimensionResource(R.dimen.elevation_image),
+        )) {
+        Column(
+            verticalArrangement = Arrangement.Center,
+            horizontalAlignment = Alignment.CenterHorizontally
+        ) {
+            Image(
+                painter = painterResource(character.imageResourceId),
+                contentDescription = null, //no need
+                modifier = Modifier
+                    .size(width = 140.dp, height = 140.dp)
+                    .aspectRatio(1f),
+                contentScale = ContentScale.Crop
+            )
+            Spacer(modifier = Modifier.height(6.dp))
+            Text(
+                text = LocalContext.current.getString(character.stringResourceId),
+                style = MaterialTheme.typography.labelLarge,
+            )
+            Spacer(modifier = Modifier.height(5.dp))
+        }
+
+    }
+}
+
+@Preview(showBackground = true)
+@Composable
+fun GreetingPreview2() {
+    CharacterSheetTheme {
+        ChooseCharacter(
+            {Character(0,0,0) } ,
+            listOf<Character>(
+                Character(R.string.name1, R.drawable.artist1,R.string.name1),
+                Character(R.string.name1, R.drawable.artist1,R.string.name1),
+                Character(R.string.name1, R.drawable.artist1,R.string.name1),
+                Character(R.string.name1, R.drawable.artist1,R.string.name1),
+                Character(R.string.name1, R.drawable.artist1,R.string.name1),
+                Character(R.string.name1, R.drawable.artist1,R.string.name1),
+                Character(R.string.name1, R.drawable.artist1,R.string.name1),
+                Character(R.string.name1, R.drawable.artist1,R.string.name1),
+            ))
+    }
+}
diff --git a/app/src/main/java/com/example/charactersheet/ui/UiState.kt b/app/src/main/java/com/example/charactersheet/ui/UiState.kt
@@ -12,6 +12,6 @@ data class UiState(
     val artistChosen : Artist = Artist(0,0),
     val characterChosen : Character = Character(0,0,0),
 
-    val listOfCharacters: List<Character> = listOf(Character(0, 0,0)),
+    val listOfCharacters: List<Character> = Datasource().loadCharacters(),
     val listOfArtists: List<Artist> = Datasource().loadArtists(),
 )
diff --git a/app/src/main/res/values/dimens.xml b/app/src/main/res/values/dimens.xml
@@ -5,4 +5,6 @@
     <dimen name="elevation_image">3dp</dimen>
     <dimen name="image_height">105dp</dimen>
     <dimen name="image_width">115dp</dimen>
+    <dimen name="padding_medium_large">105dp</dimen>
+    <dimen name="padding_large">115dp</dimen>
 </resources>