⛏️ | 개발 기록31 [Android, Kotlin] Firebase RTDB에서 데이터 순차적으로 삽입하기 (10) 이번 포스팅에서는 Firebase RTDB을 활용해 일정을 생성하는 기능을 만들어 보겠다. 드디어 일정을 생성하는 기능까지 왔다. 이번에 일정 생성 기능은 간단하게 만들어 보겠다. 일정 데이터는 schedule -> user uid -> 일정 리스트 순서대로 데이터를 저장할 것이고, 데이터 형태는 title, description, complete(완료 여부)로 저장하겠다. 위의 사진과 같은 형태로 저장을 할 것이고, 일정을 사용자가 여러 번 생성할 수 있기 때문에 기존 일정이 지워지지 않게 하면서 아래에 새로운 데이터를 넣는 방식으로 만들어볼까 한다. 대충 위와 같은 형태로 데이터가 저장되도록 하겠다. 설명은 끝났으니 바로 만들어 보겠다. 1. Firebase Database 라이브러리 추가 fireb.. 2023. 11. 12. [Android, Kotlin] Android 12 버전 이상에서 Compose로 Custom Splash Screen 생성하기 (9) 이번 포스팅에서는 지난 포스팅에서 언급했다시피, 한 번 로그인했으면 로그인 정보가 저장되어 여러 번 로그인을 하지 않아도 되는 자동 로그인 기능을 만들어 볼까 한다. 필자는 자동 로그인 기능을 만들기 위해서 Splash Screen을 활용하고자 한다. 간단하게 로직을 설명하자면, 앱 실행 후 Splash Screen이 나타남 Splash Screen이 켜져 있는 동안 Firebase 로그인 정보가 있는지 확인한다.( 로그인 정보는 State로 확인, 있으면 true, 없으면 false) State의 상태에 따라서 시작 Route를 설정한다.(true면 main route, false면 login route) 이렇게 간단하게 로직을 설계해 주었다. Android 12 버전부터는 Splash가 기본으로 생성.. 2023. 11. 10. [Android, Kotlin] Compose로 Firebase Google Login 구현하기 (8) 오랜만에 Planner V2 개발일지이다. 요즘 다른 활동(코테, 타 프로젝트)을 하느라 Planner V2를 잠시 놓았었는데 이제 다시 시작해볼까 한다. 이번에는 본격적인 기능 개발로 Firebase Google Login을 구현해 보도록 하겠다. 평범한(?) Planner에 구글 로그인을 넣은 이유는 로그인된 유저 정보를 이용해 일정들을 따로 Firebase Database에 저장하기 위해서이다. 그러면 바로 필자가 구글 로그인을 구현한 과정을 알아보자. 1. 라이브러리 추가하기 Firebase Auth 라이브러리를 추가해 주자. implementation("com.google.firebase:firebase-auth:22.2.0") implementation("com.google.android.gm.. 2023. 11. 9. [Android, Kotlin] Compose에서 동적 List 만들기 (7) 이번 포스팅에서는 Planner v2의 일정 생성 화면을 구현하면서 알게 되었던 지식들을 풀어볼까 한다. 마지막으로 ui를 구현할 화면은 일정 생성 화면이다. 일정 생성 화면은 plan screen의 점선으로 된 추가하기 card처럼 아무것도 없는 화면에 그 card를 눌러서 일정을 생성하고 일정 card를 클릭해서 일정을 수정할 수 있게 구현해 보겠다. 간단하게 UI를 구상해 보았다. text 부분에 일정 생성이라는 타이틀을 넣고 처음에는 아무것도 없는 화면에 점선으로 된 + card를 누르면 일정이 생성되고 일정을 클릭하면 일정의 정보를 수정할 수 있도록 구현하겠다. 1. 일정 Card 구현 우선은 일정 추가 card부터 만들어 보자. card의 border를 점선으로 설정하는 방법은 이전 포스팅에서.. 2023. 10. 24. [Android, Kotlin] Compose Lazycolumn의 scroll state 관리하기 (6) 이번에 Planner v2를 개발하면서 Plan(main) screen에서의 add schedule icon이 너무 사용자들에게 불편할 수도 있다는 느낌을 받았었다. 일정 header 부분에 + icon은 사용자들이 실제로 사용한다면 icon의 크기가 작아서 클릭이 힘들어 보일 것 같았다.(크기를 키우기에는 header 크기도 같이 커지기에 애매했다.) 그래서 기존의 icon을 LazyColumn의 맨 아래에 card로 만들어서 생성할 수 있도록 만들기로 했다. 그렇게 만들면 일정을 많이 생성하는 사용자들이 스크롤을 한참 해야 맨 아래로 도달해서 불편할 것 같았기에 따로 맨 아래, 맨 위로 스크롤 해주는 작은 button도 만들어 보기로 했다. 1. 자동 Scroll Button 만들기 button의 u.. 2023. 10. 21. [Android, Kotlin] Compose Vico 라이브러리로 ComposedChart 만들기 (5) 지난 포스팅에서 Compose Chart 라이브러리인 Vico 사용법과 Vico로 Column Chart 만드는 것까지 해보았다. 이번 포스팅에서는 지난 포스팅에서 언급했다시피, Vico에서 Composed Chart(혼합 차트)를 만들어 보도록 하겠다. 1. Composed Chart 만들기 Composed Chart는 혼합 차트를 뜻하는데, line chart와 column chart를 혼합해서 사용할 수 있다. 실제로 Vico wiki에서도 두 차트를 동시에 사용한 예제가 있었다. 하지만 필자는 Column Chart를 두 개를 이용해서 데이터를 표시하고 싶었기에, column 차트 2개를 사용했다. Vico 라이브러리에 대한 설명과 Column Chart 구현에 관한 자세한 설명이 필요하면 이전 .. 2023. 10. 20. [Android, Kotlin] Chart를 Compose로 구현하기 (4) 이전 포스팅에서는 compose에서 calendar를 만들어서 Plan Screen의 UI를 구현해 보았다. 이번 포스팅에서는 필자가 compose로 chart를 만들면서 생겼던 일을 설명해 줄까 한다. 3일 동안의 공백 기한 중 2일을 차트 구현에 썼다 >:( UI 설계는 어떻게 하였는가? 기존의 UI 설계는 차트가 있다는 것까지는 같지만 차트 위쪽에 dropdown menu를 만들어서 dropdown menu에 따라 chart의 형태(주간 통계 차트, 이번 주 통계 차트)가 변하게 만들려고 했다. 그림과는 다르게 현실에서는 아래의 공간이 많이 남았었다.(텍스트까지 만들었는데도) 그래서 UI를 약간 수정해서 주간 차트와 이번 주 차트를 스크롤해서 볼 수 있도록 구현하기로 했다. 그러면 UI 설계(?)를.. 2023. 10. 19. [Android, Kotlin] Compose에서 Calendar 사용하기, LazyColumn Data 구성하기 (3) 이전 포스팅에서는 Compose에서 Bottom navigation bar를 만드는 것으로 마무리 지었는데 이번 포스팅에서는 필자가 Plan Screen의 UI를 만들면서 있었던 일에 대해 설명해 보겠다. UI 설계는 어떻게 하였는가? UI 설계는 기존 Planner의 UI를 참고해서 만들었다. 위에는 달력을 달고 아래에는 선택된 날짜의 일정들을 보여주는 방식으로 구현해 보겠다. 1. 달력 만들기 UI를 구성하려면 먼저 달력을 만들어야 한다. 필자가 Compose에서 제공하는 달력이 있나 찾아보았지만 아직은 관련 달력 라이브러리가 제공되지는 않는 듯했다. 그런데 사용할 만한 라이브러리는 찾을 수 있었다. https://github.com/kizitonwose/Calendar GitHub - kiziton.. 2023. 10. 16. [Android, Kotlin] Compose Material3 Bottom Navigation의 Indicator 효과를 제거하기 (2) 죽은 프로젝트 살리기 2탄 이슈 해결기 지난 죽은 프로젝트 살리기 1탄에서는 v2 계획 후 데이터베이스 설계까지 완료하였다. 그래서 필자는 지난 포스팅을 올리고 난 뒤로 바로 Planner v2 개발을 시작하였다. 필자의 머릿속에는 bottom navigation을 활용해서 화면 2개를 메인으로(달력이 있는 화면, 통계 화면) navigation bar를 구성하는 작업을 하는 중 다음과 같은 UI적 불편함(?)이 있었다. 사진을 보면 클릭이 된 부분에 파랗게(?) 둥근 effect가 발생하고 있는 것을 볼 수 있다. 필자 기억으로는 material3에서 제공하는 기본적인 indicator라고 알고 있는데, 필자의 경우에는 저 effect를 삭제하고 싶었다. 저 effect를 indicator라고 한다. .. 2023. 10. 14. [Android, Kotlin] 죽은 프로젝트 살리기 위한 v2 계획 (1) 이번부터 필자의 기존에 개발을 완료했거나 개발 중단된 프로젝트를 살리는 개발 기록을 일기처럼 남겨볼까 한다. 이 시리즈를 작성하면서 내가 경험했던 죽은 프로젝트를 살려가는 과정을 글로 담아볼 예정이다. 첫 번째 프로젝트는 1년 전에 개발을 완료하고 버려진(?) Planner를 살려보는 프로젝트를 진행해 볼 것이다. 저의 개발 썰(?)로만 가득한 글입니다 ^^ 1. Planner란 무엇인가? 예전에 필자가 기획한 Planner는 당시 필자가 점점 게을러지기도 했고 이번에 프로젝트를 내가 사용할 수 있는 앱을 만들어보자! 해서 번뜩인 아이디어로 구상을 시작한 프로젝트이다. 이름에서도 알 수 있듯이 일정 관리 앱이다. 당시 필자는 다른 Planner 앱들과 차별성을 주기 위해 하루 일정을 기록하는 것을 넘어서.. 2023. 10. 10. 이전 1 2 다음 728x90 반응형
