Observe content view layout natively on Android too
Same approach as the iOS KVO change: use View.OnLayoutChangeListener on the content view to detect height changes purely on the native side. This eliminates the setTimeout → updateLayout() JS bridge hack that was a known workaround for async timing issues on Android. The onLayout callback in JS is now only used for the iOS 15 fallback height measurement. All other height observation is native. https://claude.ai/code/session_01Rp7ef1h3fKh6fhStcjqLJ5
This commit is contained in:
@@ -113,23 +113,16 @@ export class BottomSheetNativeComponent extends React.Component<
|
||||
nativeViewRef={this.ref}
|
||||
onStateChange={this.onStateChange}
|
||||
extraStyles={extraStyles}
|
||||
onLayout={e => {
|
||||
if (IS_IOS15) {
|
||||
const {height} = e.nativeEvent.layout
|
||||
this.setState({viewHeight: height})
|
||||
}
|
||||
if (Platform.OS === 'android') {
|
||||
// TEMP HACKFIX: I had to timebox this, but this is Bad.
|
||||
// On Android, if you run updateLayout() immediately,
|
||||
// it will take ages to actually run on the native side.
|
||||
// However, adding literally any delay will fix this, including
|
||||
// a console.log() - just sending the log to the CLI is enough.
|
||||
// TODO: Get to the bottom of this and fix it properly! -sfn
|
||||
setTimeout(() => this.updateLayout())
|
||||
}
|
||||
// iOS: content height changes are observed natively via KVO on
|
||||
// the content view's bounds, so no JS bridge round-trip needed.
|
||||
}}
|
||||
onLayout={
|
||||
IS_IOS15
|
||||
? e => {
|
||||
const {height} = e.nativeEvent.layout
|
||||
this.setState({viewHeight: height})
|
||||
}
|
||||
: undefined
|
||||
// Content height changes are observed natively on both platforms:
|
||||
// iOS uses KVO on content view bounds, Android uses OnLayoutChangeListener.
|
||||
}
|
||||
/>
|
||||
</Portal>
|
||||
)
|
||||
@@ -150,7 +143,7 @@ function BottomSheetNativeComponentInner({
|
||||
event: NativeSyntheticEvent<{state: BottomSheetState}>,
|
||||
) => void
|
||||
nativeViewRef: React.RefObject<View>
|
||||
onLayout: (event: LayoutChangeEvent) => void
|
||||
onLayout?: (event: LayoutChangeEvent) => void
|
||||
}) {
|
||||
const insets = useSafeAreaInsets()
|
||||
const cornerRadius = rest.cornerRadius ?? 0
|
||||
|
||||
Reference in New Issue
Block a user