[Compose] 카탈로그 앱 구현하기

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            TestComposeTheme {
                Surface(modifier = Modifier.fillMaxSize(),
                    color = MaterialTheme.colors.background) {
                    CatalogEx(items)
                }
            }
        }
    }

}

@Composable
fun CatalogEx(itemList: List<ItemData>) {
    LazyColumn {
        items(itemList) { item ->
            Item(item)
        }
    }
}

@Composable
fun Item(item: ItemData) {
    Card(
        elevation = 8.dp,
        modifier = Modifier.padding(16.dp)) {
        Column(modifier = Modifier.padding(8.dp)) {
            AsyncImage(model = item.imageUri, contentDescription = item.title,
                contentScale = ContentScale.Crop,
                placeholder = ColorPainter(Color.Gray),
                modifier = Modifier
                    .fillMaxWidth()
                    .height(300.dp))
            Spacer(modifier = Modifier.size(8.dp))
            Text(text = item.title, style = MaterialTheme.typography.h4)
            Spacer(modifier = Modifier.size(8.dp))
            Text(text = item.description)
        }
    }
}

data class ItemData(
    val imageUri: String,
    val title: String,
    val description: String,
)

val items = listOf(
    ItemData(imageUri = "https://cdn.mhnse.com/news/photo/202409/320798_361970_3115.jpg",
        title = "카리나",
        description = "1, 2, 3 깜짝 놀랄 다음 Scene\n" +
                "키를 거머쥔\n" +
                "주인공은 나\n" +
                "4, 3, 2 Going down\n" +
                "쉽게 Through\n" +
                "Deja Vu 같이\n" +
                "그려지는 이미지\n" +
                "날 굳이 막지 말아\n" +
                "이건 내 Drama\n" +
                "도발은 굳이 안 막아\n" +
                "Uh I'm a stunner"),
    ItemData(imageUri = "https://spnimage.edaily.co.kr/images/photo/files/NP/S/2024/07/PS24070200201.jpg",
        title = "윈터",
        description = "I'm on the Next Level Yeah\n" +
                "\n" +
                "절대적 룰을 지켜\n" +
                "\n" +
                "내 손을 놓지 말아\n" +
                "\n" +
                "결속은 나의 무기\n" +
                "\n" +
                "광야로 걸어가\n" +
                "\n" +
                "알아 네 Home ground\n" +
                "\n" +
                "위협에 맞서서\n" +
                "\n" +
                "제껴라 제껴라 제껴라"),
    ItemData(imageUri = "https://talkimg.imbc.com/TVianUpload/tvian/TViews/image/2023/06/07/a14fbc5e-6e2e-46b8-8d8f-60ead5b2d766.jpg",
        title = "지젤",
        description = "아른대는 something 떠나고픈 feeling\n" +
                "\n" +
                "거울 속엔 지친 my face\n" +
                "\n" +
                "길 잃은 맘의 갈피, 반복되는 trouble\n" +
                "\n" +
                "다른 게 좀 필요해\n" +
                "\n" +
                "미룰 수 없잖아\n" +
                "\n" +
                "'Cause life's too short\n" +
                "\n" +
                "망설이다 흘러가\n" +
                "\n" +
                "무슨 일이 벌어질까 궁금해\n" +
                "\n" +
                "훌쩍 떠난 그 순간\n" +
                "\n" +
                "내 방식대로 갈래"),
    ItemData(imageUri = "https://cdn.hankooki.com/news/photo/202311/120207_164424_1701040635.jpg",
        title = "닝닝",
        description = "That I, I-I-I got better things to do with my time\n" +
                "Better things to do with my time, do with my time than you\n" +
                "Oh-oh, I got better things to do with my time\n" +
                "Better things to do with my time, do with my time than you (break it down)\n" +
                "Oh-oh, I, better things to do with my time\n" +
                "Better things to do with my time, do with my time than you (yes)")
)


@Preview(showBackground = true)
@Composable
fun ItemPreview() {
    TestComposeTheme {
        Item(items[0])
    }
}

@Preview(showBackground = true)
@Composable
fun DefaultPreview() {
    TestComposeTheme {
        CatalogEx(items)
    }
}