개발 기록

Tabbar 위젯 기본 코드 import 'package:flutter/material.dart'; /// Flutter code sample for [TabBar]. void main() => runApp(const TabBarApp()); class TabBarApp extends StatelessWidget { const TabBarApp({super.key}); @override Widget build(BuildContext context) { return MaterialApp( theme: ThemeData(useMaterial3: true), home: const TabBarExample(), ); } } class TabBarExample extends StatelessWidget { con..

flutter에서 좌측에 고정된 사이드바를 구현하였다. 일반 모바일폰이 아닌 태블릿이나 웹에서 사용하기 용이하다. 모바일폰에서는 sidebar 보다는 drawer을 많이 사용하는 것 같다. 패키지 설치 flutter pub add sidebarx 전체 예제 코드 공식 문서에 있는 example이다. 주석에도 간단하게 설명되어있지만 아래에서 주요 파라미터만 뽑아서 다시 정리하였다. import 'package:flutter/material.dart'; import 'package:sidebarx/sidebarx.dart'; void main() { runApp(NavHome()); } class NavHome extends StatelessWidget { NavHome({Key? key}) : super(..

'Future'과 'FutureBuilder'은 Flutter에서 비동기 작업을 수행하고, 결과를 UI로 표시하는데 사용되는 개념이다. 먼저 동기와 비동기의 차이에 대해 알아보면, 동기는 서버에 요청을 보냈을 때 응답이 돌아와야 다음 동작을 수행하는 것이고, 비동기는 요청을 보냈을 때 응답이 돌아오는지 여부에 상관없이 다음 동작을 동시에 수행 하는 것이다. 그럼 개발 중에 동기와 비동기는 왜 중요할까 ? 예를들어, 서버로부터 대용량의 데이터를 받아와서 화면에 출력해주는 것을 구현한다고 해보자. Flutter는 기본적으로 동기적인 방식으로 작동하므로, 대용량 데이터를 받아올 때 다른 작업은 중지될 것이다. 그러므로 데이터를 다 받아오기 전까지 사용자 화면에 아무것도 표시되지 않는다. 하지만 비동기 방식을 ..

tflite_flutter 패키지를 이용하여 Flutter 앱에 인공지능을 결합시키는 방법 tflite_flutter이 생기기 이전에는 tflite라는 패키지를 사용하였었다. 하지만 Flutter 버전이 업데이트되면서 tflite 패키지는 사용하지 못하도록 되었고, tflite_flutter 패키지가 나왔다. 나온 지 얼마 안된 패키지인 만큼 자료도 너무 없어 사용하기 힘들었다. 사용하는 flutter 버전을 flutter 2.2.3 으로 낮추면 기존의 tflite를 사용할 수 있지만, 다른 JDK버전에서 오류가 많이 나오고 다른 모든 연결된 것들을 저 버전에 맞추어야되서 번거로울 것 같았다. 그래서 tflite_flutter을 사용하였다. https://pub.dev/packages/tflite_flu..

플러터(Flutter) 설치 플러터(Flutter) 설치 및 환경변수 설정 방법 입니다. 먼저 설치를 위해 플러터 홈페이지로 이동합니다. https://flutter.dev/ Flutter - Build apps for any screen Flutter transforms the entire app development process. Build, test, and deploy beautiful mobile, web, desktop, and embedded apps from a single codebase. flutter.dev 들어가서 우측 하단을 보면 Get Started 버튼을 클릭합니다. 이후 Windows 기준으로 Windows 버튼을 누릅니다, 그리고 위 사진과같이 파란색 zip파일을 다운로드..