Things take time

[Flutter] 화면을 회전하되, 기존 회전값 유지하고 싶을때 본문

Flutter

[Flutter] 화면을 회전하되, 기존 회전값 유지하고 싶을때

겸손할 겸 2022. 8. 3. 10:59

[회전]

SystemChrome.setPreferredOrientations(
  [DeviceOrientation.landscapeRight]
);

Flutter에서 회전을 수행하는 함수다. 해당 함수 호출시, 사용자의 디바이스를 가로로 회전하게 된다. Right이므로 화면 위쪽이 오른쪽으로

 

[추가]

위의 함수를 사용하면, 가로로 회전을 강제로 시키기 때문에 사용자가 다시 디바이스를 세로로 회전할 경우, 세로로 돌아가지 않는다. 그러므로 사용자는 다시 버튼을 클릭해서 현재 회전상태에 따라 반대로 회전하는 형태를 취해야 한다. 그래서 저 함수는 보통 앱이 시작되거나, 특정 라우트가 회전 상태를 유지하고싶을 때 사용하는데 나의 경우에는 세로인 경우, 가로로 회전 시키되 사용자가 다시 세로로 기기를 돌리면 자동 회전 되길 원한다. 

 

1. 디바이스가 세로인 상태 -> 버튼 클릭 시 가로로 강제 회전, 가로로 돌렸다가 세로로 디바이스를 회전했을 때 세로도 자동 회전되길 원함

2. 디바이스가 가로인 상태 -> 버튼 클릭 시 세로로 강제 회전, 세로로 돌렸다가 가로로 디바이스를 회전했을 때 가로도 자동 회전되길 원함

  SystemChrome.setPreferredOrientations(
    isPortrait
        ? [
            DeviceOrientation.landscapeRight,
          ]
        : [
            DeviceOrientation.portraitUp,
          ],
  ).then((value) {
    SystemChrome.setPreferredOrientations(
      isPortrait
          ? [
              DeviceOrientation.landscapeRight,
              DeviceOrientation.portraitUp,
            ]
          : [
              DeviceOrientation.portraitUp,
              DeviceOrientation.landscapeRight,
            ],
    );
  });

코드는 간단하다. 현재 회전 상태에따라 회전을 바대로 시키고, 해당 함수는 Future함수이므로, 이후에 현재 회전상태에 따라 원상복귀시킨다. 단! 주의해야할 점은, then 이후에 설정되는 회전값의 순서가 중요하다. isPortrait일 경우 landscapeRight를 설정했고, 회전이 수행된 뒤에 다시 landscapeRight, portraitUp을 설정해줘야 회전된 뒤의 회전값이 다시 변하지 않는다.