UICollectionView меняет направление потока при вращении

Компактная высота

Компактная ширина

Эй, я хотел бы получить то, что вы видите на картинках: в режиме компактной высоты (альбомный iphone) и красный, и синий вид должны занимать весь экран по вертикали и половину экрана по горизонтали. В режиме компактной ширины (портретный iphone) они должны занимать весь экран по горизонтали и половину экрана по вертикали. Расстояние между представлениями должно быть одинакового размера в обоих режимах.

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

Может быть, мне нужно использовать UICollectionView и изменить направление потока в зависимости от ориентации (если это вообще возможно)?


person Antonio Giungato    schedule 09.02.2015    source источник


Ответы (1)


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

Это возможно с размерными классами в IB. Во-первых, в общем, вы, вероятно, найдете полезным назвать представления в схеме документа слева в IB. Вы также захотите использовать этот контур, а не пытаться захватить крошечные H-линии ограничения.

  1. Настройте все ограничения, кроме 1) ограничений, связывающих OrangeView и BlueView друг с другом, 2) ограничений, связывающих OrangeView с верхним и левым (ведущим) и 3) ограничений, связывающих BlueView с нижним и правым (конечным) .
  2. Измените настройку класса размера внизу на w-Compact и h-Any в системе причудливых коробок. Теперь мы разрабатываем для компактной ширины, чтобы виды располагались друг над другом.
  3. Создайте ограничения для вертикального пространства от BlueView.bottom до OrangeView.Top. Также создайте ограничение для OrangeView на superview.leading (или ledaing,margin) и BlueView на superview.trailing.margin. Если вы выберете любое из этих ограничений и посмотрите на Инспектор размера справа (линейка), вы увидите, что флажок «установлен» не установлен, а под ним w-Compact h-Any и еще один установленный флажок, этот выбран .
  4. Теперь, оставив ограничение выбранным, просто чтобы посмотреть, что произойдет, измените селектор sizeClass внизу на w-Regular h-Any. Обратите внимание, что в схеме документа слева он должен стать серым.
  5. Сейчас мы проектируем для обычного, поэтому бок о бок. Добавьте ограничения, связывающие представления для горизонтального пространства, BlueView.trailing и OrangeView.leading. Также свяжите OrangeView.top с superview.top или top, выровненным с BlueView.top, и то же самое для низов. Сначала вы можете вручную отредактировать кадр; если нет, IB автоматически заполнит неправильные значения, поэтому отредактируйте их после того, как вы их создадите, и убедитесь, что они w-Regular и h-Any. Выбрав ViewController, выберите «обновить кадры», и представления должны привязаться к ожидаемой форме для класса размера.

Дайте нам знать, если это работает для вас или если это было неясно. Удачи!

person Mike Sand    schedule 09.02.2015
comment
Привет, Михаил, спасибо за такой подробный и исчерпывающий ответ! IB иногда может быть довольно неинтуитивным... - person Antonio Giungato; 10.02.2015
comment
Я все еще пытаюсь изучить автоматические макеты и классы размеров: на шаге 1. когда вы говорите настроить все ограничения, вы имеете в виду: 1) синий вверх 2) синий в ведущий 3) оранжевый вниз 4) оранжевый-конечный ? Xcode жалуется, что я пропускаю ограничения по высоте и ширине как для синего, так и для оранжевого цветов. Я пытался установить одинаковую ширину и высоту для синего и оранжевого, но это не работает. Невозможно одновременно удовлетворить ограничения. и так далее... - person Antonio Giungato; 12.02.2015
comment
Да, предупреждения Xcode иногда очень верны, и иногда их нужно игнорировать - вот почему есть опция-заполнитель, просто чтобы заглушить предупреждения, если вы знаете, что ваши будут обрабатывать их в коде. - person Mike Sand; 12.02.2015
comment
Продолжение комментария, извините, на мобильном телефоне: в этом случае вы получите предупреждения после шага 1, потому что вы еще не предоставили ему всю информацию. Однако, возможно, мой ответ был не таким полным, как должен был быть, потому что в конечном итоге ему нужны ограничения, связывающие представления со всеми сторонами и друг с другом, или же он не может понять, насколько большими они должны быть. . Настройка каждого поля должна разрешать высоту и ширину с одним видом на этой оси. Все, что изменяется, настраивается только при редактировании этого класса размеров. Если он не может разрешить два вида вдоль одной и той же оси, для этого должны работать равные высоты и ширина. - person Mike Sand; 12.02.2015