callstack / callstack/react-native-paper

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

オープン
#4,218 コメント 17 件 リアクション 3 件 担当者 0 名 GitHub で見る
bug Modal
主要言語
TypeScript
スター
14.5k
フォーク
2.2k
平均マージ
5日 23時間
マージ済み PR(30日)
12

説明

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

コントリビューションガイド

コントリビューションガイドを開く

調査の方向性

iOS デバイス上で Portal 内に配置した React Native Paper Modal を使って、報告にある 4 つの手順に従い問題を再現します。iOS の動作を Android および issue 2172 で議論されている workaround と比較します。十分な空きがある場合に、画面上のキーボードに合わせて Modal が移動し、web や Android の動作を後退させないことを完了条件とします。

索引モデルが issue の本文から書いたものです。

評価

技術スタック
react-native, typescript
領域
mobile
issue の種類
バグ
難易度
3/5
見積もり時間
1〜2日
活発さ
静か
明瞭さ
おおむね明確
初心者へのやさしさ
55/100

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。