위젯 겹치게 배치하기

Column가 Row를 사용하여 차곡차곡 위젯을 쌓아가기만 하던 도중,

gif 이미지를 우측 최하단에 위치시키고 중앙 최하단에는 텍스트 위젯을 보이게 해야하는 상황이 발생했다.

 

이 경우, Stack 위젯을 이용하여 해당 위젯을 배치하고 Positioned 위젯을 통해 위치를 지정하면 된다.

 

Column(
	children:[
    	// 위젯 중첩
    ]
)

// 위 구조를 아래와 같이 변경

Stack(
	children:[
    	Column() // 겹쳐야 하는 위젯을 제외한 나머지 기존 위젯
        Positioned(
            bottom: x,
            right: x,
            child: 이미지 위젯
        ),
        Positioned(
            bottom: x,
            right: x,
            child: 텍스트 위젯
        ),
    ]
)

Positioned를 이용하여 위젯 위치를 잡아줄 경우, 위젯을 겹치게 위치할 수 있다.