(Flutter) Widget

Widget

 

플러터에서 화면에 보여지는 UI와 관련된 모든 요소는 위젯으로 구성되어 있다.

 

자식을 하나만 갖는 대표적인 위젯 대체로 child 매개변수를 입력받는다.

 

• Container : 자식을 담는 컨테이너 역할을 한다. 다만 단순하게 자식을 담는 역할을 하는게 아니라 배경색, 너비와 높이, 테두리 들의 디자일을 지정할 수 있다.
• GestureDetector : 플러터에서 제공하는 제스처 기능을 자식 위젯에서 인식하는 위젯
• SizedBox : 높이와 너비를 지정하는 위젯 Container 위젯과 다르게 디자인적요소는 적용할 수 없고 const 생성자로 선언할 수 있어서 퍼포먼스 측면에서 더 효울적이다.

다수의 자식을 입력할 수 있는 위젯은 children 매개변수를 입력받으며 리스트로 여러 위젯을 입력할 수 있다.

 

• Column : children 매개변수에 입력된 모든 위젯들을 세로로 배치한다.
• Row : children 매개변수에 입력된 모든 위젯들을 가로로 배친한다.
• ListView : 리스트릴 구현할 떄 사용, 입력된 위젯이 화면을 벗어나게 되면 스크롤이 가능하다.

 

import 'package:flutter/material.dart';
void main(){
  runApp(
    MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: SizedBox(
          // child : 하나의 위젯만 추가
          width: double.infinity,
          //Column : 세로 배치, Row : 가로 배치
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            //children : 리스트에 입력된 순서대로 화면에 그려진다.
            children: [
              Text('code!!'),
              Text('factory'),
            ],
            ),
        ),
      ),
    ),
  );
}