This commit is contained in:
Hailey
2024-10-10 17:45:04 -07:00
parent 016f71ffa1
commit b36f7dcfea
3 changed files with 53 additions and 25 deletions
+1 -7
View File
@@ -23,13 +23,7 @@ class SheetView: ExpoView, UISheetPresentationControllerDelegate {
// React view props
var preventDismiss = false
var preventExpansion = false {
didSet {
if #unavailable(iOS 16.0) {
preventExpansion = false
}
}
}
var preventExpansion = false
var cornerRadius: CGFloat?
var minHeight = 0.0
var maxHeight: CGFloat! {
@@ -26,27 +26,37 @@ class SheetViewController: UIViewController {
else {
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())
if !preventExpansion {
sheet.detents.append(.large())
}
}
sheet.selectedDetentIdentifier = .medium
}
@@ -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<any>()
@@ -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
}
@@ -76,11 +92,13 @@ export class BottomSheetNativeComponent extends React.Component<
{...rest}
onStateChange={this.onStateChange}
ref={this.ref}
style={{
position: 'absolute',
height: screenHeight,
width: '100%',
}}
style={[
{
position: 'absolute',
height: screenHeight,
width: '100%',
},
]}
containerBackgroundColor={backgroundColor}>
<View
style={[
@@ -92,8 +110,14 @@ export class BottomSheetNativeComponent extends React.Component<
borderTopLeftRadius: cornerRadius,
borderTopRightRadius: cornerRadius,
},
extraStyles,
]}>
<View onLayout={this.updateLayout}>
<View
onLayout={e => {
const {height} = e.nativeEvent.layout
this.setState({viewHeight: height})
this.updateLayout()
}}>
<BottomSheetPortalProvider>{children}</BottomSheetPortalProvider>
</View>
</View>