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

Apache License 2.0
55 stars 87 forks source link

Simple Animation with Jetpack Compose - Composable items declaration in different row #5

Closed MerajAhmadAnsari closed 1 year ago

MerajAhmadAnsari commented 2 years ago

URL of codelab https://developer.android.com/codelabs/basic-android-kotlin-compose-woof-animation?continue=https%3A%2F%2Fdeveloper.android.com%2Fcourses%2Fpathways%2Fandroid-basics-compose-unit-3-pathway-3%23codelab-https%3A%2F%2Fdeveloper.android.com%2Fcodelabs%2Fbasic-android-kotlin-compose-woof-animation#4

In which task and step of the codelab can this issue be found? Task - 5. Add Composable to display hobby Step 6 and 7

Describe the problem I believe display of "DogHobby" is not correct. Following is the code-

       Column() {
           Row(
                Row(
                    modifier = Modifier
                        .fillMaxWidth()
                        .padding(8.dp)
           ) {
               DogIcon(dog.imageResourceId)
               DogInformation(dog.name, dog.age)
               Spacer(Modifier.weight(1f))
               DogItemButton(
                   expanded = expanded,
                   onClick = { expanded = !expanded },
               )
           }
           DogHobby(dog.hobbies)
       }

Correct code should be like -

        Column(modifier = Modifier
            .animateContentSize(
                animationSpec = spring(
                    dampingRatio = Spring.DampingRatioMediumBouncy,
                    stiffness = Spring.StiffnessLow ))
        ) {
            Row(
                modifier = Modifier
                    .fillMaxWidth()
                    .padding(8.dp)
            ) {
                DogIcon(dog.imageResourceId)
                DogInformation(dog.name, dog.age)
                Spacer(modifier = Modifier.weight(1f))
                DogItemButton(expanded, { expanded = !expanded}, modifier)
            }
            Row() {
                if (expanded) {
                    DogHobby(dogHobby = dog.hobbies)
                }
            }
        }

Steps to reproduce? Not needed. Please check problem description

Versions Not needed. Please check problem description

Additional information image

osuleymanova commented 1 year ago

Hello @MerajAhmadAnsari,

Thanks for reaching out to us and reporting the issue. The code snippet was fixed:

Screen Shot 2022-12-06 at 11 20 30 AM