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

修复弹出框被键盘遮挡的问题

Browse Source
This commit is contained in:
lyswhut 2021-05-30 15:37:34 +08:00
parent 009a9c5e03
commit 20daea8e71
2 changed files with 7 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/common/Dialog.js
View File

@ -4,6 +4,7 @@ import { StyleSheet, View, Text, TouchableHighlight } from 'react-native'
import Modal from './Modal'
import Icon from './Icon'
import { useGetter } from '@/store'
import { useKeyboard } from '@/utils/hooks'
const styles = StyleSheet.create({
centeredView: {
@ -65,12 +66,13 @@ export default ({
children,
}) => {
const theme = useGetter('common', 'theme')
const { keyboardShown, keyboardHeight } = useKeyboard()
const closeBtnComponent = useMemo(() => closeBtn ? <TouchableHighlight style={styles.closeBtn} underlayColor={theme.secondary_5} onPress={hideDialog}><Icon name="close" style={{ color: theme.secondary40, fontSize: 10 }} /></TouchableHighlight> : null, [closeBtn, hideDialog, theme])
return (
<Modal visible={visible} hideModal={hideDialog} keyHide={keyHide} bgHide={bgHide}>
<View style={{ ...styles.centeredView }}>
<View style={{ ...styles.centeredView, paddingBottom: keyboardShown ? keyboardHeight : 0 }}>
<View style={styles.modalView} onStartShouldSetResponder={() => true}>
<View style={{ ...styles.header, backgroundColor: theme.secondary }}>
<Text style={{ ...styles.title, color: theme.primary }} numberOfLines={1}>{title}</Text>

8
src/utils/hooks/useKeyboard.js
View File

@ -16,12 +16,12 @@ export default () => {
}
useEffect(() => {
Keyboard.addListener('keyboardDidShow', handleKeyboardDidShow)
Keyboard.addListener('keyboardDidHide', handleKeyboardDidHide)
const keyboardDidShow = Keyboard.addListener('keyboardDidShow', handleKeyboardDidShow)
const keyboardDidHide = Keyboard.addListener('keyboardDidHide', handleKeyboardDidHide)
return () => {
Keyboard.removeListener('keyboardDidShow', handleKeyboardDidShow)
Keyboard.removeListener('keyboardDidHide', handleKeyboardDidHide)
keyboardDidShow.remove()
keyboardDidHide.remove()
}
}, [])