关于RN lineHeight的一些问题

当使用Text组件时,难免会使用lineHeight这个样式,但是在ios端,当中文和英文数字混排的时候,字符不在同一个基线上,效果如下:

这是加行高的:


加行高

这是不加行高的:


不加行高

是不是觉得加了行高的丑的不行。

其实这是RN的一个bug,据说解决这个bug已经提上日程了。但是当前,至少在0.55.4版本还是需要我们手动解决的。

如何解决呢?

经过多方查找,其实解决方法很简单,只要在style里加一句话就好了:

fontFamily: 'PingFangSC-Regular'

是的,你没看错,就这一句,当然你还可以有很多选择:

苹方 - 简常规体:PingFangSC-Regular 

苹方 - 简极细体:PingFangSC-Ultralight 

苹方 - 简细体:PingFangSC-Light 

苹方 - 简纤细体:PingFangSC-瘦

苹方 - 简中黑体:PingFangSC-中

苹方 - 简中体:PingFangSC-Semibold

想用哪个用哪个~

这样就可以解决在ios端因使用lineHeight而导致基线不一致的问题了!

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1、通过CocoaPods安装项目名称项目信息 AFNetworking网络请求组件 FMDB本地数据库组件 SD...
    阳明AI阅读 16,038评论 3 119
  • 觉察日记 事实:万能的朋友圈啊,今天因为我的一条信息,被表姐看到,她得知我们都在浦东,然后我们分别27年后重逢,说...
    正敏阅读 2,939评论 0 3
  • 作者简介:瑞秋张:曾经的IT项目经理,现在的全职妈妈。喜欢谈育儿经,喜欢写故事,喜欢画彩铅,更喜欢听你们的故事。想...
    瑞秋张阅读 4,106评论 2 7