renil/lx-music-mobile-mod
1
0
Fork 0
mirror of https://github.com/ikun0014/lx-music-mobile.git synced 2025-07-03 04:02:09 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

修复弹窗高度问题

Browse Source
This commit is contained in:
lyswhut 2023-08-06 20:32:42 +08:00
parent 384904d2fc
commit ff5076c586
1 changed files with 7 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/components/common/Modal.tsx
View File

@ -1,6 +1,6 @@
// import { createStyle } from '@/utils/tools'
import React, { useImperativeHandle, forwardRef, useState, useMemo, useCallback } from 'react'
import { type LayoutChangeEvent, Modal, TouchableWithoutFeedback, View, type ModalProps as _ModalProps, StyleSheet } from 'react-native'
import React, { useImperativeHandle, forwardRef, useState, useMemo } from 'react'
import { Modal, TouchableWithoutFeedback, View, type ModalProps as _ModalProps } from 'react-native'
import StatusBar from './StatusBar'
// import { useDimensions } from '@/utils/hooks'
@ -54,7 +54,6 @@ export default forwardRef<ModalType, ModalProps>(({
...props
}: ModalProps, ref) => {
const [visible, setVisible] = useState(false)
const [height, setHeight] = useState<number>(0)
// const { window: windowSize } = useDimensions()
const handleRequestClose = () => {
if (keyHide) {
@ -69,11 +68,6 @@ export default forwardRef<ModalType, ModalProps>(({
}
}
const handleLayout = useCallback((e: LayoutChangeEvent) => {
// console.log('e.nativeEvent.layout.height', e.nativeEvent.layout.height)
setHeight(e.nativeEvent.layout.height + StatusBar.currentHeight)
}, [])
useImperativeHandle(ref, () => ({
setVisible(_visible) {
if (visible == _visible) return
@ -95,18 +89,12 @@ export default forwardRef<ModalType, ModalProps>(({
{...props}
>
{/* <StatusBar /> */}
<View style={StyleSheet.absoluteFill} onLayout={handleLayout} />
{/* <View style={{ flex: 1, paddingTop: statusBarPadding ? StatusBar.currentHeight : 0 }}> */}
{
height == 0 ? null
: (
<TouchableWithoutFeedback style={{ flex: 1, paddingTop: statusBarPadding ? StatusBar.currentHeight : 0 }} onPress={handleBgClose}>
<View style={{ position: 'absolute', top: 0, left: 0, width: '100%', height, backgroundColor: bgColor }}>
{memoChildren}
</View>
</TouchableWithoutFeedback>
)
}
<TouchableWithoutFeedback style={{ flex: 1, paddingTop: statusBarPadding ? StatusBar.currentHeight : 0 }} onPress={handleBgClose}>
<View style={{ flex: 1, backgroundColor: bgColor }}>
{memoChildren}
</View>
</TouchableWithoutFeedback>
{/* </View> */}
</Modal>
)