rmorawski/standardnotes-app-web
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

fix: fix extra bottom space when scrolling down note in android (#2965)

Browse Source
This commit is contained in:
Antonella Sgarlatta
2026-01-05 13:48:46 -03:00
committed by GitHub
parent 5944cead98
commit 9c737141f9
1 changed files with 37 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
packages/mobile/src/MobileWebAppContainer.tsx
View File

@@ -47,6 +47,9 @@ const MobileWebAppContents = ({ destroyAndReload }: { destroyAndReload: () => vo
const insets = useSafeAreaInsets() const insets = useSafeAreaInsets()
const screenHeight = Dimensions.get('screen').height
const [webViewContainerHeight, setWebViewContainerHeight] = useState(screenHeight)
useEffect(() => { useEffect(() => {
const removeStateServiceListener = stateService.addEventObserver((event: ReactNativeToWebEvent) => { const removeStateServiceListener = stateService.addEventObserver((event: ReactNativeToWebEvent) => {
webViewRef.current?.postMessage(JSON.stringify({ reactNativeEvent: event, messageType: 'event' })) webViewRef.current?.postMessage(JSON.stringify({ reactNativeEvent: event, messageType: 'event' }))
@@ -98,27 +101,33 @@ const MobileWebAppContents = ({ destroyAndReload }: { destroyAndReload: () => vo
const keyboardDidShowListener = Keyboard.addListener('keyboardDidShow', (e) => { const keyboardDidShowListener = Keyboard.addListener('keyboardDidShow', (e) => {
// iOS handles this using the `willChangeFrame` event instead // iOS handles this using the `willChangeFrame` event instead
if (Platform.OS === 'android' && insets.bottom > 0) { if (Platform.OS === 'android') {
fireKeyboardSizeChangeEvent(e) setWebViewContainerHeight(e.endCoordinates.screenY)
webViewRef.current?.postMessage( if (insets.bottom > 0) {
JSON.stringify({ fireKeyboardSizeChangeEvent(e)
reactNativeEvent: ReactNativeToWebEvent.KeyboardDidShow, webViewRef.current?.postMessage(
messageType: 'event', JSON.stringify({
}), reactNativeEvent: ReactNativeToWebEvent.KeyboardDidShow,
) messageType: 'event',
}),
)
}
} }
device.reloadStatusBarStyle(false) device.reloadStatusBarStyle(false)
}) })
const keyboardDidHideListener = Keyboard.addListener('keyboardDidHide', () => { const keyboardDidHideListener = Keyboard.addListener('keyboardDidHide', () => {
// iOS handles this using the `willChangeFrame` event instead // iOS handles this using the `willChangeFrame` event instead
if (Platform.OS === 'android' && insets.bottom > 0) { if (Platform.OS === 'android') {
webViewRef.current?.postMessage( setWebViewContainerHeight(screenHeight)
JSON.stringify({ if (insets.bottom > 0) {
reactNativeEvent: ReactNativeToWebEvent.KeyboardDidHide, webViewRef.current?.postMessage(
messageType: 'event', JSON.stringify({
}), reactNativeEvent: ReactNativeToWebEvent.KeyboardDidHide,
) messageType: 'event',
}),
)
}
} }
device.reloadStatusBarStyle(false) device.reloadStatusBarStyle(false)
}) })
@@ -137,7 +146,7 @@ const MobileWebAppContents = ({ destroyAndReload }: { destroyAndReload: () => vo
keyboardDidHideListener.remove() keyboardDidHideListener.remove()
keyboardWillChangeFrame.remove() keyboardWillChangeFrame.remove()
} }
}, [webViewRef, stateService, device, androidBackHandlerService, colorSchemeService, insets.bottom]) }, [webViewRef, stateService, device, androidBackHandlerService, colorSchemeService, insets.bottom, screenHeight])
useEffect(() => { useEffect(() => {
return notifee.onForegroundEvent(({ type, detail }) => { return notifee.onForegroundEvent(({ type, detail }) => {
@@ -417,10 +426,18 @@ const MobileWebAppContents = ({ destroyAndReload }: { destroyAndReload: () => vo
return ( return (
<View <View
style={{ style={
flex: 1, Platform.OS === 'android'
backgroundColor: '#000000', ? {
}} height: webViewContainerHeight,
backgroundColor: '#000000',
overflow: 'hidden',
}
: {
flex: 1,
backgroundColor: '#000000',
}
}
> >
<WebView <WebView
ref={webViewRef} ref={webViewRef}