FrameWorks/Flutter5

• 

  3. Stateful Widgets State Stateful WidgetStateless Widget ← 데이터 없이 단순히 UI만 만듬위젯에 데이터를 저장하고 싶을 때 사용실시간으로 데이터의 변화를 보고 싶을 때 사용StatelessWidget을 StatefulWidget으로 변경할 수 있음 Stateful Widget의 종류데이터가 없는 위젯데이터가 있는 위젯데이터에 따라 UI가 변경될 수도 있음 import 'package:flutter/material.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatefulWidget { const MyApp({super.key}); @override State createState() => _MyAppState(); }.. FrameWorks/Flutter 2023. 4. 24.

• 

  2. UI Challenge 우선 모든 위젯의 생성은 객체 형태로 선언 되지만 Dart언어의 특성상 new라는 예약어의 생략이 가능하여 그렇게 보이지 않을 뿐 착각하면 안된다. 예를들면 아래 코드에서 MaterialApp()이라고 자성되어 있지만,new를 생략하여 안보일뿐 객체를 return하는 것마찬가지로 MaterialApp()안에 home이라는 매개변수에 Scaffold()라는 객체를 new라는 예약어 사용 없이 객체를 생성하고 대입하는 방법return MaterialApp( home : Scaffold( ... ) ) 해당 과정이 중요하고 간과하면 안된다. 대부분의 매개변수는 Null이 허용되며, 디폴트값이 정해져 있다.VScode의 경우 호버로 객체의 생성자의 매개변수를 볼 수 있고,IntelliJ에서는 Command+K와.. FrameWorks/Flutter 2023. 4. 10.

• 

  1. Hello Flutter 1-1) Hello World Widget마치 레고 블럭 같은 느낌위젯들을 모두 모아 하나의 웹 페이지를 만듬위젯을 만든다는건 class를 만든다는 것과 비슷 runApp([App()])App이라는 class를 만들어 실행App은 StatelessWidget를 상속받아 build메소드를 구현구현한 build메소드를 CupertinoApp(IOS)와 MaterialApp(Android) 중 return 할 것을 선택커스터마이즈를 하고 싶어도 기본 UI설정과 재료를 선택해 주어야 하기 때문에 선택해야함 scaffold상단 버튼, 중앙 정렬, bottom, tab, bar 등을 해줌 Uploaded by N2T FrameWorks/Flutter 2023. 4. 10.

• 

  Flutter?? 다른 FrameWork와의 차이점 마치 게임 엔진 처럼 동작함IOS, Android, MacOS, WindowOS와 직접으로 대화하지 않음(크로스 플랫폼이 아님)운영체제는 엔진을 돌리기위해서만 사용함엔진(JVM이라고 생각하면 이해가 쉬움)을 사용해 대화함(C/C++)엔진이 화면을 뿌려줌input, button 등내장된 플랫폼 위젯을 사용하지 않음유저가 앱을 실행시키면 앱은 Flutter 라이브러리를 불러오고 개발자가 만든 모든 UI를 랜더링함모든 UI는 렌더링 엔진에 의해 그려짐배터리표시, 시간, 와이파이 등 네이티브 위젯이 아닌 Flutter가 그린 위젯이므로 똑같지 않음 React Native vs Flutter 최대한 해당 플랫폼(IOS, Android, Mac, Windows …)과 비슷하게 만들.. FrameWorks/Flutter 2023. 4. 10.

• 

  [Flutter] 객체 생성시 Const를 붙이라는 Warning 제거 회사에서 Intellij를 사용하라고 해서 접한지 얼마 되지 않아 사용하는 여러가지 분편한 점들이 발견 되었다. 그 중 Flutter사용 중 다음과 같이 const를 붙이라는 문구가 계속해서 나타나는데... VScode의 경우 setting.json에서 저장시 자동으로 Fix해주는 문구를 삽입해주면 되지만 Intellij는 setting.json파일이 없는 것 같았다. "editor.codeActionsOnSave": { "source.fixAll": true } #추가로 넣으면 좋음 "dart.previewFlutterUiGuides": true, "dart.openDevTools": "flutter", "[dart]": { "editor.formatOnSave": true, } 코드를 입력하고 실행을.. FrameWorks/Flutter 2023. 4. 9.