flutter & dart - Align 위젯

Overview

정렬을 원한다면 Align 위젯을 사용해보자~

1. Align 위젯이란?
2. Container 에서 정렬을 시킨다면?

 

0. 문서

https://api.flutter.dev/flutter/widgets/Align-class.html

Align class - widgets library - Dart API

 

1. Align 위젯이란

정렬 위젯이다. 네.. 정렬 그냥 ㅋㅋ 뭐 말할게 있나요ㅎ..

밑과 같이 alignment 매개변수를 사용하여 Alignment.000  으로 정렬이 가능합니다.

Align(
        child: Text("안녕"),
        alignment: Alignment.bottomRight,
 ),

 

2. Container 위젯과 정렬

Container 위젯은 자식 위젯이 없다면 부모 위젯의 크기를 가지고 자식 위젯이 있다면 자식 위젯의 크기를 가지게 된다.

만약 자식 위젯이 있는데 부모 위젯의 크기를 가지고 싶다면 정렬을 사용할 수 있다.

밑은 정렬을 사용했을 때 [오른쪽] 와 정렬을 사용하지 않았을 때 [왼쪽]의 차이점 사진이다. 확실히 다르다.

SafeArea(
      child: Scaffold(
        // Container 는 자식에 크기를 맞추고 싶지 않다면 정렬을 하면 된다.
        body: Container(
          color: Colors.green,
          child: Align(
            child: Text("안녕"),
            alignment: Alignment.bottomRight,

          ),
        ),
      ),
    );