From 88f326b37f6ca35efbb8e5133cd99104d8855bf0 Mon Sep 17 00:00:00 2001 From: Hailey Date: Thu, 10 Oct 2024 18:16:25 -0700 Subject: Fix sheets to work nicely on ios 15 (#5685) --- modules/bottom-sheet/ios/SheetViewController.swift | 34 ++++++++++++++-------- .../src/BottomSheetNativeComponent.tsx | 24 ++++++++++++++- 2 files changed, 45 insertions(+), 13 deletions(-) (limited to 'modules') diff --git a/modules/bottom-sheet/ios/SheetViewController.swift b/modules/bottom-sheet/ios/SheetViewController.swift index 7b6606980..a8b8f0c05 100644 --- a/modules/bottom-sheet/ios/SheetViewController.swift +++ b/modules/bottom-sheet/ios/SheetViewController.swift @@ -27,28 +27,38 @@ class SheetViewController: UIViewController { return } - if contentHeight > screenHeight - 100 { - sheet.detents = [ - .large() - ] - sheet.selectedDetentIdentifier = .large - } else { - if #available(iOS 16.0, *) { + if #available(iOS 16.0, *) { + if contentHeight > screenHeight - 100 { + sheet.detents = [ + .large() + ] + sheet.selectedDetentIdentifier = .large + } else { sheet.detents = [ .custom { _ in return contentHeight } ] + if !preventExpansion { + sheet.detents.append(.large()) + } + sheet.selectedDetentIdentifier = .medium + } + } else { + if contentHeight > screenHeight / 2 { + sheet.detents = [ + .large() + ] + sheet.selectedDetentIdentifier = .large } else { sheet.detents = [ .medium() ] + if !preventExpansion { + sheet.detents.append(.large()) + } + sheet.selectedDetentIdentifier = .medium } - - if !preventExpansion { - sheet.detents.append(.large()) - } - sheet.selectedDetentIdentifier = .medium } } diff --git a/modules/bottom-sheet/src/BottomSheetNativeComponent.tsx b/modules/bottom-sheet/src/BottomSheetNativeComponent.tsx index eadd9b4a1..fa2b163bf 100644 --- a/modules/bottom-sheet/src/BottomSheetNativeComponent.tsx +++ b/modules/bottom-sheet/src/BottomSheetNativeComponent.tsx @@ -23,10 +23,13 @@ const NativeView: React.ComponentType< const NativeModule = requireNativeModule('BottomSheet') +const isIOS15 = Platform.OS === 'ios' && Number(Platform.Version) < 16 + export class BottomSheetNativeComponent extends React.Component< BottomSheetViewProps, { open: boolean + viewHeight?: number } > { ref = React.createRef() @@ -67,6 +70,19 @@ export class BottomSheetNativeComponent extends React.Component< const {children, backgroundColor, ...rest} = this.props const cornerRadius = rest.cornerRadius ?? 0 + let extraStyles + if (isIOS15 && this.state.viewHeight) { + const {viewHeight} = this.state + if (viewHeight < screenHeight / 2) { + extraStyles = { + height: viewHeight, + marginTop: screenHeight / 2 - viewHeight, + borderTopLeftRadius: cornerRadius, + borderTopRightRadius: cornerRadius, + } + } + } + if (!this.state.open) { return null } @@ -92,8 +108,14 @@ export class BottomSheetNativeComponent extends React.Component< borderTopLeftRadius: cornerRadius, borderTopRightRadius: cornerRadius, }, + extraStyles, ]}> - + { + const {height} = e.nativeEvent.layout + this.setState({viewHeight: height}) + this.updateLayout() + }}> {children} -- cgit 1.4.1