Типография дизайна материалов - заголовки, заголовки, интервал, текстовое оформление

Ответ 1

"Покажи мне код": не мой, но см. комментарий ниже для одного варианта, а также то, как приложение Plaid (Butcher) применило проблемы типографии, посетив его источник в Github (BaselineGridTextView class).

Отказ от ответственности: я отнюдь не ссылка на эту тему, но ваш вопрос - месяц без ответов, хотя это важно, и его значение будет только расти с этого момента. Тем не менее, я постараюсь, по крайней мере, дать немного света и предложить свою голову из-за возможных ошибок.

Проблема №1: Как узнать, что такое "подзаголовок", или "заголовок" против "заголовка", или когда следует использовать "display1", а не "display4", существуют ли стандарты для этих элементов?

Это обычные, стандартизованные абстрактные текстовые объекты, которые пришли к нам из традиций печатной публикации.

• Дисплей: большой текст, обычно используемый на плакатах, привлекательные лозунги, вещи, которые требуют и конкурируют за внимание, которые должны привлекать внимание, когда пользователь не смотрит. Он менее читабельен именно потому, что он должен быть очень коротким (сразу привлечь внимание, а не часть обширного потока). Я полагаю, что 4 разных размера дисплея в Material Design - это просто дополнительная забота от Matias и его команды, но я сомневаюсь, что приложения будут использовать более одного размера дисплея (возможно, журналы и мультимедийное приложение, возможно). Большинство приложений даже не будут использовать размер отображения.
• Заголовок: традиционно, я считаю, что если мое мелкое понимание этого вопроса прав, размеры заголовка используются как short тегирует историю. Не описание, просто слоган, короткое сообщение. Пример заголовка: ASSASSIN KILLS KENNEDY. В обычных приложениях, следующих за Material Design, он используется в качестве основного объекта экрана (точно так же, как страницы газеты). Я думаю (как не уверен), что это можно назвать "заголовком" в другом месте.
• Заголовок: честно говоря, он очень общий, и из-за его скромного размера (по сравнению с заголовком и дисплеем) это один из стилей, который я использую больше всего: он очень полезен в местах над блоком текста. Например, "Eula" в качестве названия для текста eula, который следует за этим названием, или "Авторы" непосредственно перед списком авторов. широко используется в рамках.
• Подзаголовок: это более конкретно. Это немедленная, уступающая степени "заголовку" и используется для предоставления выдержек, цитат или краткого описания текстового блока, который следует за ним. Пример подзаголовка (следуя примеру заголовка): губернатор Техаса Раунд, марксист, обвиняемый в убийстве. В Material Design, из-за размера, наиболее распространенное место, которое я видел в нем, находится в элементе списка двух элементов, именно потому, что оно используется в качестве фрагмента электронной почты (чтобы предоставить обзор) или в виде номера телефона (деталь наиболее важного актива для конкретного человека в списке телефонов).
• Тело: основной текст. Довольно очевидно. Самый читаемый из них, и единственный вариант для длинных текстов.
• Подпись: сноски и небольшой текст. В печати он широко используется в качестве титров изображений. В Holo я думаю (как и не уверен), он использовался как текст разделителя (но во всех шапках). В Material Design я думаю, что разделители перестали использовать текст подписи и использовали "тело" со светлым цветом.

Другие программы используют эти (часть или все) концепции с небольшими вариациями:

• текстовые стили текстовых процессоров;
• настройки шрифтов в программном обеспечении изображений, таких как Photoshop, Illustrator и т.д.
• оптическая калибровка шрифтов. Например, Adobe использует "caption" , "regular" , "subhead" и "display" , что, как вы видите, означает для дополнения размеров и ведения шрифтов, специально предназначенных для разных размеров,

По-видимому, общая концепция заключается в том, что это абстрактные объекты, которые представляют собой градиенты важности в текстовых наборах и могут иметь гибкие правила между публикациями, если они последовательно используются в публикации, теме, приложении и т.д.

Проблема 2 #: Как добавить "ведущее" пространство для текста в Android,

Это для тех мест, где вы смешиваете TextView с разными стилями, например, в примере (или с текстовыми проходами, конечно).

Позвольте мне быть честным: прямо сейчас, для чрезвычайных целей, я использую свои глаза с наложенными сетками, чтобы проверить мое лидерство. Я начинаю с ведущего размера, затем я вычитаю размер шрифта следующей текстовой строки и некоторую небольшую сумму как descender текущей строки. Затем я делаю небольшие небольшие оптические настройки, если это необходимо. Было бы неплохо, если бы эти элементы (x-height, cap height, descender и т.д.) могли быть рассчитаны точно, но я, честно говоря, еще не погрузился в это (но это возможно). Я доволен своим "eyeometer", в то время как я не совершенствую MD в своих макетах.

Однако, и я просто посмотрел на это (не пробовал), я считаю, что вы можете погрузиться в FontMetrics, измеряя поля и применяя правильные размеры "на лету" между двумя показанными выше TextView. Я попробую сначала (ascent следующего и descent предыдущего).

- это соответствующее руководство для Android?

Да, это так. Очень. Поместите текст под другим, когда у них разные стили. Как название, за которым следует тело, и попробуйте просто угадать: это не сработает, и ваше приложение не будет соответствовать системе. См. Выше.

Проблема №3: ​​Несмотря на то, что я загрузил последнюю версию Roboto, мои средние шрифты выглядят абсолютно смелыми, в отличие от элегантных и слегка толстых средних шрифтов Google, как я могу подтвердить, что мой шрифт действительно отличается от Google?

Скажите, пожалуйста, где точно, вам нужно сравнить два образца. На рендеринг шрифтов могут влиять многие разные вещи, и каждая система использует свои собственные алгоритмы поиска, помимо многих других вещей. Есть небольшие различия даже между различными версиями Roboto и разными версиями Android. Конечно, среда выглядит "смелым" по сравнению с обычным, но на самом деле не жирным.

Вы можете проверить шрифты в папке sdk/platform/android-APIVERSION/data/fonts. Рендеринг с Ubuntu 15.04 (небольшая подсказка), из коробки, с android-22:

Я думаю, что он соответствует соответствующему образцу.

Для сравнения с чем-то, также широко доступным, это (часть) семейство шрифтов Ubuntu (регулярное, среднее и полужирное, соответственно). По моему мнению, среда также приближается к полужирным, чем обычно:

Minion Pro (обычный, средний, полужирный и полужирный). Он более равномерно взвешен, возможно, потому, что он также предлагает полужирный вариант, но мы говорим о шрифте с засечками, сделанном для мелкой печати, и с гораздо большим количеством времени на рынке, который постоянно совершенствуется:

<Т411 >

Надеюсь, это поможет.