Two changes in this section:
1. To make column scrollable we use .verticalScroll(rememberScrollState()) modifier on the column instead of using ScrollableColumn
2. Use image composable like this:
Image(
painter = painterResource(R.drawable.happy_meal_small),
contentDescription = null,
modifier = Modifier
.fillMaxWidth()
.height(225.dp),
contentScale = ContentScale.Crop
)
As time of this post, writing app using Jetpack Compose dose not need the android studio 4.2 canary build. I’m using Android Studio Bumblebee| 2021.1.1.
For dependencies setup visit Google Jetpack Compose Documents. Some of the has been updated, you can find them using IDE hints on library name or in dependencies section in project structure dialog (Ctrl+Alt+Shift+s).
First head to build.gradle (Project …) and add Compose version variable to buildscripts block like this
ext {
compose_version = ‘1.0.5’
kotlin_version = ‘1.5.31’
}
Then add these dependencies in build.gradle (Module …)
implementation “androidx.compose.ui:ui:$compose_version“
// Tooling support (Previews, etc.)
implementation “ndroidx.compose.ui:ui-tooling:$compose_version“
// Foundation (Border, Background, Box, Image, Scroll, shapes, animations, etc.)
implementation “androidx.compose.foundation:foundation:$compose_version“
// Material Design
implementation “androidx.compose.material:material:$compose_version“
// Material design icons
implementation “androidx.compose.material:material-icons-core:$compose_version“
implementation “androidx.compose.material:material-icons-extended:$compose_version“
// Integration with observables
implementation “androidx.compose.runtime:runtime-livedata:$compose_version“
implementation “androidx.compose.runtime:runtime-rxjava2:$compose_version“
// Integration with activities
implementation ‘androidx.activity:activity-compose:1.4.0’
// Integration with ViewModels
implementation ‘androidx.lifecycle:lifecycle-viewmodel-compose:2.5.0-alpha01’
// UI Tests
androidTestImplementation ‘androidx.compose.ui:ui-test-junit4:1.0.5’
Let's code together 🧑🤝🧑