Задача :
Мобильные устройства поставляются с экранами разных размеров. И нам нужно, чтобы изображение хорошо выглядело на экранах разных размеров (Android + iPhone + iPad + iPod и т. Д.).
Одно решение :
Недавно я столкнулся с этой проблемой и обнаружил, что это хорошо работает для меня.
<s:BitmapImage id="image"
source="@Embed('assets/images/background_startup.png')"
width="100%" height="100%" smooth="true" smoothingQuality="high"
scaleMode="zoom" horizontalAlign="center"/>
Теперь, как вы можете видеть, это устраняет белую рамку, сохраняя соотношение сторон. Если вы разрабатываете заставку (как те, что вы видели в начале большинства запусков приложений), это действительно простой способ позаботиться об этом. Имейте в виду, что вам придется разработать многоэкранное совместимое изображение или назначить правильно масштабированное изображение в зависимости от размера экрана. Если вы просто хотите создать ОДИН образ, хороший размер, который в настоящее время использует, - 700 пикселей в ширину и 1200 пикселей в высоту. Почему так выше? Поскольку большинство устройств с высоким разрешением используют этот размер экрана (давайте рассмотрим это максимальное разрешение). В то же время разработка изображения, которое значительно выше, чем его ширина, помогает нам контролировать, какие части изображения обрезаются, если этого требует экран меньшего размера. Обратите внимание, что эта модель работает только в том случае, если ваше приложение работает только в режиме Portrait .
Как вы можете видеть выше, у нас есть «безопасная» зона и «небезопасная», где мы можем ожидать обрезку. Из того, что я обнаружил, эта область имеет высоту от 100 до 110 пикселей и не должна содержать важный текст или информацию, но все же включает фон и границы, поэтому все выглядит хорошо.
Moto Droid Pro
Moto Droid X
iPhone 3GS
Надеюсь, это поможет!