Как установить разные вариации для разных iPhone устройств? - PullRequest
Новая
       57

Как установить разные вариации для разных iPhone устройств?

0 голосов
/ 01 августа 2020

Я новичок в программировании на Swift и хочу знать, как люди адаптируются к разным размерам экрана iPhone.

Если я правильно понимаю, все портретные iPhone устройства (например, * От 1023 * 4 до iPhone 11) имеют компактную ширину и обычную высоту. Таким образом, я не могу изменять размер пользовательских интерфейсов в зависимости от устройств iPhone. Приведенные ниже изображения - это то, над чем я работаю над своим личным проектом, однако, поскольку я не могу изменить размер пользовательского интерфейса в зависимости от iPhone устройств, я не вижу кнопку, когда меняю устройство на iPhone 4 а текстовые поля слишком велики для iPhone SE и iPhone 4.

iPhone 11

enter image description here

iPhone SE

enter image description here

iPhone 4

введите описание изображения здесь

Я могу изменить размер UI для iPhone 4 или iPhone SE, но это сделает UI для iPhone 8, 10, 11 слишком маленькими. Я видел, как некоторые люди задавали этот вопрос в Google, но ответы были на добавление вариаций к разным размерам ширины и высоты, чего я не искал.

Я хочу знать, как я могу внести изменения в пользовательский интерфейс для разные iPhone устройства (все они имеют одинаковую компактную ширину и обычную высоту), а также хотят знать, как разработчики адаптируются к универсальному дизайну (я имею в виду, что мои пользовательские интерфейсы для iPhone 4 и iPhone 11 очень разные) . Я надеюсь, что не многие люди больше используют iPhone 4, но я был так сбит с толку ...

Кроме того, лучше ли сначала создавать пользовательские интерфейсы с наименьшим размером экрана? Итак, в моем случае сначала создайте пользовательский интерфейс с iPhone 4 (что я не думаю, что многие люди используют), чтобы избежать таких проблем с пользовательским интерфейсом, как я.

Кстати, я использую раскадровку, пока что не Swift UI.

1 Ответ

0 голосов
/ 01 августа 2020

Вы должны использовать Auto Layout & constraints для автоматического расчета положения элементов на основе размера экрана и определенных правил.

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

Таким образом, он будет выглядеть следующим образом:

  • Вид
    • Вертикальный стек - примените ограничение центра H / W для этого

      • Изображение

      • Вертикальный стек

        • Текстовое поле
        • Текстовое поле
        • Текстовое поле
        • Кнопка

Используя два вида стека, вы можете определить один интервал между элементами ввода и иметь большее пространство между изображением и стеком входов.

Это видео кажется хорошим введением в ограничения.

...