MainScreen.kt

package com.example.horizontalpagerjetpackcompose.ui

import android.annotation.SuppressLint
import androidx.compose.foundation.ExperimentalFoundationApi
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.pager.HorizontalPager
import androidx.compose.foundation.pager.rememberPagerState
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.Scaffold
import androidx.compose.runtime.Composable
import androidx.compose.runtime.mutableStateListOf
import androidx.compose.runtime.remember
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.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import coil.compose.AsyncImage
import coil.request.ImageRequest

@SuppressLint("UnusedMaterial3ScaffoldPaddingParameter")
@OptIn(ExperimentalMaterial3Api::class, ExperimentalFoundationApi::class)
@Composable
fun MainScreen() {

    var images = remember {
        mutableStateListOf("https://www.pexels.com/photo/man-playing-with-dogs-on-a-beach-19597529",
                           "https://www.pexels.com/photo/sun-through-massive-redwood-trees-in-forest-19877487",
                           "https://www.pexels.com/photo/a-river-in-the-woods-with-trees-and-water-19820294",
                           "https://www.pexels.com/photo/basket-with-eggs-on-meadow-with-flowers-12411443",
                           "https://www.pexels.com/photo/lale-19416495",
                           "https://www.pexels.com/photo/a-road-in-the-middle-of-a-forest-with-fog-20440040",
                           "https://www.pexels.com/photo/buck-and-deer-on-grassland-17867773",
                           "https://www.pexels.com/photo/red-trees-1547813",
                           "https://www.pexels.com/photo/photo-of-stream-during-daytime-3225517",
                           "https://www.pexels.com/photo/scenic-view-of-snow-capped-mountains-during-night-3408744",)
    }
val pagerState = rememberPagerState(pageCount = { images.size })
    Scaffold(modifier = Modifier.padding(vertical = 48.dp)) {
        HorizontalPager(state = pagerState) { index ->
              AsyncImage(
                  model = ImageRequest.Builder(LocalContext.current)
                      .data(images[index])
                      .build(),
                  contentDescription = "Image",
                  modifier = Modifier
                      .fillMaxSize()
                      .padding(16.dp)
                      .clip(RoundedCornerShape(16.dp)),
                  contentScale = ContentScale.Crop)
        }

    }

}

@Preview
@Composable
fun MainPreview() {
    MainScreen()
}