Как использовать UIScrollView в раскадровке

У меня есть прокрутка с контентом, высота которого составляет 1000 пикселей, и хотелось бы, чтобы он мог выложить его для легкого дизайна на раскадровке.
Я знаю, что это можно сделать программно, но я действительно хочу видеть его визуально. Каждый раз, когда я накладываю свиток на контроллер просмотра, он не будет прокручиваться. Можно ли заставить его работать так, как я хочу, или мне нужно сделать это в коде?

Ответ 1

Я отвечаю на свой вопрос, потому что я просто потратил 2 часа, чтобы найти решение, и StackOverflow разрешает этот стиль QA.

Начните, чтобы закончить здесь, как заставить его работать в раскадровке.

1: перейдите к контроллеру и нажмите Attribute Inspector.

2: измените размер на Freeform вместо Inferred.

3: перейдите к основному виду этой раскадровки, а не к просмотру прокрутки, а скорее к виду верхнего уровня.

4: Нажмите Size Inspector и установите для этого представления требуемый размер. Я изменил свою высоту на 1000.

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

5: оставьте на scrollview и растяните его, чтобы он занял весь вид. Теперь у вас должно быть scrollview размером 320,1000, сидящим на представлении в вашем контроллере вида.

Теперь нам нужно сделать прокрутку и нужно правильно отобразить контент.

6: Нажмите на свое прокрутку и нажмите Identity Inspector.

7: Добавьте User Defined runtime attribute с KeyPath contentSize, затем введите SIZE и введите размер своего контента. Для меня это (320, 1000).

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

8: Добавьте runtime attribute с KeyPath frame с типом RECT и 0,0,320,416.

Теперь, когда мы запустим наше приложение, у нас будет видимое scrollview с фреймом 0,0,320, 416 и может прокручиваться до 1000. Мы можем компоновать наши подвидности и изображения и еще что-то в Раскадке так, как мы хотим их появиться. Тогда наши атрибуты времени выполнения обязательно отображают его правильно. Все это без 1 строки кода.

Ответ 2

Вот шаги, которые работали для меня на iOS 7 и XCode 5.

  • Перетащите ViewController (он поставляется с UIView "View" ).

    1.1 Выберите "View Controller" и выберите "File Inspector" и снимите флажок "Auto layout".

  • Перетащите ScrollView (в виде дочернего элемента ViewController UIView "View" )
  • Выберите ScrollView и откройте "Identity Inspector".
  • Введите "contentSize" для keyPath. Выберите "Размер" для типа. Введите значение {320, 1000} для значения.

    Примечание. Шаг 4 просто говорит, что скроллер содержит контент, размер которого составляет 320x1000 единиц. Поэтому настройка contentSize заставит работать скроллер.

  • Выберите "Просмотр контроллера", выберите "Attributes Inspector", затем выберите Freeform из "Размер".

    Примечание. Шаг 5 позволит нам изменить размер "Вид", с которым поставляется контроллер вида.

  • Выберите "Вид", а затем выберите "Инспектор размеров".

  • Установите ширину до 320 и высоту до 1000.

Примечание: 5, 6 и 7 - это чисто для нас, чтобы увидеть растянутый или весь расширенный вид внутри StoryBoard. Примечание. Обязательно отмените выбор "Автомакет" на контроллере просмотра.

Иерархия вашего представления должна выглядеть так: hierarchy

Ответ 3

Ниже приведены шаги с Auto Layout, которые работали для меня на XCode 8.2.1.

  • Выберите Size Inspector из View Controller и измените Simulated Size на Freeform с высотой 1000 вместо Fixed.
  • Переименуйте представление View Controller как RootView.
  • Перетащите a Scroll View в подзаголовок RootView и переименуйте его как ScrollView.
  • Добавить ограничения для ScrollView:
    • ScrollView [Верхний, нижний, ведущий, трейлинг] = RootView [Верхний, нижний, ведущий, трейлинг]
  • Перетащите Vertical Stack View в качестве подсмотра ScrollView и переименуйте его как ContentView.
  • Добавить ограничения для ContentView:
    • ContentView.height = 1000
    • ContentView. [Верхний, нижний, ведущий, трейлинг, ширина] = ScrollView. [Верхний, нижний, ведущий, трейлинг, ширина]
  • Выберите Attributes Inspector ContentView и измените Distribution на Fill Equally вместо Fill.
  • Перетащите View в качестве подзаголовка ContentView и переименуйте его как RedView.
  • Установите Red в качестве фона RedView.
  • Перетащите View в качестве подзаголовка ContentView и переименуйте его как BlueView.
  • Установите Blue в качестве фона BlueView.
  • Выберите RootView и нажмите кнопку Update Frames.
    • Update Frames - новая кнопка в Xcode8 вместо кнопки Resolve Auto Layout Issues. Он выглядит как кнопка обновления, расположенная в панели управления ниже раскадровки: Кнопка обновления фреймов

