01 위젯만들기

rules 추가

  # analysis_options.yaml 파일에 아래 설정 추가
  rules:
      prefer_typing_uninitialized_variables: false
      prefer_const_constructors_in_immutables: false
      prefer_const_constructors: false
      avoid_print: false

  # 코드 룰 무시하는 것임

lib/main.dart

void main 아래에 있는 애들 모두 지움

  import 'package:flutter/material.dart';

  void main() {
    runApp(const MyApp()); // 앱 시작해주세요 
    // 이 안에서만 도는 것임
  }

아래 코드 추가

  class MyApp extends StatelessWidget {
    const MyApp({Key? key}) : super  (key:key);
    @override
    Widget build(BuildContext context){
      return MaterialApp(
        home:
      );
    }
  }

무시해 세팅 문법이니까

Flutter에서 앱 디자인하는 방법: 위젯 짜깁기.
위젯이란 무엇이냐.
홈화면에서 앱의 위젯 기능을 제공 (날씨 위젯)

위젯은 대문자로 시작해서 소괄호가 붙은 애들임

  home: Text('안녕')

꼭 알아야하는 위젯 4개

글자 위젯
이미지 위젯
아이콘 위젯
박스 위젯

이게 위젯의 모든 것임.

  • 아이콘 넣을 때는 Icon(Icons.star)
  • 이미지 : Image.asset('경로') 이미지는 경로 넣을 때 경로를 등록해줘야한다. 그런 앱의 모든 자료들을 등록하는 파일 : pubspec.yaml (외부 패키지 라이브러리 등도 가져옴)
      # The following section is specific to Flutter packages.
      flutter:
        assets:
          - assets/
    
  • 네모박스 넣을 땐 Container()
    home: Container( width: 50, height: 50, color: Colors.blue)
    

근데 이렇게 하면, 화면전체가 파란색으로 나온다. 위치 정보가 없어서 그렇다. 그럴 때는 아래와 같이

    home:Center(
        child: Container( width: 50, height: 50, color: Colors.blue),
      )

이렇게 하면 화면 중앙에 파란박스 나온다.