React Native Screens 5.0.0-beta.1

v5.​0.​0-​beta.​1Pre-release

Key changes

This is the first beta release of react-native-screens 5.0.0, and it adds support for React Native 0.88. iOS gets ContainedModalProvider and ContainedModalOverContent, a modal confined to the bounds of its provider, e.g. a SplitView column. Stack v5 on Android now animates transitions with configurable presets and supports replaceAnimation. On iOS 27, Stack v4 gains minimizationBehavior and restorationBehavior, and both stacks gain safeAreaAdjustment. Form sheets can replace the Liquid Glass material on iOS 26.1+, and Stack v4 form sheets get a selectDetent command. The tab icon API drops the templateSource and xcasset types, see the migration below. The 5.0 prereleases are cut from the main branch, so this release also carries everything shipped on the 4.x line in 4.30.1.

Breaking: Tabs icon types (iOS)

The templateSource and xcasset tab icon types are removed, and imageSource icons on iOS are now tinted by default, in #4868. To migrate:

  • { type: 'templateSource', templateSource: src } becomes { type: 'imageSource', imageSource: src, renderingMode: 'template' }.
  • { type: 'xcasset', name: 'icon' } for an image set becomes { type: 'imageSource', imageSource: { uri: 'icon' } }.
  • { type: 'xcasset', name: 'icon' } for a custom symbol becomes { type: 'sfSymbol', name: 'icon' }.
  • An { type: 'imageSource', imageSource: src } icon that must keep its colors needs renderingMode: 'original'.

The TabsScreenIconTemplateIOS and TabsScreenIconXcassetIOS type exports are removed too, use TabsScreenIconIOS.

Improvements

  • iOS (ContainedModal): added ContainedModalProvider and ContainedModalOverContent, a modal that fills its provider instead of the whole window, in #4961 and #4962, with the onWillAppear, onDidAppear, onWillDisappear and onDidDisappear events in #5002. On Android and web the components render nothing for now.
  • Android (Stack v5): screen transitions animate with presets set through the animation prop (slideFromRight, slideFromLeft, slideFromBottom, slideFromTop, fade, fadeFromBottom, fadeFromTop, iosFromRight, iosFromLeft and none) in #4660 and #4670, and a preset accepts duration, easing and, for the fade-from presets, distance in #4980.
  • Android (Stack v5): added replaceAnimation (pop or push) on Stack.Screen to choose whether a replace looks like a pop or a push in #5058.
  • iOS (Stack v4): added minimizationBehavior and restorationBehavior to control when the navigation bar minimizes and restores on scroll on iOS 27 in #4729. Opaque headers default to never.
  • iOS (Stack v4, Stack v5): added safeAreaAdjustment (automatic, enabled or disabled) to control how safe-area insets follow the navigation bar when it minimizes on iOS 27 in #4732 and #4744.
  • Stack v4: added a sheetRef prop on Screen and ScreenStackItem with a selectDetent(index | 'last') command, so JS can move a presented form sheet to another detent, in #4794.
  • iOS (Stack v4): added sheetBackgroundEffect (automatic or color) for form sheets, so a sheet with an opaque background can drop the Liquid Glass material on iOS 26.1+, in #5007.
  • iOS (FormSheet v5): added backgroundEffect (automatic, none, a color or a blur style) to replace the sheet's Liquid Glass material on iOS 26.1+ in #5111.
  • iOS (SplitView): third-party libraries can customize a column's navigation item through RNSNavigationItemCustomizerProtocol in #5080, and column navigation bars support large titles, collapsed by default, in #5081.
  • Android (Tabs): tab configuration changes raised during a React transaction are applied once when it ends in #4976.

Bug fixes

  • Android (Stack v5): popping a screen that contains a nested stack no longer throws a pop-native error, since onDismiss is now emitted only for screens that are explicitly popped, in #4745.
  • Android (Tabs): a tapped tab gets its appearance in the same frame as the tap in #5044.
  • Android (Stack v4): form sheets stay below the status bar and still expand for the keyboard after another library, such as react-native-keyboard-controller, replaces the decor view's insets listener, in #5008.
  • Android (Stack v4): a fitToContents form sheet stays in place when its content height changes mid resize animation in #5005.
  • Android (Stack v4): a drag that scrolls a nested list to its top stops there instead of moving or dismissing the form sheet, matching iOS, in #5100.
  • Android (Stack v4): the form sheet's dimming view is hidden from accessibility services in #4933.
  • iOS (Tabs): the tab bar shows on an iPhone Duo launched unfolded in #4990, and search tab titles are set at creation so they are no longer truncated in #5057.
  • iOS (Stack): a recycled nested stack inside a modal appears together with the modal, so its content gets a safe area, in #4997.
  • iOS (Stack v4): updating the header no longer crashes when a header subview mounts or unmounts during the update in #4851.
  • iOS (Stack v4): the navigation bar alpha is restored after a cancelled zoom dismissal in #5055.
  • Web: Screen keeps its style when enabled is false in #4917.

New contributors

Welcome to our new contributors: @nkt, @ilp0, @Av1for, @Bram-dc and @dongriDK.

See the full release notes for 5.0.0-beta.1 on GitHub and the full changelog in 5.0.0-alpha.4...5.0.0-beta.1.

Release card
React Native Screens 5.0.0-beta.1 release card