플러터 35

2022 GDSC Solution Challenge

2022 Solution Challenge | Google Developers Solve for one or more of the United Nations 17 Sustainable Development Goals using Google technology. developers.google.com comaplain은 complain(불평, 항의)과 map(지도)의 합성어로, 사용자들의 신고를 지도에 표시해주는 데에서 착안 시설 결함, 치안, 산사태 등 사용자들이 미리 인지하고 있으면 유용할 주위 결함들을 신고 받고, 이를 바탕으로 지도를 제작하는 프로젝트 Google Map에만 표시하는 것뿐만이 아닌 네트워크 맵을 임의로 제작하여 많은 정보들을 한눈에 미리 확인할 수 있도록 목표 초기 디자인의 경우 L..

[Flutter] 플러터 Hero 애니메이션 구현

이번에는 Hero 애니메이션에 대해 알아보자. Hero 애니메이션은 tag로 연결된 image를 다른 화면에 띄어주는 위젯이다. 이미지를 확대하여 보거나 특정한 위젯을 따로 보고 싶을 때 사용하면 유용할 것 같다. 코드 import 'package:flutter/material.dart'; class HeroScreen extends StatefulWidget { const HeroScreen({Key? key}) : super(key: key); @override _HeroScreenState createState() => _HeroScreenState(); } class _HeroScreenState extends State { @override Widget build(BuildContext cont..

Develop/Flutter 2022.02.20

[Flutter] 플러터 AnimatedBuilder 애니메이션 구현

이번에는 AnimatedBuilder 애니메이션을 구현해보자. 코드 import 'package:flutter/material.dart'; import 'dart:math' as math; class AnimatedBuilderScreen extends StatefulWidget { const AnimatedBuilderScreen({Key? key}) : super(key: key); @override _AnimatedBuilderScreenState createState() => _AnimatedBuilderScreenState(); } // TickerProviderStateMixin은 매 프레임마다 함수를 호출하는 객체인데 // 프레임이 변화되어야 할 때 알려주는 거라고 한다. class _Ani..

Develop/Flutter 2022.02.20

[Flutter] 플러터 Slivers 애니메이션 구현

이번에는 Slivers 애니메이션 효과에 대해서 알아보도록 하자. Slivers는 화면 헤더를 동적으로 표현하고 헤더를 위로 스크롤했을 때, 헤더 하단 부분이 나오는 애니메이션이다. 당근 마켓, 번개장터 등 게시물이 있는 UI를 생각하면 이해하기 쉬울 것 같다. 코드를 작성하기 전에 간단하게 알아보면 CustomScrollView를 통해 body를 감싸게 된다. 그냥 Sliver를 사용하기 위한 ScrollView라고 생각하면 좋을 것 같다. CustomScrollView 안에는 SliverAppBar와 다양한 Sliver 위젯이 들어간다. SliverAppBar는 헤더 부분이 되고 Sliver 위젯은 헤더 하단 부분이 된다. 그럼 코드를 작성하면서 구현해보자. 코드 import 'package:flut..

Develop/Flutter 2022.02.20

2022 GDSC KR Winter Hack

22 Winter Hackaton 22 Winter Hackaton은 GDSC Korea 멤버들의 네트워킹 및 실력 성장을 목표로 하며, 개발 목적 외에도 다양한 개발자 네트워킹 행사가 마련되어 있습니다. 각 학교에서 꾸려진 GDSC가 Korea 라는 하나의 공통 gdsckoreahackathon2022.github.io 2022 GDSC KR Winter Hack : Play Your Stay Google Developer Student Clubs Korea에서 지역∙사회 문제 해결을 위한 온라인 무박 2일 해커톤을 주최합니다. COVID-19 및 변이 바이러스로 아직까지도 생활 속 거리두기를 지속하고 있는 요즘 우리. 이제는 코로나 팬데믹에서 벗어나 조금 더 자연스럽고 편안하게, 우리들의 온라인 해커..

2022 GDSC Flutter & ML Toy Project

GDSC SCH에서 한 학기 동안 Flutter Study 멘토링을 진행하면서 기본적인 Flutter 메커니즘, Flutter에서 UI를 그리는 법, dart 문법, 비동기, api 사용 등을 수업했다. 그동안 배운 Flutter 학습을 토대로 개발 실력을 뽐낼 수 있게 본격적인 프로젝트를 진행시키기로 했다. Toy Project는 Flutter 멘티분들과 ML 멘티분들의 협동 프로젝트로 진행했고 목표는 ML 기술을 포함시킨 Flutter 앱을 개발하는 것이었다. 예시 작품을 보여주기 위해 내가 포함한 Flutter Core Member분들과 ML Core Member분들과 함께 1주일 동안 간단한 Toy Project를 진행했다. 주제를 정하기 위해 노션을 통해 회의를 진행했고 주제는 분리수거 가이드 ..

[Flutter] 플러터 Firebase(파이어베이스) 연동

이번에는 Flutter와 Firebase를 연동해보려고 한다. 연동하기 전에 Firebase에 대해서 간단하게 알아보자. FIrebase란? Firebase는 백엔드 서비스라고 생각하면 이해하기 쉬울 것이라고 생각하고 flutter와 쉽고 간편하게 연동되며 여러 가지 기능을 제공하고 있다. 우선 간단히 빌드를 살펴보면 6개의 기능을 제공하고 있다. Authentication 서버 기반의 서비스를 제공하는 앱이라면 사용자의 가입과 로그인 기능이 필수인데, Firebase에서는 이 기능을 제공하고 있어서 직접 구현할 필요가 없다. google, facebook, twitter, github와 제휴되어서 각각의 계정으로 로그인 인증을 제공한다. kakao와 naver도 가능하다고 알고 있다. Database(..

Develop/Flutter 2022.01.27

[Flutter] 플러터 tflite(TensorFlow Lite)를 활용한 이미지 분류

이전에 image_picker 패키지를 통해 카메라를 구현해보았다. [Flutter] 플러터 image_picker 패키지를 통해 카메라 구현 이번에는 Flutter에서 카메라를 구현해보려고 했다. 카메라 구현을 위해 여러 패키지를 알아보았지만 UI 커스터마이징은 불가능한 것으로 보였고 다른 분들에 오픈 소스 코드도 확인해보았지만 fre2-dom.tistory.com 이번에는 이전에 만든 image_picker 패키지를 가지고 tflite를 활용하여 이미지 분류를 하는 앱을 만들어보려고 한다. tflite(TensorFlow Lite) tflite를 알기 위해서는 우선 TensorFlow부터 알아야 한다. TensorFlow는 인간이 사용하는 학습 및 추론과 유사한 패턴과 상관관계를 감지하고 해독할 수 ..

Develop/Flutter 2022.01.18

[Flutter] 플러터 image_picker 패키지를 통해 카메라 구현

이번에는 Flutter에서 카메라를 구현해보려고 했다. 카메라 구현을 위해 여러 패키지를 알아보았지만 UI 커스터마이징은 불가능한 것으로 보였고 다른 분들에 오픈 소스 코드도 확인해보았지만 앱을 재실행 시 카메라 구현이 안 되는 버그가 있어 보였다. 그중에서 image_picker 패키지는 다른 패키지보다 비교적 구현이 쉬웠고 버그도 없는 것으로 판단되어 image_picker 패키지를 통해 카메라를 구현해보려고 한다. 라이브러리 image_picker | Flutter Package Flutter plugin for selecting images from the Android and iOS image library, and taking new pictures with the camera. pub.dev..

Develop/Flutter 2022.01.16