Связь между dp-sp и PX

Ответ 1

Я рекомендую прочитать определения Google dp и sp, которые можно найти в документах Android, здесь и здесь.

Там также есть полезная информация в замечательном Руководство для дизайнера для DPI.

Ответ 2

Я думаю, что ответ будет:

1px = 1dp = 1sp на любом среднем мониторе или мобильном устройстве.

Как я придумал это?

Поскольку пиксель является пикселем, для andriod dp и sp используются, потому что они используются для собственных приложений, которые должны масштабироваться, а dpi каждого экрана различаются на основе устройства. Для настольных компьютеров все это одно и то же, не говоря уже о том, что веб-сайт должен быть совместимым/отзывчивым для мобильных устройств, но поскольку сайт загружается в браузере, некоторые дополнительные медиа-запросы (основанные на рекомендациях) будут выполнять эту работу.

Если у кого-то есть другие логические выводы, пожалуйста, поделитесь

Ответ 3

Безопасное правило - использовать 1 px = 1 dp.

Это должно дать вам хороший безопасный размер практически на любом устройстве. Он будет казаться немного большим на некоторых устройствах, особенно на iPad (обычном).

Вот почему:

"Dp соответствует физическому размеру пикселя при 160 dpi" (https://developer.android.com/training/multiscreen/screendensities.html#TaskUseD)

160 точек на дюйм означает:

160 точек = 1 дюйм

Следовательно:

160 dp = 1 дюйм (25,4 мм)

Поэтому, когда Google рекомендует, чтобы у кнопок была сенсорная высота цели 48 точек на дюйм, они говорят, что они должны быть ростом 7,6 мм (0,3 дюйма).

Так сколько же это px? Ну, это зависит от устройства.

Примеры высоты кнопки 48 dp (7,6 мм):

• iPad mini: 48 пикселей Почему: экран iPad mini имеет ширину около 120 мм и использует 768 пикселей для заполнения этого пространства. Поэтому вам нужно 162 пикселя, чтобы занять дюйм (25,4 мм), или 48 пикселов для высоты кнопки 7,6 мм.

• Kindle Fire (7 "): 43 px

• Разжечь огонь (6 дюймов): 50 пикселей

• iPhone: 48 пикселей

• Nexus 7: 48 px

• Обычный iPad: 39 пикселей

(Возможно, я чуть-чуть обманул округление вверх/вниз.. Мне нравится 48 лучше, чем 49!)

Мм экрана и ширина CSS px для примера: я рассчитал ширину экрана, используя размеры экрана CSS px и длину по диагонали.

• iPad mini: разрешение 1024 x 768 и диагональ 201 мм = ширина 120 мм.
• Kindle Fire 7 ": разрешение 858 x 533 и диагональ 178 мм = ширина 94 мм.
• Kindle Fire 6 ": разрешение 853 x 533 и диагональ 152 мм = ширина 81 мм.
• iPhone: разрешение 568 x 320 и диагональ 102 мм = ширина 50 мм.
• Nexus 7: разрешение 960 * 600 и диагональ 178 мм = ширина 94 мм.
• iPad обычный: разрешение 1024 x 768 и диагональ 246 мм = ширина 148 мм.

Обратите внимание, что для вычисления высоты пикселя кнопки px необходимо использовать размеры устройства px в CSS. Эти цифры не обязательно совпадают с разрешениями, указанными в спецификации.

Ответ 4

Все они примерно одинаковы для большинства случаев использования.

Чтобы сохранить видимый размер вашего пользовательского интерфейса на экранах с разной плотностью, вы должны создать свой пользовательский интерфейс, используя в качестве единицы измерения независимые от плотности пиксели (dp). Один dp - это единица виртуального пикселя, которая примерно равна одному пикселю на экране средней плотности (160 dpi; плотность "базовой линии"). Android переводит это значение в соответствующее количество реальных пикселей для плотности друг друга.

Например, рассмотрим два устройства на рисунке 1. Если вы определите вид шириной 100 пикселей, он будет выглядеть намного больше на устройстве слева. Таким образом, вместо этого вы должны использовать "100dp", чтобы убедиться, что он отображается одинакового размера на обоих экранах.

При определении размеров текста, однако, вы должны вместо этого использовать масштабируемые пиксели (sp) в качестве своих единиц (но никогда не используйте sp для размеров макета). По умолчанию размер блока sp равен размеру dp, но его размер изменяется в зависимости от предпочитаемого пользователем размера текста.