Membuat Image Scroll dengan menggunakan Desain Material

	class MainActivity : ComponentActivity() {

	override fun onCreate(savedInstanceState: Bundle?) {
	super.onCreate(savedInstanceState)
	setContent {
	AffirmationsTheme {
	// A surface container using the 'background' color from the theme
	Surface(
	modifier = Modifier.fillMaxSize(),
	color = MaterialTheme.colorScheme.background
	) {
	AffirmationsApp()
	}
	}
	}
	}
	}

	@Composable
	fun AffirmationsApp() {
	AffirmationList(
	affirmationList = Datasource().loadAffirmations(),
	)
	}

	@Composable
	fun AffirmationList(affirmationList: List<Affirmation>, modifier: Modifier = Modifier) {
	LazyColumn(modifier = modifier) {
	items(affirmationList) { affirmation ->
	AffirmationCard(
	affirmation = affirmation,
	modifier = Modifier.padding(8.dp)
	)
	}
	}
	}

	@Composable
	fun AffirmationCard(affirmation: Affirmation, modifier: Modifier = Modifier) {
	Card(modifier = modifier) {
	Column {
	Image(
	painter = painterResource(affirmation.imageResourceId),
	contentDescription = stringResource(affirmation.stringResourceId),
	modifier = Modifier
	.fillMaxWidth()
	.height(194.dp),
	contentScale = ContentScale.Crop
	)
	Text(
	text = LocalContext.current.getString(affirmation.stringResourceId),
	modifier = Modifier.padding(16.dp),
	style = MaterialTheme.typography.headlineSmall
	)
	}
	}
	}

	@Preview
	@Composable
	private fun AffirmationCardPreview() {
	AffirmationCard(Affirmation(R.string.affirmation1, R.drawable.image1))
	}

view raw MainActivity hosted with ❤ by GitHub

	package com.example.affirmations.model

	import androidx.annotation.DrawableRes
	import androidx.annotation.StringRes

	data class Affirmation(
	@StringRes val stringResourceId: Int,
	@DrawableRes val imageResourceId: Int
	)

view raw affirmation hosted with ❤ by GitHub

	class Datasource() {
	fun loadAffirmations(): List<Affirmation> {
	return listOf<Affirmation>(
	Affirmation(R.string.affirmation1, R.drawable.image1),
	Affirmation(R.string.affirmation2, R.drawable.image2),
	Affirmation(R.string.affirmation3, R.drawable.image3),
	Affirmation(R.string.affirmation4, R.drawable.image4),
	Affirmation(R.string.affirmation5, R.drawable.image5),
	Affirmation(R.string.affirmation6, R.drawable.image6),
	Affirmation(R.string.affirmation7, R.drawable.image7),
	Affirmation(R.string.affirmation8, R.drawable.image8),
	Affirmation(R.string.affirmation9, R.drawable.image9),
	Affirmation(R.string.affirmation10, R.drawable.image10))
	}
	}

view raw datasource hosted with ❤ by GitHub

hasil:

Nabilayasha