callstack / callstack/react-native-paper

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

Ouverte
#4,218 17 commentaires 3 réactions 0 personnes assignées Voir sur GitHub
bug Modal
Langage dominant
TypeScript
Étoiles
14.5k
Forks
2.2k
Merge moyen
5 j 23 h
PR mergées (30 j)
12

Description

### 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

Guide de contribution

Ouvrir le guide de contribution

Piste de recherche

Reproduisez le problème avec un React Native Paper Modal dans un Portal sur un appareil iOS, en suivant les quatre étapes du rapport. Comparez le comportement sur iOS avec celui d’Android et avec le workaround abordé dans issue 2172. Le travail est considéré comme terminé lorsque le Modal se déplace pour laisser la place au clavier à l’écran lorsqu’il y a suffisamment d’espace, sans régression du comportement sur le web ou Android.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Évaluation

Stack technique
react-native, typescript
Domaine
mobile
Type d'issue
Bug
Difficulté
3/5
Temps estimé
1-2 jours
Activité
Calme
Clarté
Plutôt claire
Accessibilité débutants
55/100

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.