Flutter iOS 화면 전환 시 잔상·깜빡임(flicker) 문제 해결법

Flutter iOS 화면 전환 시 잔상·깜빡임(flicker) 문제 해결법

Flutter로 iOS 앱을 개발할 때, 화면 전환 중 이전 화면이 0.1초 정도 잔상처럼 남거나 깜빡이는 문제가 자주 발생합니다. 이는 Flutter의 렌더링 엔진 버그 또는 전환 애니메이션 처리 방식과 관련이 있습니다. 이번 글에서는 iOS 빌드에서 발생하는 화면 잔상 문제의 원인과 해결책을 자세히 정리했습니다.

1️⃣ 문제 개요

일부 iOS 기기나 시뮬레이터에서 Navigator.push() 또는 go_router로 화면 이동 시, 이전 화면이 잠깐 보였다 사라지는 현상이 있습니다. 개발자 입장에서는 전환 애니메이션이 자연스럽게 끝나기 전에 프레임이 섞이거나 캐시된 이미지를 보여주는 것처럼 느껴질 수 있습니다.

2️⃣ 주요 원인

• 렌더링 캐시 버그: Flutter iOS 엔진에서 특정 버전(2.10 이후)에 화면 버퍼가 완전히 초기화되지 않아 발생합니다.
• Hero 위젯 충돌: 동일한 Hero 태그(tag)를 두 화면에서 공유할 때 잔상처럼 보일 수 있습니다.
• 배경색 누락: Scaffold의 backgroundColor가 투명(default)일 경우, 이전 화면이 살짝 비쳐 보입니다.
• 전환 애니메이션 과도: Cupertino-style 전환 시 iOS의 자연스러운 “push” 효과가 Flutter 내부 프레임과 어긋날 수 있습니다.

3️⃣ 해결 방법

① Scaffold 배경색 명시

Scaffold(
  backgroundColor: Colors.white,
  body: ...
)
    

배경색을 명시하면 투명 레이어가 남는 문제를 방지할 수 있습니다.

② 전환 애니메이션 제거

Navigator.pushReplacement(
  context,
  PageRouteBuilder(
    pageBuilder: (_, __, ___) => const NextScreen(),
    transitionDuration: Duration.zero,
    reverseTransitionDuration: Duration.zero,
  ),
);
    

애니메이션을 제거하면 이전 화면이 잔상으로 남을 일이 없습니다.

③ Hero 위젯 점검

두 화면 간 동일한 Hero(tag: "same")가 있으면 Flutter가 자동으로 전환 애니메이션을 적용합니다. 이를 방지하려면 tag를 제거하거나, 각 화면마다 고유한 tag를 사용하세요.

④ 렌더링 엔진 버전 업데이트

Flutter의 iOS 렌더링 버그는 일부 버전에서만 발생합니다. 다음 명령으로 최신 버전으로 업데이트하세요.

flutter upgrade
flutter clean
flutter pub get
    

⑤ iOS 기기별 테스트

iOS 시뮬레이터에서는 발생하지만 실제 기기에서는 정상적으로 작동하는 경우도 있습니다. 테스트 시 실기기(iPhone)에서 직접 확인하세요.

4️⃣ Flutter iOS 초기화 코드 점검

앱 시작 시 시스템 방향이나 초기 바인딩이 제대로 설정되지 않으면, iOS가 첫 전환 시 프레임을 잠깐 잘못 표시할 수 있습니다.

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await SystemChrome.setPreferredOrientations([DeviceOrientation.portraitUp]);
  runApp(MyApp());
}
    

이 코드를 추가하면 앱이 시작될 때 렌더링 버퍼 초기화 타이밍을 안정화시켜 줍니다.

5️⃣ 결론

iOS 빌드에서 Flutter 화면 잔상(깜빡임) 문제는 주로 렌더링 버그 + 배경색 누락 + Hero 충돌이 복합적으로 작용하는 경우가 많습니다. 따라서 위의 다섯 가지 방법을 순서대로 적용해보면 대부분 해결됩니다. 만약 여전히 문제가 남는다면 Flutter GitHub 이슈 페이지에서 현재 버전의 렌더링 관련 오픈 이슈를 확인해보세요.

이 글이 Flutter iOS 화면 전환 잔상 문제로 고민하는 분들께 도움이 되길 바랍니다.