I'm still getting the hang of Android's Jetpack Compose declarative UI library and would appreciate some help. The column (containing an image "icon" and text) isn't rendering at all on smaller screens. Here is the relevant code -->
@Composable
fun ComposableExample() {
...
ScrollableColumn(modifier = Modifier.fillMaxWidth()) {
// Scrollable column should have one child.
Column {
Row(
modifier = Modifier.fillMaxWidth(),
verticalAlignment = Alignment.CenterVertically,
) {
Text(text = "This is the Title of the Video")
//--------- This column is rendering on wider (tablet+) screens but not phone sized screens.
Column(horizontalAlignment = Alignment.CenterHorizontally,
modifier = Modifier.fillMaxWidth()) {
Image(imageResource(id = R.drawable.icon_download_arrow),
modifier = Modifier.preferredSize(20.dp)
.clickable(onClick = { }))
Text(text = "Download")
}
// ---------
}
...
}
}
}
I've tried a ton of different modifiers/permutations and can't get the column to render on smaller screens. I'd really appreciate some help, thanks!