android - Material Design 排版 - 标题、标题、间距、文本外观

Question

我一直在遵循有关排版的 Google 官方 Material 设计指南 (http://www.google.com/design/spec/style/typography.html)，但我发现它们非常缺乏。例如，他们列出了 10 种样式，您应该用于正文、副标题、标题、标题 display1、display2 等。在您的应用程序中键入文本……这将我引向了第一个问题。

问题#1:如何知道“副标题”是什么，或者“标题”与“标题”，或者什么时候应该使用“display1”而不是“display4”，这些项目有标准吗？

此外，指导方针规定前导空格应内置于文本的行高中。因此，问题2。

问题 2#:如何在 Android 中为文本添加“前导”空间，这是相关的 Android 指南吗？

问题 #3:虽然我下载了最新版本的 Roboto，但我的中等字体看起来绝对粗体，与谷歌优雅且稍厚的中等字体相反，我如何确认我的字体实际上与谷歌不同？

非常感谢

Answer 1

“给我看代码”:不是我的，但请参阅下面的评论以获取一个选项，以及 Plaid 应用程序 (Butcher) 如何通过访问 Github 上的源(BaselineGridTextView 类)来应对排版挑战。

免责声明:我绝不是这个主题的引用，但你的问题已经有一个月了，没有任何答案，尽管它很重要，而且它的重要性只会从现在开始增长。话虽如此，但由于可能存在的错误，我至少会尝试给予一些启发并提供我的头。

Problem #1: How does one know what a "subhead" is, or a "title" vs "headline", or when should "display1" be used as opposed to "display4", are there standards for these items?

这些是常见的、标准化的、抽象的文本实体，它们来自打印出版的传统。

显示器 :大文本，通常用于标语牌、有吸引力的口号、需要和争夺注意力的东西，当用户不注意时应该引起注意。它的可读性较差，正是因为它应该很短(立即引起注意，而不是大量流程的一部分)。我想 Material Design 中的 4 种不同显示尺寸只是 Matias 和他的团队格外小心，但我怀疑应用程序永远不会使用超过 1 种显示尺寸(也许是杂志和富媒体应用程序)。大多数应用程序甚至根本不会使用显示大小。

标题 : 传统上，我相信，如果我对这个主题的浅薄理解是正确的，标题大小被用作short taglines的故事。不是描述，只是标语，一条短消息。标题的一个例子:刺客杀死肯尼迪。在遵循 Material Design 的常见应用中，它被用作 main subject of a screen (just like pages of a newspaper) .我认为(因为不确定)这在其他地方可能被称为“标题”。

标题 : 老实说，它非常通用，而且由于其尺寸适中(与标题和显示相比)，它是我使用最多的样式之一:它在文本块上方的位置非常有用。例如，“Eula”作为紧跟在此标题之后的 eula 文本的标题，或紧接在作者列表之前的“Authors”。是widely used in the framework as well .

副标题:这是更具体的。它是“标题”的直接、次等程度，用于提供摘录、引述或对紧随其后的文本块的简要说明。副标题示例(遵循标题示例):德克萨斯州州长受伤，马克思主义者被指控谋杀。在 Material Design 中，由于尺寸的原因，the most common place I've seen it used in is in a two item list item ，正是因为它被用作电子邮件的摘录(提供概述)或用作电话号码(电话列表中特定人员最重要 Assets 的详细信息)。

正文 : 正文。很明显。其中最易读的，也是长文本的唯一选择。

字幕 : 脚注和小文字。在打印品中，它被广泛用作图像的标题。在 Holo 中，我认为(不确定)它被用作分隔 rune 本(但全部大写)。在 Material Design 中，我认为分隔线不再使用标题文本，而是使用浅色的“主体”。

其他程序使用这些(部分或全部)概念本身，但略有不同:

文本处理器的文本样式；

Photoshop、Illustrator等图像软件中的字体设置。

字体的光学大小。例如，Adobe 使用 “caption”, “regular”, “subhead” and “display” ，正如您所看到的，它旨在通过专门针对不同大小跨度量身定制的字体形状来补充大小和引导；

一般概念似乎是这些是代表文本集中重要性梯度的抽象实体，并且只要在出版物、主题、应用程序等中一致使用，就可以在出版物之间具有灵活的规则。

Problem 2#: How can I add "leading" space for text in Android,

这适用于你混的地方 TextView s 具有不同的风格，如 image example (当然也可以使用文本跨度)。

老实说:现在，出于紧急目的，我正在使用我的眼睛 superimposed grids检查我的领先。我从前导大小开始，然后减去以下文本行的字体大小和一些作为当前行的下行部分的少量字体大小。然后，如果需要，我会进行微小的光学调整。如果这些元素(x 高度、大写高度、下降器等) could be calculated exactly 就好了，但老实说我还没有深入研究这个(但它可能是可能的)。我对我的“eyeometer”很满意，虽然我在布局中没有完善 MD。

然而，我只是看了这个(没有尝试过)，我相信你可以深入 FontMetrics ，测量场并在两者之间即时应用适当的尺寸 TextView s 如上所示。我会先尝试(下一个 ascent 和上一个 descent)。

is this relevant Android guidance?

是的。非常。当它们具有不同的样式时，将文本放在另一个文本下方。就像标题后跟正文一样，并尝试进行疯狂的猜测:它不会起作用，并且您的应用程序将与系统不一致。看上面。

Problem #3: Although I've downloaded the latest version of Roboto, my medium fonts look absolutely bold, as opposed to Google's elegant and slightly thicker medium fonts, how can I confirm my font is actually different than Googles?

请告诉我们在哪里 正好你得到两个样本进行比较。字体渲染可能会受到许多不同因素的影响，除了许多其他因素之外，每个系统都使用自己的提示算法。即使在不同的 Roboto 版本和不同的 Android 版本之间也存在细微的差异。与常规相比，中等看起来“大胆”，但实际上并不大胆。

您可以在 中查看字体sdk/platforms/android-APIVERSION/data/fonts 文件夹。使用 Ubuntu 15.04(轻微提示)渲染，开箱即用，截至 android-22 :













我认为它与 sample 保持一致.

与也广泛使用的东西相比，这是(部分) Ubuntu font family (分别为常规、中等和粗体)。在我看来，媒体也比常规更接近大胆:







Minion Pro (常规、中等、半和粗体)。它的权重更均匀，可能是因为它还提供半粗体变体，但我们谈论的是专为精美打印而制作的衬线字体，并且在市场上有更多的时间来不断改进:









我希望这有帮助。