React-native: lineHeight styling doesn't impact multiline TextInput

[florianpeninon]

Description

lineHeight styling doesn't impact TextInput when multiline is set to true

Reproduction Steps and Sample Code

<TextInput
    multiline={true}
    style={{
        lineHeight: fontLineHeight,
    }}
/>

Additional Information

• React Native version: 0.44.0
• Platform: iOS (didn't test on Android)

[florianpeninon]

@shergin thanks for taking care of that 👍

[Amaros90]

I'm encountering this issue on iOS, but not on Android

[hramos]

Hi there! This issue is being closed because it has been inactive for a while. Maybe the issue has been fixed in a recent release, or perhaps it is not affecting a lot of people. Either way, we're automatically closing issues after a period of inactivity. Please do not take it personally!

If you think this issue should definitely remain open, please let us know. The following information is helpful when it comes to determining if the issue should be re-opened:

• Does the issue still reproduce on the latest release candidate? Post a comment with the version you tested.
• If so, is there any information missing from the bug report? Post a comment with all the information required by the issue template.
• Is there a pull request that addresses this issue? Post a comment with the PR number so we can follow up.

If you would like to work on a patch to fix the issue, contributions are very welcome! Read through the contribution guide, and feel free to hop into #react-native if you need help planning your contribution.

[shergin]

I still plan to fix this. 😄

[pie6k]

Any update? I'm writing kind of WYSIWYG editor, and my approach is that I'm creating 'fake' elements that imitate whats inside text edit with styles. Thats why I need very solid control over line height.

[statelo]

Still having this issue though :(((

[steobrien]

In advance of a real fix here, any suggestions to work around?

[drpiou]

Same here with RN 0.51.

[shergin]

It should be fixed in master now! Can anybody confirm?

[chrystal-lyu]

@shergin Still seems not fixed for 0.53, correct me if I'm using it wrong

screenshot:

code:

      <View style={styles.container}>
        <Text
          style={{
            lineHeight: 40,
            borderWidth: 1,
            marginBottom: 10
          }}
        >Hi there! This issue is being closed because it has been inactive for a while. Maybe the issue has been fixed in a recent release, or perhaps it is not affecting a lot of people. Either way, we're automatically closing issues after a period of inactivity. Please do not take it personally!</Text>
        <TextInput multiline placeholder='placeholder'
          style={{
            lineHeight: 40,
            borderWidth: 1,
            width: width - 10,
            backgroundColor: 'pink'
          }}
        />
      </View>

[steobrien]

@shergin Yes! I've tested my app out on latest React Native master, and I can confirm this is fixed. Thank you 🙌

Note to others: not fixed in any React Native releases yet including 0.53.

[hramos]

Fixed in master.

[ArsenyYankovsky]

Are you sure this is fixed? Getting this using 0.57 and iOS:

  storyText: {
    fontSize: 18,
    marginTop: 18,
    fontFamily: 'noto-sans',
    color: '#444',
    lineHeight: 1000,
    textAlign: 'left',
    backgroundColor: '#fff',
  },

        <TextInput
          style={styles.storyText}
          multiline={true}
          keyboardType="default"
          placeholder="Your Message"
        />

[hramos]

@ArsenyYankovsky can you verify 0.58.0-rc and open a new issue if it's reproducing there?

[martinchristov]

Issue persists on RN 0.57.7

[hramos]

@martinchristov can you verify 0.58-rc and open a new issue if it's not resolved in the RC?