我们在做Android移动APP设计的时候,字号的选择也是很让人头疼,转载一份有关Android系统字体规范,如果在做Android项目的用户应该看看,如果有任何建议欢迎在留言处与我们交流探讨。

主要从以下几点做了分析:

  • 移动设计中与字号有关的基本概念
  • Android系统默认字体及字号
  • Android字体单位sp与px的换算
  • 规范字号的意义
  • 印刷业的规范字号的用法
  • Android规范字号的近似用法
  • 如何向前端输出?
  • 如何在photoshop里选择字号?

1. 移动设计中与字号有关的基本概念

  • px:Pixels即像素,基本原色素及其灰度的基本编码。
  • DPI:dots per inch,是印刷上的记量单位,意思是每个英寸上,所能印刷的网点数。
  • PPI:pixels per inch 数字影像的解析度,意思是每英寸所拥有的像素数,即像素密度。
  • PPI = √(长度像素数² + 宽度像素数²) / 屏幕对角线英寸数
  • pt:Point,磅因,国际通行的印刷单位,是一个自然界标准的长度单位。

    inch = 2.54cm = 25.4 mm = 72pt, 1pt≈0.35mm
    Photoshop里的字体单位pt和point不一样。在Photoshop里,同样是10pt的字,只要变换字体,字的高度就会变化。

  • dp:Density-independent pixels,以160PPI屏幕为标准,则1dp=1px
  • dp和px的换算公式 :dp*ppi/160 = px
  • sp:Scale-independent pixels.安卓的字体单位,以160PPI屏幕为标准,当字体大小为 100%时, 1sp=1px
  • sp 与 px 的换算公式:sp*ppi/160 = px

2. Android 系统默认字体 Rotobo,限定使用以下字号

3. Android 字体单位 sp 与 px 的换算

  • PPI = √(长度像素数² + 宽度像素数²) / 屏幕对角线英寸数
  • sp与px的换算公式:sp*ppi/160 = px

以三星Note2为例,PPI = √(1280² + 720²) / 5.5=267

经测量,三星Note2的字体高度确实如此,见下图:

4. 规范字号的意义

保证相同字号的字在不同PPI屏幕上显示的物理高度一致,下面来验证一下。

  • 设定 PPI为 267 时,高度18sp(即 30px)的字的物理高度为 X,则:
    一英寸里的像素数 267 / 一英寸里的毫米数 25.4mm = 30 / X
    X ≈ 2.86mm
  • 设定 PPI为 160 时,高度18sp(即 18px)的字的物理高度为 Y,则:
    一英寸里的像素数 160 / 一英寸里的毫米数 25.4mm = 18 / Y
    Y ≈ 2.86mm

综上,X = Y,这就证明了同为18sp的字在 PPI分别为 267 和 160 时,显示的物理高度都是 2.86mm

5. 印刷业的规范字号的用法

看书的时候眼睛距离书本的最佳距离为 33cm,书本的阅读距离比较接近于手机的阅读距离,所以我们来参考下书本上印刷文字的规范。

印刷业已经有成熟的行业字号标准,如下表所示:

其中正文常用的字号是六号(7.5p)、小五号(9p)、五号(10.5p),如下表所示:

6. Android 规范字号的近似用法

通过计算出 Android规范字号的物理高度,找到每个字号最接近的印刷字号:

再根据印刷字号的用途,近似得出Android 规范字号的用法

7. 如何向前端输出?

第一步:将sp 换算成px。但是px随PPI 变化而变化,这一点可以从sp 与px的换算公式“sp*ppi/160 = px ”看出来。我们不能算出所有的情况,所以只计算首选需要适配的ppi 对应的像素高度。

第二步:把算好的像素高度和换算公式“ sp * ppi/160 = px ”同时输出给前端,这样以后再换ppi,前端可以自动计算。另外,前端代码里定义字体高度用的也是px,所以设计师向前端输出以px计算的字号尺寸是非常合适的。例如:

8. 如何在photoshop里选择字号?

上文中,我们已经算出了字体像素高度,把这些像素高度画到ps 里,
再把你要使用的字体调到这样的像素高度,得出photoshop 里对应的字号,用于设计。也就是说Photoshop 里的字号都需要根据实际情况,手动调出来,没有捷径。例如ppi 为240 时,对应的像素高度和字体字号如下图所示:

如果ppi 变化,上面的图就不能用了,又要重新算,比较劳神费力,但我目前还没有更好的办法,欢迎大家拍砖,我会积极采纳意见,优化方案。

参考文献:
1.Android 设计指南:
http://www.sunjw.us/adchs/style/typography.html

2.维基百科:点(印刷)
http://zh.wikipedia.org/wiki/%E7%82%B9_(%E5%8D%B0%E5%88%B7

3.百度文库《印刷文字的字体与字号规定》
http://wenku.baidu.com/view/c3f12af9aef8941ea76e05f2.html

作者:白群 PDF版本:点击这里

转载请注明:学UI网 » Android系统字体规范(含Android系统字体包下载)

Android系统字体规范相关推荐

  1. 最标准的系统字体规范font-family

    最标准的系统字体规范font-family 注意系统默认字体和浏览器默认字体这个差别. 直接提供方案: font: 14px/1.6 /*西文*/-apple-system,BlinkMacSyste ...

  2. Android系统字体加载流程

    一.背景 视觉同学提了一个需求,要求手机中显示的字体可以支持medium字体,经过分析,android原生的字体库中并没有中文的medium字体,如果使用bold,显示又太粗,为满足需求,需要分析an ...

  3. Android系统字体

    原理: Android手机的字体库在/system/fonts下,取得root权限以后,只要把对应的字体文件替换即可.其中DroidSansFallback.ttf为中文字体:DroidSans.tt ...

  4. android获取系统使用的字体,android - 我如何获取已安装的Android系统字体列表并将其应用于自定义键盘 - 堆栈内存溢出...

    加载系统字体的文件管理器类 public class FontManager { // This function enumerates all fonts on Android system and ...

  5. 修改android系统 字体

    Android系统的字体文件路径为手机存储\system\font 其中三个字体文件分别对应的字体如下: 1.DroidSans.ttf 系统默认英文字体 2.DroidSans-Bold.ttf 系 ...

  6. ios、android 系统字体说明

    后来了解到的手机系统 ios.android 等是不支持微软雅黑字体,为了满足产品的需要,保证视觉稿的还原度,手机端是如何定义微软雅黑字体呢? 相信大家会想到 @font-face 定义为微软雅黑字体 ...

  7. android字体有些显示不正常显示,android系统字体调到超大后显示不全

    昨天遇着这样一个Bug,系统设置里把字体设置为超大后并切换为英文模式下,程序中的字体便显示不全. 在这里总结一下,常用解决解决办法有两个: 一.在xml文件里设置字体: 把字体大小从textSize= ...

  8. android改变整个app字体大小,Android系统字体大小如何影响app的字体大小?

    在Android应用开发过程中,一定会碰到本来完美的布局,在系统字体大小设置[最大]时变成一团浆糊.解决办法网上也有很多,但是分析原理的却几乎没看到.博主在碰到问题的第一时间也是直接用了网上的方法,即 ...

  9. 替换android系统字体颜色,Android替换系统字体

    1.引言 最近老大安排一个任务,让我看看android 字体这块,将我们产品中的字体替换下.花了1.2天看懂,还得写篇文章,教程在组内进行分享.这次算是我进军Android系统的第一步.这篇文章基于A ...

最新文章

  1. JNI之C语言简单回顾
  2. 止欲知足,为获得幸福生活的根本法则之一
  3. MySQL列类型之——数值类型
  4. 突破asp过滤系统入侵网站
  5. c# define 类似_c#跟c++的相似之处
  6. 阿里云OS和Android之争100问
  7. 弹出框(bootStrap模态框、bootbox、dbailog)
  8. 你应该懂得的关于电脑配置冷知识
  9. JDBC操作MYSQL数据库
  10. 【PB】动态报表格式自由定义的实现
  11. 如何有效地执行代码审查_使用这些有效的代码审查指南创建合理的办公环境
  12. 研究生毕业后工资高多少?
  13. 计算机相关知识分享,计算机基础知识论文分享
  14. libxml2 安装使用
  15. Delphi中打开网页连接的几种方法
  16. 计算机word宏,Word用宏来列出所有可用样式-word技巧-电脑技巧收藏家
  17. ps绘制android手机界面界面,教程·Photoshop | 手机界面效果图展示设计
  18. 如何通过CDN加速网站的访问?
  19. [转]鸡头,风尾,如何抉择,年终前跳槽的思考
  20. 数据访问接口功能及含义

热门文章

  1. 65——基于岩渣与参数信息融合的 TBM 掘进围岩识别预警方法研究
  2. 【观察】西部数据:以技术创新不断突破边界,驱动数据中心驶入快车道
  3. 最新转转交易猫闲鱼后台源码+带视频教程亲测
  4. Arcgis出图时提示未能加载文件或程序集stdole, Version=7.0.3300.0错误
  5. 计算机学院保研方法,南京理工大学计算机科学与工程学院软件工程方法保研
  6. 百趣代谢组学分享:黑木耳多糖对小鼠肠道微生物及代谢表型的影响
  7. distinct之后,如何查询所有字段
  8. matlab做copula,Copula理论及MATLAB应用实例
  9. 升级到游戏设计师攻略之—— 用游戏编辑器制作MOD脱颖而出
  10. [Java故障排除指南- JDK11-学习笔记]-4-诊断工具之使用JConsole 工具进行故障排除