Android Jetpack Compose UI

    [Android Dialog] 1. Compose Dialog를 이용해 커스텀 다이얼로그 만들기

    Compose에서 사용할 수 있는 다이얼로그의 종류 Compose에서는 두가지 종류의 Dialog를 사용할 수 있다. Dialog : 커스텀한 다이얼로그를 생성 AlertDialog : 미리 정의된 스타일에 따라 Dialog를 생성 Dialog를 이용하면 커스텀한 다이얼로그를 생성할 수 있으며, AlertDialog 함수는 정해진 스타일에 따라 Dialog를 생성한다. 둘 모두 장단점이 있다. Dialog를 사용하면 다이얼로그를 만드는데 시간이 오래 걸리지만 필요한 디자인을 충분히 적용할 수 있다. AlertDialog를 사용하면 미리 정의되어 있는 스타일을 사용할 수 있어 다이얼로그를 만드는데 시간이 적게 걸리고 코드를 직관적으로 만들 수 있지만 정해진 스타일대로만 정의가 가능하다. AlertDialo..

    [Compose Text] buildAnnotatedString과 withStyle 이용해 Text 스타일링 하기

    buildAnnotatedString이란? buildAnnotatedString은 AnnotatedString 객체를 만드는 inline function이다. inline fun buildAnnotatedString(builder: (Builder).() -> Unit): AnnotatedString = Builder().apply(builder).toAnnotatedString() buildAnnotatedString을 이용해 만들어진 AnnotatedString은 하나의 Text 안에서 여러 스타일을 적용할 수 있도록 하는 정보를 담은 객체로 AnnotatedString 속에는 텍스트의 스타일에 대한 정보를 담은 text, spanStyles, paragraphStyles, annotations 객체..

    [Compose Text] softWrap 사용해 자동 줄바꿈 설정하기

    softWrap이란? softWrap이란 텍스트의 자동 줄바꿈을 설정하는 파라미터이다. Boolean 값으로 기본 값은 true이다. 따라서 기본 텍스트에서는 자동 줄바꿈이 실행된다. softWrap: Boolean = true softWrap true로 두어 자동 줄바꿈 설정하기 softWrap을 true로 두면 자동 줄바꿈이 실행된다. @Preview(showBackground = true, widthDp = 100, heightDp = 100) @Composable fun KotlinWorldTextSoftWrapTrue() { Column( modifier = Modifier .fillMaxSize() ) { Text( text = "Hello Kotlin", fontSize = 32.sp, so..

    [Compose Text] Text color 바꾸고 투명도 설정하기

    선행지식 [Android Compose Resource] Compose 의 Color 객체 살펴보기 Compose Text 색상 바꾸기 Text의 색상을 바꾸기 위해서는 Text의 color 프로퍼티를 사용한다. Color 객체 직접 생성해서 사용하기 Color은 직접 객체를 생성해서 사용할 수 있다. @Preview(showBackground = true, widthDp = 300, heightDp = 300) @Composable fun KotlinWorldText1() { Column(modifier = Modifier.fillMaxSize(), horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement...

    [Android Compose Lists] 2. Compose LazyColumn을 이용해 RecyclerView 만들기 + item, items, itemsIndexed사용법 정리

    LazyColumn이란? LazyColumn은 화면에 보여지는 컴포저블만을 표시하는 scrollable한 Column이다. LazyColumn은 화면에 보여지는 컴포저블만을 표시하기 때문에 화면 로딩 시간을 최적화 시킬 수 있어 많은 아이템이 표시되어야 할 경우 필수적으로 사용되어야 하는 레이아웃이다. LazyColumn의 item으로 사용할 컴포저블 정의 LazyColumn을 사용하기 위해서 먼저 LazyColumn의 item으로 사용할 컴포저블을 정의하자. Text를 Card로 감싼 간단한 컴포저블이다. @Composable fun KotlinWorldCard(order: Int) { Card( Modifier .padding(12.dp) .border(width = 4.dp, color = Colo..