Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

iOSUIKit will cut the bottom of Text if contains Chinese characters #29

Open
peteroid opened this issue Apr 29, 2019 · 0 comments
Open

Comments

@peteroid
Copy link

The bottom of texts seem to be cut out on Android using iOSUIKit if the texts contain Chinese characters. You may refer to the part A of the screenshot.

I have also tested out with different line heights to get workaround. You may refer to part B for the result.

Environment

  • One plus 6T / Android 9
  • react-native: 0.59.5
  • react-native-typography: 1.4.0

Here is my code for the screenshot.

          <View style={{ marginBottom: 20 }}>
            {/* Part A */}
            <Text style={{ color: '#000' }}>{'Android使用\nnone style (Mg排版)'}</Text>
            <Text style={[material.title]}>{'Android使用\nmaterial.title (Mg排版)'}</Text>
            <Text style={[iOSUIKit.title3, {  }]}>{'Android使用\niOSUIKit.title3 (Mg排版)'}</Text>
            <Text style={[iOSUIKit.body, {  }]}>{'Android使用\niOSUIKit.body (Mg排版)'}</Text>
            <Text style={[iOSUIKit.callout, {  }]}>{'Android使用\niOSUIKit.callout (Mg排版)'}</Text>
            <Text style={[iOSUIKit.subhead, {  }]}>{'Android使用\niOSUIKit.subhead (Mg排版)'}</Text>
            <Text style={[iOSUIKit.footnote, {  }]}>{'Android使用\niOSUIKit.footnote (Mg排版)'}</Text>
            <Text style={[iOSUIKit.caption2, {  }]}>{'Android使用\niOSUIKit.caption2 (Mg排版)'}</Text>
          </View>
          <View>
            {/* Part B */}
            <Text style={{ color: '#000' }}>{'Android使用\nnone style (Mg排版)'}</Text>
            <Text style={[material.title]}>{'Android使用\nmaterial.title (Mg排版)'}</Text>
            <Text style={[iOSUIKit.title3, { lineHeight: iOSUIKit.title3.lineHeight + 2 }]}>{'Android使用\niOSUIKit.title3 (Mg排版)'}</Text>
            <Text style={[iOSUIKit.body, { lineHeight: iOSUIKit.body.lineHeight + 1 }]}>{'Android使用\niOSUIKit.body (Mg排版)'}</Text>
            <Text style={[iOSUIKit.callout, { lineHeight: iOSUIKit.callout.lineHeight + 1 }]}>{'Android使用\niOSUIKit.callout (Mg排版)'}</Text>
            <Text style={[iOSUIKit.subhead, { lineHeight: iOSUIKit.subhead.lineHeight + 1 }]}>{'Android使用\niOSUIKit.subhead (Mg排版)'}</Text>
            <Text style={[iOSUIKit.footnote, { lineHeight: iOSUIKit.footnote.lineHeight + 1 }]}>{'Android使用\niOSUIKit.footnote (Mg排版)'}</Text>
            <Text style={[iOSUIKit.caption2, { lineHeight: iOSUIKit.caption2.lineHeight + 2 }]}>{'Android使用\niOSUIKit.caption2 (Mg排版)'}</Text>
          </View>

Screenshot_20190429-105823

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants