В основном мне понравился фон, используемый г-ном Джонатаном Ли для заголовка навигационного ящика в официальной ссылке google http://www.google.com/design/spec/patterns/navigation-drawer.html#navigation-drawer-content
Итак, я хотел воспроизвести что-то подобное, вдохновленное этим. Я считаю, что мне нужно сделать аналогичный дизайн в Photoshop и установить его как фоновое изображение. Но вопрос в том, какими должны быть размеры и пиксели, чтобы они соответствовали различным типам устройств?
В приведенной выше ссылке есть рекомендации по значкам и полям, но я не видел никаких измерений, упомянутых для этого фона.
Есть ли у кого-нибудь идеи или ссылки, которые могут помочь?
Ширина:
Мобильный:
Ширина = Ширина экрана - 56 дп
Максимальная ширина: 320dp
Максимальная ширина применяется только при использовании боковой навигации слева. При использовании панели справа панель может покрывать всю ширину экрана.
http://www.google.com/design/spec/layout/structure.html#structure-side-nav
Высота определяется соотношением сторон изображения, которое вы хотите:
http://www.google.com/design/spec/layout/metrics-keylines.html#metrics-keylines-ratio-keylines
Возможно, 16: 9
Распакуйте APK, и это то, что я выяснил -
mdpi-
width=384 pixels
height=216 pixels
hdpi-
width=576 pixels
height=324 pixels
xhdpi-
width=768 pixels
height=432 pixels
xxhdpi-
width=1152 pixels
height=648 pixels
Источник изображения = приложение Google Newsstand, инструмент = Adobe photoshop 7.0
Я бы рекомендовал использовать Adobe Illustrator, так как он отлично работает с дизайном ui. Большинство мобильных устройств/планшетов имеют ширину от 320 пикселей до 1080 пикселей и все еще увеличиваются по мере выпуска новых телефонов/планшетов. Масштабируемая векторная графика отлично работает с макетами прототипирования ui.
проверить: http://www.uxbooth.com/articles/considerations-for-mobile-design-part-2-dimensions/