Flutter/Flutter 개발 노트

[Flutter] 화면 겹치기 Stack 사용해보기

힛해 2024. 1. 30. 22:32
728x90

화면들을 보면 버튼위나 화면에 겹쳐져서 보이는 항목들이 보인다.

 

그건 Stack을 이용한 것들이다.

 

Stack을 활용하면 위젯들을 겹쳐서 보이게 할 수 있다.

 

사용법은 매우 간단하다.

 

이런식의 화면을 만들기 위해서 알아야하는 것이 두가지가 있다.

 

1과 2중에 어떤 것을 위에 보이게 할 것인가.

 

만약 흰색 배경이 v 보다 우선순위가 높다면 v는 보이지 않을 것이다.

 

우선순위를 정하는 건 매우 간단하다.

 

 

Stack의 children 들중 뒤에 나올 수록 화면의 윗 부분에 위치할 수 있다.

 

그리고 Stack의 자식들은 Positioned로 묶어 Stack이 차지한 공간의 top bottom  left right 값만큼 패딩처럼 멀어져서 배치할 수 있다.