callstack / callstack/react-native-paper

Modals on iOS do not respond to the presence of the on-screen keyboard

Abierto
#4,218 17 comentarios 3 reacciones 0 asignados Ver en GitHub
bug Modal
Lenguaje dominante
TypeScript
Estrellas
14.5k
Forks
2.2k
Merge medio
5 d 23 h
PR fusionados (30 d)
12

Descripción

### Current behaviour
On web and Android, the Modal component respects the state of the keyboard, adjusting it's height accordingly. On iOS, however, the Modal does not move up when the keyboard is opened.

This issue is likely related to [2172](https://github.com/callstack/react-native-paper/issues/2172)

### Expected behaviour
The Modal component should respect the positions of the keyboard and respond accordingly on all platforms.

### How to reproduce?
1. Add a Modal component inside a Portal component.
2. Add content to the Modal component and open the Modal.
3. Open the device on-screen keyboard on an iOS device.
4. Notice how the Modal doesn't respond (move up) to accommodate the keyboard, even though there is empty space available above the modal.

### Preview
iOS:
![image](https://github.com/callstack/react-native-paper/assets/25905330/ba086873-7684-4754-924c-d3992e5f7690)

Android:
![image](https://github.com/callstack/react-native-paper/assets/25905330/91c79e81-6c68-4bb4-b7e8-dd6682963bde)

### What have you tried so far?
We're currently following the workaround listed [here](https://github.com/callstack/react-native-paper/issues/2172#issuecomment-725769818).

### Your Environment

| software | version
| --------------------- | -------
| ios | x
| android | x
| react-native | 0.71.14
| react-native-paper | 5.11.2
| node | 20.9.0
| npm or yarn | 10.1.0
| expo sdk | 48.0.20

Guía de contribución

Abrir la guía de contribución

Línea de trabajo

Reproduce the issue with a React Native Paper Modal inside a Portal on an iOS device, following the four steps in the report. Compare the iOS behavior with Android and the workaround discussed in issue 2172. Done means the Modal moves to accommodate the on-screen keyboard when space is available, without regressing web or Android behavior.

Escrito por el modelo de indexación a partir del texto del issue.

Evaluación

Stack tecnológico
react-native, typescript
Área
mobile
Tipo de issue
Error
Dificultad
3/5
Tiempo estimado
1-2 días
Estado de actividad
Tranquilo
Claridad
Bastante claro
Aptitud para principiantes
55/100

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.