angxxu.log

State State에 대해 더 자세히 알아보자. State는 Compose에서 굉장히 중요한 역할을 한다. State는 언제 활용할까? 화면에 나타나는 내용이 변경될 때 활용한다. setContent{ HomeScreen() } @Composable fun HomeScreen(){ Text("Hello World") } 다음과 같은 화면에서 “Hello World”값이 변한다면, State를 활용해야 한다. setContent{ HomeScreen() } @Composable fun HomeScreen(){ Column(){ Text("Hello World") Button(onClick = {}){ Text("클릭") } } } class MainViewModel: ViewModel(){ private..

Text와 Button을 세로로 정렬하여 UI를 구성했다. 버튼을 누르면 Text값이 바뀌는 화면을 만들어 볼 것이다. setContent { Column( modifier = Modifier.fillMaxSize(), verticalArrangement = Arrangement.Center, horizontalAlignment = Alignment.CenterHorizontally, ){ Text( "Hello", fontSize = 30.sp, ) Button(onClick={ }){ Text("변경") } } } 일반적인 방법 버튼을 눌렀을 때 Text의 값을 바꿔주려면 어떻게 해야 할지 생각을 해보면, “Hello”부분을 state로 만들어줘야한다. setContent { val data = re..

Navigation에 대해 알아보자! Navigation이란 화면 전환을 말한다. 우선 module수준의 build.gradle에 dependency를 추가해야한다. //Navigation implementation "androidx.navigation:navigation-compose:2.5.2" Navigation을 사용하려면, NavController를 얻어와야한다. NavController는 Navigation을 사용할때 핵심적인 역할을 하는 객체이다. 다음과 같이 화면을 3개 만든다. @Composable fun FirstScreen(){ } @Composable fun SecondScreen(){ } @Composable fun ThirdScreen(){ } 화면 내부를 구성하기에 앞서, Na..

by 키워드는 Delegate Pattern을 쉽게 구현하도록 도와주는 키워드이다. Delegate Pattern 어떤 기능을 자신이 수행하지 않고, 다른 객체가 수행하도록 하는 패턴이다. 다시 말해, 기능을 위임시키는 것이다. 상위 클래스의 요소를 사용할 때, 상속(Inheritance) 또는 구성(Composition)을 사용할 수 있다. 상속은 모든 요소를 물려받으므로 변수/메소드 등을 다시 구현할 필요가 없어 편리하지만, 객체의 유연성이 떨어진다는 치명적인 단점이 있다. 또한 상위 클래스가 변경되면 하위 클래스도 고쳐야 한다. Composition은 보다 유연성이 높다. Composition은 새 클래스 내부에 기존 클래스의 객체를 만들어 보다 직접적으로 접근하는 것이다. interface Ani..

TextField를 만들고, Button을 눌렀을 때 그 내용이 SnackBar로 나오도록 만들어보겠다. 우선, 다음과 같이 우리가 원하는 내용의 레이아웃을 만든다. setContent { Column( modifier = Modifier.fillMaxSize(), verticalArrangement = Arrangement.Center, horizontalAlignment = Alignment.CenterHorizontally, ) { //onValueChange = 값이 변했을떄 수행할 로직을 작성하는 함수 TextField( value = "", onValueChange = {}, ) Button(onClick={}){ Text("Click") } } } 하지만 이대로 실행하면 TextField에 ..

다음과 같은 레이아웃을 만들어보겠다. 뷰끼리 겹쳐지기 때문에 Box를 사용할 것이고, 귀퉁이를 둥글게 하고 그림자를 지정하기 위해 Card를 사용할 것이다.(CardView) Image는 paintResource를 사용해 그리고, contentDescription을 꼭 지정해주어야 한다. contentScale을 사용해서 Image의 Scale을 지정할 수 있다. @Composable fun ImageCard() { Card( modifier = Modifier .fillMaxWidth(0.5f) //전체의 절반 차지 .padding(16.dp), shape = RoundedCornerShape(8.dp), elevation = 5.dp, ) { Box( modifier = Modifier.height(..

Compose에서 리스트를 구현하는 방법은 두 가지가 있다. 첫 번째. Column을 이용한다. Column은 내부 내용을 한 번 출력하고 scroll을 붙여놓은 형태 LazyColumn에 비해 성능이 좋지 않다. setContent { val scrollState = rememberScrollState() Column( modifier = Modifier .background(color = Color.Blue) .fillMaxWidth() .verticalScroll(scrollState) ) { for (i in 1..50) { Text("글씨 $i") } } } rememberScrollState() : 스크롤 상태를 기억해주는 객체 두 번째. LazyColumn 이를 더 많이 사용한다. LazyC..

@Composable Empty Compose Activity를 생성하면 MainActivity에 다음과 같은 함수가 있다. @Composable fun Greeting(name: String){ Text(text = "Hello $name!") } 일반적인 함수의 형태와 좀 다르다! @Composable 어노테이션이 붙어있으며, 함수 이름이 대문자로 시작한다.(convention) 이렇게 만들어진 함수를 Compose라고 부른다. setContent{} 내부에는 Composable이 붙은 함수만이 들어올 수 있다. @Preview @Preview 어노테이션이 붙어있는 컴포저블은 옆에 Design탭에서 미리보기로 확인할 수 있는 컴포즈이다. 내용을 수정하면 미리보기가 바로 갱신되는 것을 확인할 수 있다...

JetPack Compose JetPack Compose는 안드로이드 앱의 UI를 쉽게 디자인하고 빌드하기 위한 라이브러리이다. Compose가 만들어진 목표는 다음과 같다. 맞춤 레이아웃을 쉽게 작성 고성능 발휘 📌 맞춤 레이아웃을 쉽게 작성 기존 안드로이드에서는 xml로 View를 그려주고, 코드상에서 setContentView나 inflate 메소드를 이용해 해당 View를 로드해야 했다. JetPack Compose를 이용하면 이전과 달리 Compose에서는 코드 상에서 UI에 대한 모든 관리를 하게 된다. 이로 인해 View가 작성되기 쉬워지게 된다. 물론 Binding Library를 사용하면 Parent View를 Binding해놓고 View를 찾는 과정 없이 바로 자식View에 대한 접근이..

이 에러는 Intent에 담긴 list의 직렬화를 해주지 않아서 일어나는 에러이다. 해결 방법 ArrayList 객체를 Intent로 전달하려면 데이터 클래스를 직렬화해야한다. 따라서, 사용하고 있는 데이터 클래스(나의 경우 SafetyInfo)에 Serializable 인터페이스를 아래와 같이 implements해준다. putExtra로 집어넣고, Intent finish_intent = new Intent(getApplicationContext(), MainActivity.class); finish_intent.putExtra("safety_info", mListQR); getExtra할 때, 다음과 같이 한다. ArrayListmListQR = (ArrayList)intent.getSerializa..