callstack / callstack/react-native-paper
TextInput's text cropped by its borders
- 主要语言
- TypeScript
- 星标
- 14.5k
- 派生
- 2.2k
- 平均合并
- 5 天 23 小时
- 30 天内合并 PR
- 12
描述
### Current behaviour
Text input's text is cropped by its borders as you can see on screenshots. It's seems like an unexpected behaviour because it also affect react-native-paper-dates library inputs. Problem only affects android version. Also you can see very tall margin bottom in text inputs.
### Expected behaviour
Text input text is displaying properly.
### How to reproduce?
```
input: {
fontSize: 56,
textAlign: 'center',
minWidth: 102,
},
```
I improved it someway by providing padding and to the input.
```
input: {
fontSize: 56,
textAlign: 'center',
paddingTop: Platform.OS === 'ios' ? 0 : 8,
minWidth: 102,
height: 72,
},
```
As you can see on screenshot #2, it looks acceptable.
But I can't do the same to library's components, and it is also very inconvient.
Here's my theme config:
```
const {theme} = useMaterial3Theme({fallbackSourceColor: '#6750A4'});
const {LightTheme, DarkTheme} = adaptNavigationTheme({
reactNavigationLight: NavigationDefaultTheme,
reactNavigationDark: NavigationDarkTheme,
});
const CombinedDefaultTheme = merge(LightTheme, {
...MD3LightTheme,
colors: theme.light,
});
const CombinedDarkTheme = merge(DarkTheme, {
...MD3DarkTheme,
colors: theme.dark,
});
```
### Preview





### What have you tried so far?
I addition to styling input, i tried to change font settings of my app to Sans-serif and Roboto (it's seems like it's a default font on my phone). But it doesn't help too.
### Your Environment
| software | version
| ------------------------| -------
| android | 12
| react-native | 0.71.7
| react-native-paper | ^5.7.0
| node | 16.16.0
| npm | 8.11.0
| expo sdk | ^48.0.0
贡献指南
调研方向
首先,使用提供的 TextInput 示例在 Android 12 上复现该问题,使用 react-native-paper 5.7.0 和所示的样式。检查 TextInput 的实现以及 Android 特定的渲染或布局行为,然后验证大字号文本不再被裁剪,并且过大的底部边距已得到解决,无需修改 consumer 端的 padding。
由索引模型根据 Issue 内容生成。
评估
- 技术栈
- android, react-native
- 领域
- frontend, mobile
- Issue 类型
- 缺陷
- 难度
- 3/5
- 预计耗时
- 1-2 天
- 活跃度
- 停滞
- 描述清晰度
- 基本清楚
- 新手友好度
- 35/100