목록프로젝트/애미티 (13)

이코노딩

[Flutter Project] Scroll Navigation Package

https://pub.dev/packages/scroll_navigation scroll_navigation | Flutter Package It's a powerful navigation by gestures and taps. You can scroll from left to right or tap on the navigation icons. pub.dev ✅ 패키지 소개 앞서 제작해 보았던 PageView를 이용한 UI와 비슷한 동작을 하는 패키지가 있어 사용해보았다. 참조 ☑️Install dependencies: scroll_navigation: ^1.3.2 ✅패키지 사용 패키지 설명을 읽어보면 Icon 혹은 Title(Text) 중 사용이 가능했다. 난 게임의 제목을 이용해서 만들기 위해 Tit..
프로젝트/애미티 2023. 3. 15. 16:57
[Flutter Project] 애미티앱 GetX 적용하기 - 초성게임

😶 초성게임 Setting - UI 구성에 들어갈 위젯 1️⃣벌칙모드 On/Off를 위한 스위치 2️⃣커스텀모드 On/Off를 위한 스위치 3️⃣초성게임을 표시할 이미지 4️⃣플레이어 수 선택 드롭다운 5️⃣플레이어 상세설정 창 6️⃣타이머 선택 드롭다운 7️⃣초성타입 선택 드롭다운 8️⃣게임 시작 버튼 ☑️Code - WordGameSetting() class WordGameSetting extends StatelessWidget { const WordGameSetting({Key? key}) : super(key: key); @override Widget build(BuildContext context) { return CustomScrollView( slivers: [ SliverToBoxAdapt..
프로젝트/애미티 2023. 3. 7. 17:32
[Flutter Project] 애미티 앱 Getx 적용하기 - Custom

😶기존의 Drawer와 DropDown 기능을 Custom하기 힘들어 원하는 디자인을 직접 구현해보기로 하였다. 라이브러리를 가져와 쓰려고 했다가, 간단하게 만들 수 있을 것 같아서 그대로 사용하기로했다. ✅CustomDrawer 기존 앱들에서 좌측에 숨겨져있다가 어떠한 액션 이벤트에 반응하여 나오는 서랍 느낌이다. 버튼을 눌렀을 나오는 더보기 버튼 처럼 만들었다. ☑️동작 구상 동작은 간단하게 버튼을 눌렀을 때, 페이지를 이동하는데 애니메이션을 주고 또 이동 옵션 중, opaque를 false로 주어서 이전 화면이 그대로 유지 될 수 있도록하였다. 그리고 Drawer페이지에서는 Stack과 Position위젯으로 위치를 조정해 주었다. ☑️라우팅 코드 페이지 이동시 애니메이션은 fade가 가장 자연스러..
프로젝트/애미티 2023. 2. 4. 17:26
[Flutter Project]애미티 앱 GetX 적용하기 - UI 구상

✅UI 구상하기 ☑️ Class - Home() : 필요한 위젯 ✔️ Home은 안에 PageView Widget과 Page 이동을 시각적으로 보여주는 Widget ✔️ Drawer를 꺼낼 수 있는 Button ✔️ 애니메이션을 라이브러리 위젯 DelayedWidget: https://pub.dev/packages/delayed_widget ☑️Class - Home() : Code ✔️ StatelessWidget에서 화면 구상, GetxController로 상태관리 class Home extends StatelessWidget { Home({Key? key}) : super(key: key); final controller = Get.put(HomeController()); ✔️ 가장 상단(AppBa..
프로젝트/애미티 2023. 2. 2. 20:47
[Flutter] Amity앱에 GetX 적용해보기

✅ 개요: 처음 Dart/Flutter 공부를 시작하면서 만들어 보았던 Amity앱에 여러 기능들을 추가와 GetX를 적용해서 만들어보자. https://iconoding.tistory.com/22 Flutter Project : 오프라인 게임 지원 앱 만들어보기 ▶ 프로젝트 생성 적당히 새 Flutter 프로젝트 하나 생성해주고 시작 먼저 필요한 이미지들을 프로젝트 폴더 내에 assets/image 폴더를 만들어 넣어줌 넣어 주고 이미지를 사용하기 위해 pubspec.yaml 파 iconoding.tistory.com ✅ 목표 ✔️ 심플하면서 깔끔한 디자인으로 UI 개편 ✔️ 기존에 넣지 않았던 스플레쉬 스크린, 게임 진행간 효과음, 앱 아이콘 등 적용 ✔️ GetX를 통한 상태관리 ✔️ 새로운 게임 ..
프로젝트/애미티 2023. 1. 30. 19:20
이전 Prev 1 2 Next 다음