Skip to content

Commit 3d4c49f

Browse files
feat: Add rows prop to TextInput component
1 parent 32af9e6 commit 3d4c49f

File tree

2 files changed

+20
-2
lines changed

2 files changed

+20
-2
lines changed

Libraries/Components/TextInput/TextInput.js

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -452,6 +452,13 @@ type AndroidProps = $ReadOnly<{|
452452
*/
453453
returnKeyLabel?: ?string,
454454

455+
/**
456+
* Sets the number of rows for a `TextInput`. Use it with multiline set to
457+
* `true` to be able to fill the lines.
458+
* @platform android
459+
*/
460+
rows?: ?number,
461+
455462
/**
456463
* When `false`, it will prevent the soft keyboard from showing when the field is focused.
457464
* Defaults to `true`.
@@ -1349,6 +1356,7 @@ function InternalTextInput(props: Props): React.Node {
13491356
disableFullscreenUI={props.disableFullscreenUI}
13501357
focusable={focusable}
13511358
mostRecentEventCount={mostRecentEventCount}
1359+
numberOfLines={props.rows ?? props.numberOfLines}
13521360
onBlur={_onBlur}
13531361
onChange={_onChange}
13541362
onFocus={_onFocus}

packages/rn-tester/js/examples/TextInput/TextInputExample.android.js

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -356,12 +356,22 @@ exports.examples = ([
356356
<TextInput
357357
numberOfLines={2}
358358
multiline={true}
359-
placeholder="Two line input"
359+
placeholder="Two line input using numberOfLines prop"
360360
/>
361361
<TextInput
362362
numberOfLines={5}
363363
multiline={true}
364-
placeholder="Five line input"
364+
placeholder="Five line input using numberOfLines prop"
365+
/>
366+
<TextInput
367+
rows={2}
368+
multiline={true}
369+
placeholder="Two line input using rows prop"
370+
/>
371+
<TextInput
372+
rows={5}
373+
multiline={true}
374+
placeholder="Five line input using rows prop"
365375
/>
366376
</View>
367377
);

0 commit comments

Comments
 (0)