본문 바로가기

PuzzleLeaf110

Flutter(플러터) 클럽하우스 Clubhouse 클론 앱 만들기 개요 요즘에 유행하는 클럽하우스 앱을 참고해서 Flutter로 UI 클론 앱을 만들어 봤습니다. View가 많아서 몇 개만 골라 봤습니다. 하단의 영상을 통해서 프로젝트 생성부터 완성까지 빠르게 만드는 것을 확인할 수 있습니다. Preview 스타일링을 위한 색상을 style 파일로 따로 관리하고 있습니다. 처음 접속 시 나타나는 Welcome Page 부분입니다. View에서 나눌 수 있는 부분들은 각각 Widget으로 분리해서 관리하고 있습니다. 국가 코드 선택 화면 구현을 위해서 country_code_picker를 사용했습니다. country_code_picker | Flutter Package A flutter package for showing a country code selector. In.. 2021. 3. 17.
Flutter(플러터) Python Flask 서버 만들어서 CartoonGAN 적용하기 개요 학습된 머신러닝 모델들을 찾을 수 있는 tfhub에서 cartoongan 모델을 발견하게 되었습니다. 이미지를 만화같은 스타일로 변환해주는 모델인데 재미있을 것 같아서 모델 파일을 다운로드 받고 플러터 프로젝트에 적용 해봤습니다. TensorFlow Hub tfhub.dev 그런데 실제 적용 했을 때 몇 가지 문제가 있었습니다. Flutter에는 공식적인 tflite 라이브러리가 없어서 서드파티 라이브러리를 사용하는데 실제 동작하지 않는 모델이 많이 있었습니다. 사용할 수 있는 모델인 경우에도 입력가능한 이미지 사이즈 크기 제한이 있어 이미지를 리사이징해서 사용하는데, 만화 스타일로 변화된 이미지도 똑같이 화질이 안좋아서 제대로 사용할 수 없는 상태였습니다. Google Colaboratory co.. 2021. 3. 16.
Flutter(플러터) 카카오뱅크 클론 앱 만들기 개요 Flutter를 공부하면서 이번에는 뭘 해볼까 하다가 자주 사용하던 카카오뱅크 앱이 생각이 났습니다. 깔끔하게 잘 만들어진 앱이라고 평소에 생각했었는데, 이번 기회에 참고하면서 UI Clone 앱을 만들어 보기로 했습니다. 소스 코드와 프로젝트 시작부터 끝까지 코딩하는 영상은 하단에 링크를 참고하시면 됩니다! (카카오뱅크 앱에서 언어를 영어로 변경할 수 있는 설정을 찾지 못해서 임의로 번역기 돌려서 만들어 봤습니다.) 구현 HomePage BottomNavigation을 포함하고 있고 다른 페이지에 접근할 수 있는 기본이 되는 페이지 flutter_bloc 패키지를 이용하여 HomeCubit을 만들었습니다. Cubit은 간단한 상태 관리를 위해 사용할 수 있으며 Bloc보다 간단하게 구현할 수 있습.. 2020. 10. 12.
플러터(Flutter) - Gradient Button 2020. 7. 11.