RN 去掉Text组件文本的内边距

1. 我在写适配的时候,发现网上写的文章,都不管用,我开始怀疑肯定自己这出了问题,后面发现,不写适配应该可以。那么写出来的效果跟UI设计图不一样是为什么呢,我给了一个文字背景颜色,发现上下有大块留白,我虽然在学校学过Android,做过Android的小demo,可是如果不把作品当商品去做,就很难发现细节有问题。 下面就是效果图片

尝试解决,RN 的Text属性中有  includeFontPadding 属性设置为false , 效果嘛,确实消除了一部分,但上下内边距还是有剩余。下面是效果图

 

解释为什么有“剩余内边距”:先上一张图

上图中top 和 bottom之间的高度就是文字默认高度,当设置includeFontPadding:false时,只是去掉了,top与ascent 和 bottom与descent之间的距离,剩余部分就是让人难受的地方了,参考原生Android方法,别人都是自定义装文本组件,我目前解决不了

=》自定义组件我不行,那就想其它损招呗
考虑到字体大小不同,也会有大小不一样的“空白部分”,所以如果确定字体大小,通过设置marginTop的负值,将留白部分“抵消掉”,我只能这么干

参考博客:
https://blog.csdn.net/jiye111/article/details/99679269
https://blog.csdn.net/harvic880925/article/details/50423762 (启舰大佬)

 

原文地址:https://www.cnblogs.com/tengyuxin/p/11916851.html