callstack / callstack/react-native-paper

Multiline TextInput label is not visible in flat mode

未关闭
#4,756 2 条评论 3 个 reaction 已指派 0 人 在 GitHub 查看
bug
主要语言
TypeScript
星标
14.5k
派生
2.2k
平均合并
5 天 23 小时
30 天内合并 PR
12

描述

## Bug Report Template

**Current Behaviour**
When focusing into a TextInput, in when `mode="flat"`, the label disappears. The label displays correctly when `multiline=false`, and this issue only occurs on iOS. This occured in the latest version (5.14.5), and also in 5.14.1.

Also, it seems like some letters like letter "i" in this "Uwagi" word is also cut by the same overlay.

**Expected Behaviour**
The label should be scaled down and visible as usual when the TextInput is focused, regardless of multiline setting or platform.

**How to Reproduce**

1. Use react-native-paper version 5.14.5.
2. Render a TextInput, with following settings on iOS.
- mode = "flat"
- mutliline = true
- label = "I am test field"
``
5. Focus the TextInput.
6. Observe that the label disappears.

_Screenshots:_

Screenshot 2024-08-21 at 14 10 38

Screenshot 2024-08-21 at 14 10 44

The "i" cut in "Uwagi" word,

![Image](https://github.com/user-attachments/assets/09a85913-0475-4256-84cf-455c1177380f)

**What Have You Tried So Far?**
I tried doing the same thing [as he did](https://github.com/callstack/react-native-paper/issues/4482), but it is not working.

### Your Environment

| software | version
| --------------------- | -------
| ios | 18.4
| android | x
| react-native | 0.79.2
| react-native-paper | 5.14.5
| node | 22
| npm or yarn | pnpm
| expo sdk | 53

贡献指南

打开贡献指南

调研方向

首先,在 iOS 上使用 mode="flat" 和 multiline,通过 React Native Paper 的 TextInput 入口复现该问题,然后将聚焦时的标签行为与 multiline=false 进行比较。为 iOS multiline flat-mode 情况添加回归测试;完成标准是缩放后的标签保持可见,并且聚焦时字母不会被裁剪。

由索引模型根据 Issue 内容生成。

评估

技术栈
react-native
领域
mobile
Issue 类型
缺陷
难度
3/5
预计耗时
1-2 天
活跃度
停滞
描述清晰度
描述清楚
新手友好度
48/100

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。