[Compose] Component 알아보기 - Image, Coil

Image

 

네트워크 없이 간단한 Image를 설정하는 3가지 방법이 있다

1. painter = painterResource 사용

2. imageVector = 벡터 이미지 사용 

3. bitmap 사용 

    Column {
        Image(
            painter = painterResource(R.drawable.simpson),
            contentDescription = "simpson")

        Image(
            imageVector = Icons.Filled.Face,
            contentDescription = "vector"
        )

        //bitmap은 순수 Composable 함수에선 사용할 수 없고
        //context가 있는 곳에서 주입받아야 한다
//        Image(
//            bitmap = ,
//            contentDescription = null
//        )
    }

기여운 심슨..

 

---

Coil 라이브러리 사용해서 이미지 가져오기 

coil 라이브러리 추가하기 

1. libs.version.toml

[versions]
coilVersion = "2.2.2"
coilComposeVersion = "2.2.2"

[libraries]
androidx-coil = { group = "io.coil-kt", name = "coil", version.ref = "coilVersion" }
androidx-coil-compose = { group = "io.coil-kt", name = "coil-compose", version.ref = "coilComposeVersion" }

2. build.gradle (app)

implementation(libs.androidx.coil)
implementation(libs.androidx.coil.compose)

 

 

rememberImagePainter

(deprecated됨..)

val painter = rememberImagePainter(
    data = "https://media.contentapi.ea.com/content/dam/eacom/images/2023/07/simpsons-hero-md-homepage-7x2-xl.jpg.adapt.crop7x2.1920w.jpg"

)
Column {
    Image(
        painter = painter,
        contentDescription = null)
}

 

 

AsyncImage

AsyncImage(
    model = "https://media.contentapi.ea.com/content/dam/eacom/images/2023/07/simpsons-hero-md-homepage-7x2-xl.jpg.adapt.crop7x2.1920w.jpg",
    contentDescription = null
)