flutter_widget_0

문재경·2023년 6월 12일
0

플러터 노트

목록 보기
7/10
post-thumbnail

2주차 - 다양한 위젯을 활용해 화면 그리기

  • flutter의 widget 이해하기
  • 화면 그리는 위젯 이해하기
  • 당근마켓 만들기

2-1. flutter 위젯 이해하기

  • flutter의 모든 위젯은 stateless와 stateful로 나눌 수 있다.
  • statelessWidget 상태 변화가 없어 새로고침을 할 필요가 없는 위젯
  • statefulWidget 상태 변화가 있어 화면을 새로고침 할 필요가 있는 위젯

statelessWidget

  • 화면 내 내용이 변하지 않는 위젯 (정적인 페이지) 이미지만 띄워준다던지, 이용 약관 등과 같은 페이지는 내용이 변할 필요가 없다.

  • extends stateless widget: stateless widget의 기능을 물려받는다.

  • 생성자: 클래스 이름과 동일한 함수

  • build 함수: 화면에 보여줄 자식 위젯을 반환

예시)

import 'package:flutter/material.dart';

void main() {
  print("시작");
  runApp(const MyApp());
}

// StatelessWidget을 상속
class MyApp extends StatelessWidget {
  // 생성자
  const MyApp({Key? key}) : super(key: key);
  
  // build 라는 이름의 메서드(함수) 실행
  @override
  Widget build(BuildContext context) {
    print("build 호출");
    
    return const MaterialApp(
      home: Scaffold(
        body: Center(
          child: Text(
            "hello Stateless Widget",
            style: TextStyle(fontSize: 35),
          ),
        ),
      ),
    );
  }
}

statefulWidget

오늘은 일단 statelessWidget까지 학습, 6:11 이어서 스터디 
profile
스터디 아카이브

0개의 댓글