쌤닷컴

pubspec.yaml 파일 띄워쓰기 2칸 중요

아래와 같이 사용

import 'package:flutter/material.dart'; //flutter/material.dart 불러오기

void main() => runApp(MyApp());  //최상단 MyApp실행하기

class MyApp extends StatelessWidget {  //MyApp 설계
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(  //MyApp에서 가장 기본인 MaterialApp 설정하기
      title:'My First App', //보통 타이틀, 테마, 홈으로 구성
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),  // home이 중요한데 가장 먼저 열리는 페이지 실행
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(  //페이지에서 가장 기본인 Scaffold로 시작
        appBar: AppBar( //scaffold의 구성은 appBar와 body가 기본
          title: Text('My App'),
        ),
        body: Center( //body는 보통 center에 column넣고 시작
          child: Column(
            children: [
              Text("Hello"),
              Text("Hello"),
              Text("Hello"),
              Text("Hello"),
            ],
          ),
        )
    );
  }
}

플러터는 객체 기반 언어

커스텀 위젯도 모두 클래스로 구현

stful, stless로 불러쓸 수 있음

사용 예시

개발환경 구성은 아래 링크

https://www.youtube.com/watch?v=usE9IKaogDU&list=PLfLgtT94nNq1izG4R2WDN517iPX4WXH3C 

초보때는 린트 꺼주는게 나을 수도?

analysis_options.yaml 파일에 rules에 추가하기

rules:
  prefer_typing_uninitialized_variables : false
  prefer_const_constructors : false
  prefer_const_constructors_in_immutables : false
  prefer_const_literals_to_create_immutables : false
  avoid_print : false

애셋 폴더 경로지정(이미지 같은거 사용)

- 이미지 저장용 assets폴더 만들기

- 이미지, 아이콘 등 폴더에 넣기

- 이미지 등록하기 pubspec.yaml 파일에

- 아래 이미지처럼 써주기

 - 사용할 때는 image.assets('경로')

5강 플렉서블, 익스팬디드

1. 플렉서블(비율적으로 배치)

2. 익스팬디드(플렉스 1과 같음) - 나머지 꽉 채울 때

4강

텍스트 다루기

버튼 3종류

앱바 아이콘 텍스트 배치

박스 다루기

박스에 패딩, 마진, 테두리(decoration사용) 효과주기

정렬, 박스 꽉 채우기