Loading...
2024. 5. 30. 12:09

[Compose Study] Scaffold

* Compose에서 SnackBar, Topbar, FloatingActionButton 등을 사용하려면 Scffold로 감싸주고 사용을 해야한다. * 아래는 Button을 눌렀을 때 SnackBar를 띄우는 코드이다. (키보드도 숨김) showSnackbar는 suspend 함수로   되어있어서 coroutine을 사용해야 한다. 코루틴을 사용하려면 위에 remeberCoroutineScope()를 선언해주면 된다. * 마지막으로 TextField와 Button 사이의 마진을 24dp로 주고싶을 땐 Spacer를 사용한다.Spacer(modifier = Modifier.height(24.dp)) * 실행결과

2024. 5. 28. 21:03

[Compose Study] 구조분해

* 단순히 TextField를 띄우고 글을 입력하고, 아래 버튼을 띄우는 코드이다. * 여기서 textValue = remember { mutableStateOf("") } 쪽을 구조분해를 사용해 볼 예정이다.   textValue를 MutableState으로 선언하고 MutableState 내부 코드로 들어가보면 아래와 같은   interface라는 것을 알 수 있다. value와 component1, component2. * 따라서 textValue를 아래와 같이 text, setValue로 분해할 수 있다. text는 String 형태,   setValue는 (String) -> Unit 형태이다. * 그러므로 아래쪽 TextField에 value = text, onValueChange에는 setV..

2024. 5. 28. 12:07

[Compose Study] Card, Image 3

* 우리가 ImageCard를 Composable로 빼놓은 이유는 ImageCard를 재사용하고 싶은 이유도 있다. 하지만 현재 저장해 놓은 상태는   재사용이 불가능한 구조이다. 상태를 저장하는 값이 외부에서 지정이 되는 형태로 되야지만 재사용이 가능해진다. * 따라서, 상태를 저장하는 부분을 MainActivity쪽으로 뺀 다음 ImageCard에 isFavorite를 변수로 받게 수정했다. * 이렇게 되면 ImageCard에 들어오는 isFavorite은 이제 변수가 아닌 상수가 되어버린다. 따라서 ImageCard 아래에 상태를 변경하는   부분 코드는 쓸 수가 없다. * 따라서, Callback 함수를 만들고 클릭이 발생하면 현재 favorite 반대값을 넣어줘서 return 해준다.* 마지막에..

2024. 5. 28. 00:09

[Compose Study] Card, Image 2 - 상태 저장

* Image 오른쪽 위에 하트를 누를 때마다 하트이미지가 바뀌는 상태를 저장해야 한다.* 기존 kotlin에서는 상태저장 변수(boolean 등)을 만들어 저장했지만, compose에서는 상태를 기억하는 방법에는 remeber를 사용하는 방법이 있다. remeber를 사용하고 mutableState로 변수를 선언해주면 된다. (기본값: false)val isFavorite = remember { mutableStateOf(false) }* 타입을 보면 MutableState타입으로 되어있다. isFavorite안에 boolean 값이 저장되는 그 상태를 remeber가 기억해주는 형태이다.  state가 변경되면 UI가 다시 그려지게 된다. * 하트 아이콘을 눌렀을 때 value가 바..

2024. 5. 27. 22:26

[Compose Study] Card, Image

* 이번 시간엔 Card와 Image에 대해 정리할 예정이다.Card는 Cardview와 비슷하고 Image는 ImageView와 비슷하다.* Card에 RoundedCornerShape로 모서리를 둥글게 하고 elevation으로 그림자 효과를 줄 수 있다. * Image를 사용하는 방법은 여러 가지가 있는데 painter를 사용해 보았다. painterResource에 기존의 사진 경로를 넣어주고contentDescription으로 이미지 설명을 적어준다.@Composablefun Image( painter: Painter, contentDescription: String?, modifier: Modifier = Modifier, alignment: Alignment = Alig..

2024. 5. 27. 00:06

[Compose Study] Box

* compose에는 layout.xml이 없고 그냥 mainActivity에서 다 짜는 것 같다(Flutter와 유사한듯?)* 이번 시간엔 Box에 대해 간단하게 정리해보고자 한다. * Box는 기존의 layout처럼 Text등의 요소를 감싸는 박스같은 역할을 한다. * Box( ) { }에서 ( )안에 modifier, contentAlignment등이 들어갈 수 있다.* Modifier에는 background색깔 설정, fillMaxSize(화면 전체크기 차지), padding 등을 설정할 수 있고 위와 같이 .을 계속 찍어 chaining처럼 쭉 설정해주면 된다.* { } 안에는 박스 안에 들어갈 요소들을 설정할 수 있는데, 안에 또 Box같은 요소를 넣을 수 있다.* 참고로 여기선 16dp와 같..

2024. 5. 26. 23:18

[Compose Study] - 컴포즈 프로젝트

처음 compose 프로젝트를 만들면 다음과 같은 구조로 나온다.* UI.theme에 color, theme, Type(텍스트 스타일) 등이 정의되어있고 mainActivity는 다음과 같다.* 특이하게 @Composable이 붙은 함수는 소문자가 아닌 대문자로 함수명이 시작된다. onCreate안의 setContent{ } 안에 들어오는 내용이 composable한 애들이다. * Preview가 붙어있는 부분은 오른쪽 split에 화면이 표시가 된다.

2024. 3. 21. 00:03

[Android Study] 다이얼로그 - 알림 채널, 알림 객체

* 상태 바에 앱의 정보를 출력하는 것을 알림(notification)이라고 한다. - API 33 버전부터는 앱에서 알림을 띄우기 위해 사용자에게 퍼미션을 요청해야 한다. - 원래 상태 바는 시스템에서 관리하는 곳이며 앱이 직접 제어할 수 없다. 그런데 앱에서 시스템에 의뢰하면 시스템에서 관리하는 상태 바에 앱의 알림을 출력할 수 있다. 따라서 앱의 화면을 구성하거나 사용자 이벤트를 처리하는 프로그래밍과는 구조가 다르며 알림을 위해 제공하는 API를 이용해야 한다. - 알림은 NotificationManager의 notify() 함수로 발생한다. notify() 함수에는 NotificationCompat.Builder가 만들어 주는 Notification 객체를 대입하며 이 객체에는 알림 정보가 저장된..