팝업창 위치 조정

버튼을 누르면 생성되는 팝업창의 위치를 버튼과 연관 되게 만들고 싶을 때, 

 

버튼을 눌렀을 때 RenderBox 로 해당 버튼의 rending 관련 정보를 가져온뒤 offset 값을 화면애 대한 절대값으로 변환하여 이값을 기반하여 생성될 popup 창의 위치를 결정하는 파라미터에 넣어주면 된다. 

 onPressed: (){
        final RenderBox renderBox =
        context.findRenderObject() as RenderBox;
        final offset = renderBox.localToGlobal(Offset.zero);
        final left =  // offset.dx 를 활용하여 popup 창의 왼쪽위 모서리 x좌표 값 계산하여 입력 
        final top =   // offset.dy 를 활용하여 popup 창의 왼쪽위 모서리 y좌표 값 계산하여 입력
        EdgeInsets InsetPadding = EdgeInsets.only(left: padLeft, top: padHeight),
        Get.dialog(
    		barrierDismissible: barrierDismissible,
    		AlertDialog(
      			content: child,
      			insetPadding: insetPadding ?? EdgeInsets.zero,
    		),
  		);
      },

위에서 설정한 insetPadding(참고) 은 생성한 다이얼로그를 화면의 어디에 표시할지 결정하는데 사용한다. 정확히는 다이얼로그와 화면  boundary 사이의 space(공간)을 정의.  

 

위의 코드에서 중요한 것은, renderBox 정보를 가져올 때 입력 받은 context 를 이용한 다는 것이다. 따라서 누르는 버튼에 대한 BuildContext 가 있어야 해당 버튼의 위치에 대한 좌표를 계산 가능하다. 그러므로 해당 버튼을 Stateful 이든 Stateless 든 Widget class 로 만들어 줘야 한다.