Flutter

    [플러터] 플러터 웹 채팅 예제 with Firebase

    [플러터] 플러터 웹 채팅 예제 with Firebase

    파이어베이스를 이용한 간단한 플러터 웹 채팅 예제 firechat pitterpark.github.io 플러터와 파이어베이스를 이용한 간단한 채팅이다. 말풍선이 생길 때마다 최초 채팅부터 마지막 채팅까지 모두 불러와 화면과 데이터를 갱신하므로 product로는 사용 불가능하니 예제로만 참고 바란다. 실제 Firebase로 채팅을 구현하는 경우에는 Realtime-database를 사용하고 색인을 사용해 한번에 읽어오는 데이터의 개수를 제한하여 속도와 비용을 줄여야한다. 해당 웹은 깃허브로 배포했다. 깃허브로 웹을 배포하는 방법은 아래 링크에 있다. [Flutter] 웹을 깃허브로 배포 및 호스팅 하기 플러터로 개발한 웹을 깃허브로 배포하여 깃허브 도메인으로 누구나 접근 가능하도록 하는 방법이다. 플러터 ..

    [Flutter Error] Cannot fit requested classes in a single dex file

    에러 및 이슈 flutter Cannot fit requested classes in a single dex file (# methods: 83481 > 65536) com.android.builder.dexing.DexArchiveMergerException: Error while merging dex archives: 해결 프로젝트에서 멀티 덱스를 지원하게끔 라이브러리를 추가해야한다. flutter의 project/app/build.gradle에 아래 내용을 추가한다. android { defaultConfig { ... multiDexEnabled true } ... } dependencies { compile 'com.android.support:multidex:1.0.3' } 1과 동일한 파일에..

    [플러터] bottom Navigation을 구현하는 3가지 방법

    [플러터] bottom Navigation을 구현하는 3가지 방법

    하단에 위치하는 네비게이션바를 구현하는 방법은 크게 3가지가 있다. 약간의 차이점이 있으니 필요에 따라 사용하면 되겠다. DefaultTabController 사용 return MaterialApp( title: 'chat used firebase', theme: ThemeData(primaryColor: Colors.white), home: DefaultTabController( length: 3, child: Scaffold( appBar: AppBar( title: Text('fire chat App'), ), body: TabBarView( children: [ Text('홈 스크린'), Text('채팅 스크린'), Text('마이 스크린'), ], ), bottomNavigationBar: Ta..

    [Flutter] 키보드 팝업 상태에서 뒤로가기 이벤트 처리

    [Flutter] 키보드 팝업 상태에서 뒤로가기 이벤트 처리

    앱에서 텍스트를 입력받을 때, 키보드가 하단에서 팝업된다. 뒤로가기 등으로 키보드가 내려갈 때를 감지해야한다면 해당 패키지를 사용하면 된다. 예를 들어 Textfield에 포커스가 되고 키보드가 팝업되며 특정 위젯이 바뀌었는데, 사용자가 뒤로가기로 키보드를 내리는 경우 특정 위젯을 되돌려놓아야하는 경우가 있겠다. keyboard_visibility | Flutter Package Flutter plugin for discovering the state of the soft-keyboard visibility on Android and iOS. pub.dev 코드 void initState(){ KeyboardVisibilityNotification().addNewListener( onHide : () {..

    [Flutter] 플러터 Web 개발하는 법

    [Flutter] 플러터 Web 개발하는 법

    21/11/27 수정된 글입니다. 플러터는 모바일 애플리케이션과 웹을 동시에 제작할 수 있게 고안된 프레임워크이다. 그리고 최근 2.0에서 리눅스, 맥, 윈도우와 같은 응용프로그램들도 개발 할 수 있게 업데이트 되었다. Flutter Gallery gallery.flutter.dev 플러터로 만들어진 샘플 웹 사이트이다. 나름대로 웹 사이트의 구색을 갖추고 있지만, 웹 사이트 크기를 늘리고 줄여보면 여지없이 성능이 떨어지는게 느껴진다. 필자는 최근 React를 경험하며 간단한 프로덕트들을 개발했고, 결론적으로 플러터 웹은 갈길이 상당히 멀다는걸 느꼈다. 아래는 React와 플러터 웹을 경험하며 느낀점을 간단하게 QA로 정리한 글이다. [플러터] 플러터 웹에 대한 Q&A 모음 Flutter web에 관한 ..