dart/Flutter

0. 들어가며 https://www.youtube.com/watch?v=FAi7mTyKW60&list=PLQt_pzi-LLfo1sKDaFN1SOuDVP85OwK4M 역시 따라하면서 배우는게 최고다.. 1. Onboarding screen?? Onboarding이라는 뜻 자체가 처음 합류하기 위해 적응하는 과정을 의미한다. 아래 예시처럼 맨 처음 앱을 실행했을 때 요약해서 설명해주는 창을 많이 봤을텐데 그걸 Onboarding screen이라고 한다. 2. 여기서 배운 것들 introduction_screen 3.0.2 패키지 페이지간의 이동 3. 설명 Onboarding screen은 하드코딩할 수 있지만 쉽게 하기 위해 아래 패키지를 사용한다. https://pub.dev/packages/introdu..

이제 데스크탑앱을 만들면서 내 UI에 적용을 해보려고 한다. 적용하면서 이런 부분은 이렇구나 하는 부분을 적어보려고 한다. (이제 Flutter를 시작해서 상당히 비효율적인 코드와 틀린 부분이 있을 수 있으니 많은 피드백 부탁드립니다!) 1. AppWindow와 SystemTray AppWindow객체와 SystemTray 객체가 필요하다. AppWindow는 현재 만들어진 가장 최상위 Window를 의미하고 SystemTray는 tray에 넣기 위한 객체이다. final AppWindow _appWindow = AppWindow(); final SystemTray _systemTray = SystemTray(); 2. Future Dart에서 Future는 미래에 어떤 값을 받아야한다면 받는 클래스다...

vscode에서 방금 따끈따끈하게 flutter create로 프로젝트를 만들었는데 뜬금없이 material.dart를 못 찾는다고 나온다. 검색해보니 간혹 이런일이 있나 보다. 터미널에서 다음 명령어를 입력하자. flutter packages get 나 같은 경우는 바로 적용이 되었는데 안된다면 vscode를 재시작해보자.

데스크탑앱을 Flutter로 하나 만들고 싶어져서 이것저것 보고 있는데 System tray에 넣는걸 먼저 어떻게 넣나 좀 보려고 했다. 내가 사용한건 system_tray 패키지다. https://pub.dev/packages/system_tray system_tray | Flutter Package system_tray that makes it easy to customize tray and work with your Flutter desktop app. pub.dev 좋은 세상.. 그대로 넣고 돌리면 되는 코드가 존재했다. 물론 빨간줄이 잔뜩 나온다. 필요한 패키지를 설치하지 않았기 때문이다. vscode기준으로 저기 빨간줄 난 패키지 위에 마우스를 가져다 대면 quick fix 메뉴가 나오는데 거..

저번 글에 이어서 정리를 시작합니다. Nesting rows and columns layout 프레임워크는 row와 column이 사용자가 원하는 만큽 중첩해서 사용할 수 있습니다. 이 이미지에서 저기 빨간색 박스를 친 부분은 2개의 row로 구현되어있습니다. 아래 UI Tree를 확인하시죠. ratings(평점) 변수 부분은 5개의 작은 별 아이콘으로 구성되어 있습니다. var stars = Row( mainAxisSize: MainAxisSize.min, children: [ Icon(Icons.star, color: Colors.green[500]), Icon(Icons.star, color: Colors.green[500]), Icon(Icons.star, color: Colors.green[50..

Flutter를 시작하는데 UI, Widget이 이해가 잘 가지 않아 codelab의 내용을 계속 보고 있다. https://docs.flutter.dev/development/ui/layout Layouts in Flutter Learn how Flutter's layout mechanism works and how to build a layout. docs.flutter.dev 한글로 된 문서는 없는데 최대한 정리를 해보려고 한다. 정리하다 보니 생각보다 이해가 가기 시작했다. (한글화 프로젝트 환영입니다!) 중요 포인트 Widget은 UI를 구성하는 클래스다. Widget은 layout과 UI element에 사용된다. Compose simple widget은 유연한 widget을 만들기 위해 사용..

뭔가 갑자기 Flutter를 해보고 싶어서 tutorial을 따라 해 봤는데 구조를 이해 못하겠습니다. 그래도 뭔가는 남기고 싶어서 간단하게 글을 적습니다. 1. 설치 flutter-ko.dev/docs/get-started/install/windows 윈도우에서 설치 flutter-ko.dev document에서 알려주는대로 진행하면 되는데 우선 flutter sdk를 다운로드하고 환경변수를 잡아줍니다. 환경변수 path에 들어가는 경로 PATH/TO/flutter/bin (참고로 저는 android나 ios가 아닌 chrome에서 모든 tutorial app을 실행했습니다.) 이후 설치가 잘 되었는지 확인하기 위해 콘솔에서 명령어를 실행합니다. flutter doctor 근데 이 와중에 에러는 안나오..