Skip to content

Commit 38aa705

Browse files
Add lineHeight baseline example to RN Tester
Repro for facebook#39145. Renders a single-line and a multi-line TextInput with fontSize: 16 / lineHeight: 32. Without the fix in the follow-up commits, both placeholder and typed glyphs render too low.
1 parent 56129fe commit 38aa705

1 file changed

Lines changed: 27 additions & 0 deletions

File tree

packages/rn-tester/js/examples/TextInput/TextInputSharedExamples.js

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1188,6 +1188,33 @@ module.exports = [
11881188
name: 'textStyles',
11891189
render: () => <TextStylesExample />,
11901190
},
1191+
{
1192+
title: 'lineHeight baseline',
1193+
name: 'lineHeightBaseline',
1194+
render: function (): React.Node {
1195+
const inputStyle = {
1196+
fontSize: 16,
1197+
lineHeight: 32,
1198+
borderColor: '#ccc',
1199+
borderWidth: 1,
1200+
padding: 8,
1201+
};
1202+
return (
1203+
<View>
1204+
<WithLabel label="single-line">
1205+
<ExampleTextInput placeholder="placeholder" style={inputStyle} />
1206+
</WithLabel>
1207+
<WithLabel label="multi-line">
1208+
<ExampleTextInput
1209+
multiline
1210+
placeholder="placeholder"
1211+
style={inputStyle}
1212+
/>
1213+
</WithLabel>
1214+
</View>
1215+
);
1216+
},
1217+
},
11911218
{
11921219
title: 'showSoftInputOnFocus',
11931220
render: function (): React.Node {

0 commit comments

Comments
 (0)