Просмотр иерархии:

  • RootView
    • ScrollView
      • ContentView
        • RedView
        • BlueView

Просмотр сцены контроллера (высота: 1000):

scene

Запуск на iPhone7 (высота: 1334/2):

demo

Ответ 4

После нескольких часов проб и ошибок я нашел очень простой способ разместить содержимое в scrollviews, которые являются "вне экрана". Протестировано с XCode 5 и iOS 7. Вы можете сделать это почти полностью в Storyboard, используя 2 небольших трюка/обходные пути:

  • Перетащите элемент управления представлением на свою раскадровку.
  • Перетащите scrollView на этом viewController, для демонстрации вы можете оставить свой размер по умолчанию, охватывая весь экран.
  • Теперь приходит трюк 1: перед добавлением какого-либо элемента в scrollView перетащите обычный "вид" (это представление будет больше, чем экран, и будет содержать все вспомогательные элементы, такие как кнопки, метки,... пусть назовите это " охватывающий вид).
  • Пусть этот охватывающий вид Y размер в инспекторе размеров, например, 800.
  • Поместите ярлык в закрывающийся вид, где-то в позиции Y 200, назовите его "label 1".
  • Trick 2: убедитесь, что выбран закрывающий вид (не scrollView!), и установите его позицию Y, например, 250, поэтому вы можете добавить элемент, который находится "снаружи" на экране.
  • Снимите метку, где-то внизу экрана, назовите ее "метка 2". Этот ярлык фактически "выключен".
  • Reset Y-позиция закрывающего представления до 0, вы больше не увидите метку 2, поскольку она была помещена за пределы экрана.

До сих пор для работы с раскадрой теперь вам нужно добавить одну строку кода в метод viewController viewDidLoad, чтобы установить содержимое scrollViews, чтобы он содержал весь "охватывающий вид". Я не нашел способ сделать это в Раскадке:

- (void)viewDidLoad
{
    [super viewDidLoad];

    self.scrollView.contentSize = CGSizeMake(320, 800);
}

Вы можете попробовать сделать это, добавив contentSize keyPath как size в scrollView в Identity Inspector и установив его в (320, 1000).

Я думаю, что Apple должна сделать это проще в раскадровке, в TableViewController вы можете просто прокручивать заставку в Storyboard (просто добавьте 20 ячеек, и вы увидите, что можете просто прокручивать), это тоже возможно с помощью ScrollViewController.

Ответ 5

Получение прокрутки для работы в iOS7 и Auto-layout в iOS 7 и XCode 5.

В дополнение к этому: fooobar.com/questions/53558/...

По-видимому, все, что нам нужно сделать, это:

  • Задайте все ограничения для просмотра прокрутки (т.е. сначала прокрутите прокрутку)

  • Затем установите ограничение расстояния от-scrollView до самого нижнего элемента для прокрутки (это супер-просмотр).

Примечание. Шаг 2 расскажет раскадровку, где последний фрагмент содержимого находится в представлении прокрутки.

Ответ 6

В этом примере я отключил функцию автозапуска конструктора интерфейса. И, я по-прежнему использую (без всякой причины) относительно старую версию Xcode 4.6.1.

Начните с контроллера вида, который имеет прокручиваемое представление над ним (основной вид).

1: добавьте представление контейнера из библиотеки объектов в список прокрутки. Обратите внимание, что новый контроллер представления добавляется в раскадровку и связан с контроллером представления с видом прокрутки.

2: выберите вид контейнера, а в Инспекторе размеров сделайте привязку сверху и слева без автоматического изменения размера.

enter image description here

3: измените его высоту на 1000. (1000 используется для этого примера. Вы должны применить требуемое значение.)

4: Выберите новый контроллер представления и, из Инспектора атрибутов, измените размер на Freeform.

enter image description here

5: выберите вид нового контроллера представления, а в инспекторе размера измените высоту на 1000 (что равно высоте представления контейнера).

6: для вашего теста позже, пока вы все еще смотрите на новый контроллер просмотра, добавьте метку вверху и внизу представления.

7: Выберите вид прокрутки с исходного контроллера. В Инспекторе Identity добавьте атрибут с параметром keyPath, установленным в contentSize, введите значение "Размер" и значение, установленное в значение {320, 1000} (или размер вашего контейнера).

enter image description here

8: Запустите 4-дюймовый iPhone-симулятор. Вы должны иметь возможность прокручивать верхнюю метку до нижней метки.

9: Запустите на 3,5-дюймовом iPhone Simulator. Вы должны иметь возможность прокручивать верхнюю метку до нижней метки.

Помните, что Xcode 4.6.1 можно создавать только для iOS6 и ниже. Используя этот подход и создание для iOS6, я все еще могу добиться тех же результатов, когда приложение запускается на iOS7.

Ответ 7

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

Для a UIScrollView мне нравится предложение Alex, но я бы рекомендовал временно изменить контроллер представления на произвольную форму, увеличив высоту корневого представления, построив ваш интерфейс (шаги 1-5), а затем изменив его на стандартный выведенный размер, когда вы закончите, так что вам не нужны жесткие размеры содержимого кода в качестве атрибутов выполнения. Если вы это сделаете, вы откроете себе проблемы с обслуживанием, пытаясь поддерживать как 3.5 ", так и 4" устройства, а также возможность увеличения разрешения экрана в будущем.

Ответ 8

В iOS7 я обнаружил, что если бы у меня был вид внутри UIScrollView на ViewController размером с FreeForm, он не прокручивал бы в приложении, независимо от того, что я сделал. Я поиграл и обнаружил, что, похоже, работает, в котором нет FreeForms:

  • Вставьте UIScrollView внутри основного представления ViewController

  • Установите ограничения Autolayout на ScrollView, если это необходимо. Для меня я использовал 0 to Top Руководство по макету и руководство 0 до нижней части

  • Внутри ScrollView поместите Container View. Установите его высоту в соответствии с тем, что вы хотите (например, 1000)

  • Добавьте ограничение высоты (1000) в контейнер, чтобы оно не изменялось. Дно будет проходить через конец формы.

  • Добавьте строку [self.scrollView setContentSize: CGSizeMake (320, 1000)]; к ViewController, который содержит scrollView (который вы подключили как IBOutlet)

ViewController (автоматически добавленный), связанный с контейнером, будет иметь требуемую высоту (1000) в Interface Builder и также будет правильно прокручиваться в исходном контроллере представления. Теперь вы можете использовать контейнер ViewController для компоновки своих элементов управления.

Ответ 9

Вы должны установить свойство contentSize в viewDidAppear, как этот образец:

- (void)viewDidAppear:(BOOL)animated{

     [super viewDidAppear:animated];
     self.scrollView.contentSize=CGSizeMake(306,400.0);

}

Он решает проблемы автоопределения и отлично работает на iOS7.

Ответ 10

Я хочу поставить свои 5 центов на принятый ответ: я исследовал тему в течение 2 дней и, наконец, нашел решение, которое я буду использовать всегда с этого момента

перейти к пункту 4 в принятом ответе и забыть о добавлении атрибутов кадров и содержимого и т.д.

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

все ясно, легко, элегантно и работает как шарм на ios 7. Я очень доволен всем этим lol

Ответ 11

Отказ от ответственности: - Только для ios 9 и выше (Stack View).

Если вы развертываете свое приложение на устройствах ios 9, используйте представление стека. Вот шаги: -

  • Добавить представление прокрутки с ограничениями - вывод влево, вправо, снизу, сверху (без полей) для просмотра (просмотр)
  • Добавить представление стека с теми же ограничениями для просмотра прокрутки.
  • Просмотр стека Другие ограничения: - stackView.bottom = view.bottom и stackView.width = scrollView.width
  • Начните добавлять свои представления. В представлении прокрутки будет выбрано прокрутка в зависимости от размера представления стека (который по сути является вашим представлением содержимого).

Ответ 12

Здесь немного грубый ответ, который попадает в одно и то же решение для вертикальных просмотров прокрутки, но (против этики stackoverflow) не отвечает на вопрос. Вместо использования scrollView просто используйте UITableView, перетащите обычный UIView в заголовок и сделайте так, как хотите, теперь вы можете прокручивать содержимое в раскадровке.

Ответ 13

Вот простое решение.

  • Задайте атрибут size вашего контроллера вида в раскадровке на "Freeform" и установите необходимый размер. Убедитесь, что он достаточно большой, чтобы соответствовать полному содержимому вашего вида прокрутки.

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

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

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

Ответ 14

По-видимому, вам не нужно указывать высоту вообще! Это здорово, если она по какой-то причине изменилась (вы изменяете размеры компонентов или изменяете размеры шрифтов).

Я только что последовал этому руководству, и все сработало: http://natashatherobot.com/ios-autolayout-scrollview/

(Боковое примечание: нет необходимости реализовывать viewDidLayoutSubviews, если вы не хотите центрировать представление, поэтому список шагов еще короче).

Надеюсь, что это поможет!

Ответ 15

Ключ - это contentSize.

Это часто отсутствует и не указывается при добавлении UIScrollView.

Выберите UIScrollView и выберите Identity Inspector.

Добавьте contentSize keyPath как size в scrollView в Identity Inspector и установите для него значение (320, 1000).

Прокрутите прочь.

Ответ 16

Если вы используете автоматическую компоновку, лучше всего использовать UITableViewController со статическими ячейками в раскадровке.

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