了解React Native中的默认字体大小 [英] Understanding default font sizes in React Native

查看:458
本文介绍了了解React Native中的默认字体大小的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

过去几个月来我一直在开发React Native应用,而我一直想逃脱现实,这始终使我感到有些困惑.我试图标准化我应用程序中的字体大小(用于正文,标题等),并且努力了解React Native从何处获取其默认字体大小.我已经在运行iOS 11的iPhone 8模拟器中进行了测试,通过实验得出的结论是,显示的默认字体为14个逻辑像素(如在没有样式的全新元素中).但是,查看 iOS样式指南似乎iOS上的默认正文文本应为17pt.尽管我对设备缩放比例一无所知,但我尝试处理每个能找到的在线转换器中的数字,并且无法得出17pt如何接近14个逻辑像素(假设RN使用 body 字体大小).我能够大致翻译两者的唯一方法是DPI大约为90,但是iPhone的DPI高很多,很多.那么,有谁能提供关于在React Native中如何选择默认字体的见解?即使搜寻源代码,我也找不到很多.我希望自己能够计算基本大小,以便可以根据需要缩放其他字体大小.预先感谢!

I've been working on a React Native app for the past few months, and something has always eluded me that I'm just now trying to get to the bottom of. I'm trying to standardize the font sizes within my app (for body, headers, etc.) and am struggling to understand where exactly React Native gets its default font size from. I've been testing in an iPhone 8 simulator running iOS 11, and through experimentation have come to the conclusion the default font displayed is 14 logical pixels (as in a brand-new element with no styling). However, checking the iOS style guidelines it would seem the default body text on iOS is intended to be 17pt. Although I don't a ton about device scaling, I've tried crunching the numbers in every online converter I could find, and could not come up with how 17pt may come close to 14 logical pixels (assuming RN uses the body font size by default). The only way I was able to roughly translate the two was if the DPI was around 90, but the DPI for iPhones is much, much higher. So might anyone be able to offer insight as to how default fonts are selected in React Native? Even hunting through the source code I couldn't find much. I'd like to be able to calculate the base size myself so I can scale the other font sizes according. Thanks in advance!

推荐答案

我建议您看看反应本机元素的辅助方法 normalizeText .它计算像素比率,并相应地设置文本fontSize.

I suggest you to look at react-native-element's helper method normalizeText. It calculates the pixel ratio and set the texts fontSize accordingly.

此外,您还应该考虑iOS中的辅助功能文本大小选项".此选项将影响您的所有应用程序.

Also you should also take in consideration of Accessibility Text Size Option in iOS. This option will be affecting all your app.

这篇关于了解React Native中的默认字体大小的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