[React Native] XCode 26 버전에서 Liquid Glass UI를 미적용하는 방법

최근 앱 개발을 하면서 작업을 진행하고 있는데, XCode의 버전을 26으로 최신화한 뒤 개발을 진행하고 있었다.
마침 Local Notification 이슈가 있어 이 점을 수정하고, XCode로 iOS 빌드를 돌려 테스트를 해봤는데 React Native에서 제공해주는 Switch 컴포넌트에 문제가 발생했다.

iOS 26 버전에 맞게 해당 컴포넌트도 Liquid Glass로 반영되다 보니 UI가 기존 형태와 Liquid Glass 형태로 두 개가 겹쳐 나오는 현상이 발생했다.

React Native는 0.74 버전 고정이었기 때문에, 0.8n 버전이라면 Liquid Glass 대응을 할 수 있겠지만 버전업을 하기에는 상당한 시간이 걸리는 데다 이 이슈 하나 때문에 버전업을 하는 것은 그다지 좋은 선택지가 아니었다. (게다가 이미 App Store Connect에 심사를 올리려던 중이었다.)

그래서 이 문제를 해결하기 위해 ‘how to off liquid glass react native switch’ 키워드로 검색해보니 raddit에 다음과 같은 글이 발견되었다.

기존 Hidden Tab Bar에 나타나는 Liquid Glass 효과를 없앨 방법이 있을까요?

답은 UIDesignRequiresCompatibility이다.

UIDesignRequiresCompatibility라는 key는 UI의 호환성 모드를 사용할 것인지를 체크하는 Boolean 값이다.
호환성 모드라는 것은 지금 디자인이 전폭적으로 변경된 iOS 26 버전 이전의 디자인을 고려한 모드를 가리킨다.
즉, 구버전 UI라는 거다.

해당 값을 YES로 하면 26 버전 이전 버전 SDK 기준으로 UI를 맞춰 반영하며, NO일 경우 호환성 모드를 끔으로서 26 버전의 Liquid Glass UI로 반영하게 된다.

그래서 iOS의 프로젝트 폴더 내 info.plist를 찾아서 윗 사진의 맨 아랫줄과 같이 UIDesignRequiresCompatibility를 추가하고 YES를 적용해 빌드하면, 이제 앱에서는 우리에게 익숙한 iOS 버전의 UI가 노출된다.

주의할 점?

공식 문서에서는 ‘최신 SDK의 디자인에 맞게 앱의 UI를 검토하고 개선하는 동안 이 key를 임시로 사용합니다.’라고 적혀있다.
iOS 측에서 계속해서 OS 버전업을 진행하다보면 해당 key가 deprecated될 수도 있다.

그렇다는 건, 더 이상 구 버전의 UI가 보편적이지 않다는 것이므로 프로젝트 내에서도 나름대로의 호환성을 맞추기 위한 조치를 취해야할 수 있다.

최근 React Native의 버전도 빠르게 업그레이드 되면서 Android도, iOS도 신규 버전에 맞게 지원을 해주는 만큼 그 점을 고려해서 시기적절하게 마이그레이션하는 것이 결국 좋은 방법일 듯 하다.