만들면서 배워가는 프로그래머

이번 시간에는 버튼을 눌러 숫자 카운트 하는 방법을 알아보겠습니다. 목차 1. 실행 화면 2. 카운트 기능 함수 3. 레이아웃 함수 4. 전체 코드 1. 실행 화면 2. 카운트 기능 함수 - 설명 1. remember - Compose의 상태 보존 함수 - 화면이 다시 그려져도 상태를 유지하고 일관성 있는 동작을 보장 2. mutableStateOf(값) - Compose에서 가변 상태를 생성하는 함수 - Compose가 상태를 추적하고 상태 변경 시 UI를 업데이트 @Composable fun CounterComponent(){ var count by remember { mutableStateOf(0) } Button(onClick = { count++ }) { Text(text = "숫자 증가") }..

안드로이드 2023. 6. 26. 14:12

이번 시간에는 텍스트뷰 커스텀 하는 방법을 알아보겠습니다. 목차 1. 실행 화면 2. 텍스트 스타일링 3. 텍스트 정렬 4. 텍스트뷰 가로, 세로 5. 텍스트 글자 간격 6. 텍스트 줄 간격 7. 텍스트 최대 줄 개수 1. 실행 화면 2. 텍스트 스타일링 1. 설명 color: 텍스트 색상 fontSize: 텍스트 크기 fontWeight: 텍스트 굵기 background: 배경 색상 Text( text = "텍스트 스타일링", style = TextStyle( color = Color.Red, fontSize = 20.sp, fontWeight = FontWeight.Bold ), modifier = Modifier.background(Color.Black) ) 3. 텍스트 정렬 - 설명 textAli..

안드로이드 2023. 6. 19. 20:33

이번 시간에는 클릭 이벤트(Click Event) 설정과 메시지(Toast) 알림 설정하는 방법을 알아보겠습니다. 목차 1. 실행 화면 2. 메시지 함수 3. 버튼 클릭 컴포저블 4. 이미지 클릭 컴포저블 5. 텍스트 클릭 컴포저블 6. 박스 클릭 컴포저블 7. 전체 코드 1. 실행 화면 2. 메시지 함수 - 설명 1. context: Context 정보 2. message: 메시지 내용 3. Toast.LENGTH_SHORT: 메시지 지속 시간 fun customToast(context:Context, message: String){ Toast.makeText(context, message, Toast.LENGTH_SHORT).show() } 3. 버튼 클릭 컴포저블 - 설명 1. LocalContex..

안드로이드 2023. 6. 12. 14:48

이번 시간에는 박스(Box)를 통해 모양(shape) 변경과 외곽선(shape) 주는 방법을 알아보겠습니다. 목차 1. 미리 보기 2. 박스 함수 3. 모양 변경(shape) 4. 외곽선 설정(border) 5. 전체 코드 1. 미리 보기 2. 박스 함수 - 설명 1. size: 가로, 세로 크기 150 2. background: 색상과 모양 설정 @Composable fun ShapeCompose(shape: Shape){ Box(modifier = Modifier .size(150.dp) .background(Color.Red, shape) ) } 3. 모양 변경(shape) - 설명 1. RectangleShape : 네모 2. CircleShape : 동그라미 3. RoundedCornerShap..

안드로이드 2023. 6. 5. 13:28

이번 시간에는 Modifier(수정자)를 사용해서 컴포저블 크기, 간격, 가중치 설정하는 방법을 알아보겠습니다. 목차 1. 크기 2. 간격 3. 가중치 1. 크기 1-1 너비, 높이 최대 - fillMaxSize(): 너비, 높이 최대 설정 Box(modifier = Modifier.fillMaxSize()){ Box(modifier = Modifier .background(Color.Green) .fillMaxSize() ) } 1-2 너비 최대, 높이 사용자 정의 - fillMaxWidth: 너비 최대 - height: 높이 설정 Box(modifier = Modifier.fillMaxSize()){ Box(modifier = Modifier .background(Color.Green) .fillMa..

안드로이드 2023. 5. 29. 15:23

안녕하세요. 이번 시간에는 LazyColumn를 통해서 정보를 리스트로 보여주는 방법에 대하여 알아보겠습니다. RecyclerView를 사용했던 xml 방식보다 훨씬 쉽게 구현할 수 있다는 사실을 알 수 있습니다. 목차 1. 실행 화면 2. 데이터 클래스 3. UserView 함수 4. SimpleListView 함수 5. 전체 코드 1. 실행 화면 2. 데이터 클래스 - 설명 1. name : 사용자 이름 2. age: 사용자 나이 data class Users( val name: String, val age: String ) 3. UserView 함수 - 설명 1. padding(8.dp) : 외부와 간격 2. fillMaxWidth() : 가로 크기 최대 3. elevation : 음영 정도 4. ..

안드로이드 2023. 5. 22. 19:52

이번 시간에는 요소들을 겹치게 하는 Box에 대하여 알아보겠습니다. 목차 1. 샘플 박스 만들기 2. 미리 보기 3. Column 사용 방법 1. 샘플 박스 만들기 - 설명 - DummyBox(color: Color, dp: Dp) 색상과 크기를 매개변수로 전달받는다. @Composable fun DummyBox(color: Color, dp: Dp){ Box(modifier = Modifier .background(color) .size(dp) ) } 2. 미리 보기 - 설명 - background(색상) 배경색상 설정 - fillMaxSize() 전체 화면 꽉 차게 설정 @Preview(showBackground = true) @Composable fun DefaultPreview() { Compos..

안드로이드 2023. 5. 15. 10:25

안녕하세요. 이번 시간에는 컴포넌트들을 세로 정렬하는 Column에 대하여 알아보겠습니다. 목차 1. 샘플 박스 만들기 2. 미리 보기 3. Column 사용 방법 1. 샘플 박스 만들기 - 설명 - background 배경색상 설정 - size(80.dp) 가로, 세로 길이 80으로 설정 @Composable fun DummyBox(color: Color){ Box(modifier = Modifier .background(color) .size(80.dp) ) } 2. 미리 보기 - 설명 - background(색상) 배경색상 설정 - fillMaxSize() 전체 화면 꽉 차게 설정 @Preview(showBackground = true) @Composable fun DefaultPreview() {..

안드로이드 2023. 5. 8. 15:24