[FLUTTER] 모바일 프로그래밍(6) - 위젯 트리 구현 정리

오늘은 위젯 배치에 대한 실습을 진행하여, 이를 통해 관련 함수의 원리를 정확하게 이해하는 시간을 갖겠습니다. 

 

먼저 Row 위젯입니다. 이를 이용하면 해당 Row 안에 존재하는 Container들을 나란히 정렬할 수 있습니다. 

 

다음으로는 body에 Row를 적용하는 것이 아닌 Container에 다시 한번 감싸, 바디의 특정 영역만을 가로 정렬로 설정하고 관련 디자인을 수정할 수 있도록 구축 가능하게끔 적용할 수 있게 만들었습니다.

 

다음으로는 mainAxisSize: MainAxisSize.min 을 설정하여 Row의 크기 자체츨 조정했습니다. 이를 이용하면, 위처럼 가로 전체를 차지하는 것이 아닌 특정 영역 이내로 제한하여, 디테일한 구성을 만들 수 있게됩니다. 

 

다음으로는 mainAxisAlignment / crossAxisAlignment 를 이용해 각각 가로축과 세로축의 위치 자체를 조정시켰습니다. 이는 Row 이기 때문에 메인이 가로축으로 인식되기 때문에 이와 같이 동작합니다.

 

마지막으로 Stack을 다뤄보겠습니다. 이는 Row나 Column과 다르게, 완전히 겹쳐서(관점에 따라 스택처럼) 쌓아지는 형태로 구현되는 위젯입니다. 

 

해당 실습을 통해 실제 플러터를 이용한 디자인과 관련하여 보다 디테일한 지식을 알 수 있었으며, 이를 통해 실제로 구현할 수 있는 출력의 범위가 넓어졌으며 매우 다양해졌습니다. 따라서 해당 시간이 매우 유익했으며 많은 정보를 알아갈 수 있는 뜻깊은 시간이었습니다. 해당 과정을 통해 플러터에 대한 지식을 보다 키울 수 있게되었고, 관련하여 플러터를 이용한 화면 출력 응용 방법에 대해 조금 더 알아갈 수 있는 귀중한 시간이었습니다.