Як користуватися UIScrollView у Storyboard

У мене подання прокрутки із вмістом у висоту 1000 пікселів, і я хотів би мати можливість викласти його для зручного дизайну на дошці розкадрування.
Я знаю, що це можна зробити програмно, але мені дуже хочеться це бачити візуально. Кожен раз, коли я кладу подання прокрутки на контролер перегляду, він не прокручується. Чи можна змусити його працювати так, як я хочу, або я повинен це робити в коді?

Я відповідаю на власне питання, тому що я просто витратив 2 години на пошук рішення, і StackOverflow дозволяє цей стиль QA.

Почніть закінчувати тут, як змусити його працювати в раскадровці.

1: перейдіть до контролера перегляду та натисніть на Attribute Inspector.

2: зміни розміру на Freeformзамість Inferred.

3: Перейдіть до основного огляду на цій дошці розкадрування, а не до перегляду прокрутки, а до подання верхнього рівня.

4: Клацніть Size Inspectorта встановіть цей вид на потрібний розмір. Я змінив зріст до 1000.

Тепер ви побачите, що у вашій рекламній дошці є налаштування перегляду, щоб ви могли бачити всю висоту прокрутки для легкого проектування.

5: Опустіться на прокрутку і розтягніть його, щоб він зайняв весь вид. Тепер у вас повинен бути перегляд прокрутки розміром 320,1000, який сидить на поданні у контролері перегляду.

Тепер нам потрібно зробити його прокруткою і потрібно, щоб він відображав вміст правильно.

6: Клацніть на ваш список прокрутки та натисніть на Identity Inspector.

7: Додайте User Defined runtime attributeз KeyPath contentSizeпотім тип SIZE та введіть розмір вмісту. Для мене це (320, 1000).

Оскільки ми хочемо побачити весь перегляд прокрутки на дошці розкадрів, ми розтягнули його, і він має рамку 320,1000, але для того, щоб це працювало в нашому додатку, нам потрібно змінити кадр вниз, яким буде видимий прокрутки.

8: Додайте runtime attributeKeyPath frameз типом RECT та 0,0,320,416.

Тепер, коли ми запустимо наш додаток, у нас буде видимий прокрутка, який має рамку 0,0320, 416 і може прокручуватися до 1000. Ми можемо компонувати наші підгляди та зображення, а також те, що не так у Storyboard, як ми їх бажаємо. Тоді наші атрибути виконання обов'язково відображають його належним чином. Все це без 1 рядка коду.

Ось етапи, Auto Layoutякі працювали для мене на XCode 8.2.1.

1. Виберіть Size Inspectorз View Controller, і зміни Simulated Sizeдо Freeformз висотою 1000 замість Fixed.
2. Перейменуйте представлення View Controllerяк RootView .
3. Перетягніть a Scroll Viewяк підвід RootView і перейменуйте його як ScrollView .
4. Додати обмеження для ScrollView :
   • ScrollView [Вгору, Нижній, Ведучий, Задній ] = RootView [Верх, Нижній, Ведучий, Задній]
5. Перетягніть a Vertical Stack Viewяк підвідміток ScrollView і перейменуйте його як ContentView .
6. Додати обмеження для ContentView :
   • ContentView .висота = 1000
   • ContentView [вгорі, знизу, провідний, нижній, ширина] = ScrollView [вгорі, знизу, провідний, задні, ширина]
7. Виберіть Attributes Inspectorз ContentView , і змінити Distributionдо Fill Equallyзамість Fill.
8. Перетягніть Viewяк підпідміст ContentView і перейменуйте його як RedView .
9. Встановіть Redяк фон RedView .
10. Перетягніть Viewяк підпідміст ContentView і перейменуйте його як BlueView .
11. Встановіть Blueяк фон BlueView .
12. Виберіть RootView і натисніть Update Framesкнопку.
    • Update Framesце нова кнопка в Xcode8, а не Resolve Auto Layout Issuesкнопка. Це схоже на кнопку оновлення, розташовану на панелі керування під дошкою розгортки:

Переглянути ієрархію:

• RootView
  • ScrollView
    • ContentView
      • RedView
      • BlueView

Перегляд сцени контролера (висота: 1000):

Запустити на iPhone7 (зріст: 1334/2):

Ось кроки, які працювали для мене на iOS 7 та XCode 5.

1. Перетягніть ViewController (він поставляється з UIView "Перегляд").

   1.1 Виберіть "Переглянути контролер" та виберіть "Інспектор файлів" та зніміть прапорець "Автоматичне розташування".

2. Перетягніть ScrollView (як дочіння UIView ViewController у "Вид")
3. Виберіть ScrollView та відкрийте "Інспектор посвідчення особи".

4. Введіть "contentSize" для keyPath. Виберіть "Розмір" для типу. І введіть {320, 1000} для значення.

   Примітка: крок 4 - це просто сказати, що скроллер містить деякий вміст, розмір якого становить 320x1000 одиниць. Таким чином, встановлення contentSize змусить роботу прокрутки.

5. Виберіть «Контролер перегляду», виберіть «Інспектор атрибутів», а потім виберіть « Вільна форма» з «Розмір».

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

6. Виберіть "Перегляд", а потім виберіть "Інспектор розміру".

7. Встановіть Ширину на 320, а висоту - на 1000.

Примітка: 5, 6 і 7 суто для нас, щоб побачити розтягнутий або весь розгорнутий вигляд всередині StoryBoard. Примітка. Переконайтесь, що зніміть позначку "Автоматична компонування" на контролері подання.

Ієрархія перегляду повинна виглядати так:

Після годин спроб та помилок я знайшов дуже простий спосіб вкласти вміст у перегляди прокрутки, які є "поза екраном". Тестовано за допомогою XCode 5 та iOS 7. Ви можете це зробити майже повністю у дошці розповідей, використовуючи 2 невеликих трюки / обхідні шляхи:

1. Перетягніть контролер перегляду на свою раскадровку.
2. Перетягніть прокруткуView на цей виглядController, для демонстрації ви можете залишити його розмір за замовчуванням, охоплюючи весь екран.
3. Тепер приходить хитрість 1 : перш ніж додати будь-який елемент до scrollView, перетягніть звичайний "перегляд" (цей вид буде зроблено більше, ніж екран, і буде містити всі під елементи, такі як кнопки, мітки, ... назвемо це ' додаючий вигляд ').
4. Нехай цей розмір Y переглядає розмір Y в інспекторі розмірів, наприклад, 800.
5. Запустіть мітку на доданий вигляд, десь у позиції Y, назвіть її "мітка 1".
6. Трюк 2 : переконайтесь, що вибрано подаюче вікно (а не scrollView! ) Та встановіть його Y-положення, наприклад, -250, щоб ви могли додати елемент, який знаходиться "поза" екрана
7. Опустіть етикетку, десь внизу екрана, назвіть її "мітка 2". Ця мітка насправді "поза екраном".
8. Скиньте положення Y вкладеного подання на 0, ви більше не побачите мітку 2, оскільки вона була розташована поза екраном.

Наразі для роботи на раскадровці тепер вам потрібно додати єдиний рядок коду до методу "viewDidLoad" viewController, щоб встановити вміст scrollViews, щоб він містив весь "додаючий вигляд". Я не знайшов способу зробити це на «Розгортці»:

- (void)viewDidLoad
{
    [super viewDidLoad];

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

Ви можете спробувати це зробити, додавши contentSizekeyPath як a sizeдо scrollView в Інспекторі ідентичності та встановивши його на (320, 1000).

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

Початок прокрутки для роботи в iOS7 та Авто-макет у iOS 7 та XCode 5.

Додатково до цього: https://stackoverflow.com/a/22489795/1553014

Мабуть, все, що нам потрібно зробити:

1. Встановити всі обмеження для перегляду прокрутки (тобто спочатку виправити подання прокрутки)

2. Потім встановіть обмеження відстані від-scrollView до самого нижнього елемента для перегляду прокрутки (що є супервидом).

Примітка. Крок 2 розповість рекламну дошку, де останній фрагмент вмісту лежить у вікні прокрутки.

У цьому прикладі я скасував функцію автоматичного вимикання конструктора інтерфейсів. І я все ще використовую (без жодної причини) відносно стару 4.6.1 версію Xcode.

Почніть з контролера перегляду, який має вигляд прокрутки над ним (основний вид).

1: Додайте перегляд контейнера з бібліотеки об'єктів до подання прокрутки. Зауважте, що до контрольної панелі додано новий контролер перегляду, який пов'язаний з контролером перегляду разом із поданням прокрутки.

2: Виберіть подання контейнера і, за допомогою Інспектора розмірів, зробіть його кріпленням зверху та зліва, не змінюючи розмір автоматично.

3: Змініть його висоту на 1000. (У цьому прикладі використовується 1000. Ви повинні застосувати необхідне вам значення.)

4: Виберіть новий контролер перегляду та, з інспектора атрибутів, змініть розмір на вільну форму.

5: Виберіть подання нового контролера перегляду та, за розміром Inspector, змініть висоту до 1000 (що дорівнює висоті подання контейнера).

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

7: Виберіть подання прокрутки з оригінального контролера перегляду. У інспекторі ідентичності додайте атрибут із набором keyPath до contentSize, введіть значення Розмір і значення, встановлене на {320, 1000} (або розмір перегляду контейнера).

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

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

Пам'ятайте, що Xcode 4.6.1 може бути створений лише для iOS6 та нижче. Використовуючи такий підхід і будуючи для iOS6, я все ще в змозі досягти тих же результатів, коли додаток запускається на iOS7.

Зауважте, що в межах UITableViewви можете фактично прокручувати перегляд таблиці, вибравши комірку або елемент у ній і прокручуючи вгору або вниз за допомогою трекпада.

Наприклад UIScrollView, мені подобається пропозиція Алекса, але я рекомендую тимчасово змінити контролер перегляду на вільну форму, збільшити висоту кореневого виду, побудувати інтерфейс користувача (кроки 1-5), а потім змінити його на стандартний розмір висновку, коли закінчите так що вам не доведеться жорстко розміщувати вміст коду в якості атрибутів виконання. Якщо ви це зробите, ви відкриваєте перед собою чимало проблем із технічним обслуговуванням, намагаючись підтримати пристрої 3,5 "та 4", а також можливість збільшення дозволу екрана в майбутньому.

Ви повинні встановити лише властивість contentSize на viewDidAppear, як у цьому зразку:

- (void)viewDidAppear:(BOOL)animated{

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

}

Він вирішує проблеми з авторозміткою та чудово працює на iOS7.

Відмова від відповідальності: - Тільки для iios 9 і вище (Stack View).

Якщо ви розгортаєте додаток на пристроях ios 9, використовуйте подання стека . Ось такі кроки: -

1. Додайте подання прокрутки з обмеженнями - шпильками вліво, вправо, внизу, вгорі (без поля) для перегляду (перегляду)
2. Додайте подання стека з однаковими обмеженнями, щоб переглянути подання прокрутки.
3. Перегляд стека Інші обмеження: - stackView.bottom = view.bottom та stackView.width = scrollView.width
4. Почніть додавати свої уявлення. Перегляд прокрутки вирішить прокручувати залежно від розміру подання стека (який, по суті, є переглядом вмісту)

У iOS7 я виявив, що якби у мене було перегляд UIScrollView на ViewController розміром FreeForm, він не прокручується в додатку, що б я не робив. Я пограв і виявив, що працює таке, що не використовує FreeForms:

1. Вставте UIScrollView у головний вигляд ViewController

2. Встановіть обмеження для автоматичного вимикання на ScrollView відповідно. Для мене я використав посібник від 0 до верхніх макетів і 0 до керівництва по макеті знизу

3. Всередині ScrollView розмістіть Перегляд контейнерів. Встановіть його висоту на все, що завгодно (наприклад, 1000)

4. Додайте в контейнер обмеження висоти (1000), щоб воно не змінило розмір. Дно буде минулим наприкінці форми.

5. Додайте рядок [self.scrollView setContentSize: CGSizeMake (320, 1000)]; до ViewController, який містить scrollView (який ви підключили як IBOutlet)

ViewController (додається автоматично), пов'язаний з контейнером, матиме бажану висоту (1000) в Interface Builder, а також буде правильно прокручуватися в оригінальному контролері подання. Тепер ви можете використовувати контейнер ViewController для компонування елементів керування.

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

перейдіть до пункту 4 у прийнятій відповіді та забудьте про додавання атрибутів фреймів та змісту тощо

щоб зробити все автоматичним, просто використовуйте рішення за цим посиланням

все зрозуміло, легко, елегантно і працює як шарм на ios 7. Я дуже радий з усім, що lol

Ось просте рішення.

1. Встановіть атрибут розміру контролера перегляду на дошці розкадрівки на "Freeform" та встановіть потрібний розмір. Переконайтеся, що він достатньо великий, щоб вмістити повний вміст вашого виду прокрутки.

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

3. Тепер просто переконайтесь, що в підвидах перегляду прокрутки є обмеження, які з'єднують верхній і нижній частині подання прокрутки. Те саме для лівої та правої, якщо у вас горизонтальна прокрутка.

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

Ось як налаштувати прокрутку за допомогою Xcode 11

1 - Додайте перегляд прокрутки та встановіть обмеження на верхній, нижній, ведучий та останній

2 - Додайте перегляд вмісту до перегляду прокрутки, перетягніть підключення до Посібника з вмісту вмісту та виберіть Провідні, Вгорі, Нижні та Задні. Не забудьте встановити його значення "0" або потрібні константи.

3 - Перетягніть зображення з вмісту до Посібника з компонування кадру та виберіть Рівні ширини

4 - Встановіть константу обмеження висоти для перегляду вмісту

Мабуть, вам зовсім не потрібно вказувати висоту! Що чудово, якщо воно зміниться з якоїсь причини (ви зміните розмір компонентів або зміните розміри шрифту).

Я тільки дотримувався цього підручника і все працював: http://natashatherobot.com/ios-autolayout-scrollview/

(Бічна примітка. Не потрібно реалізовувати viewDidLayoutSubviews, якщо ви не хочете централізувати подання, тому список кроків ще коротший).

Сподіваюся, що це допомагає!

Ключовим є contentSize.

Це часто відсутнє і не вказується при додаванні UIScrollView.

Виберіть UIScrollView та виберіть інспектор посвідчення особи.

Додайте contentSizekeyPath як a sizeдо scrollView в Інспекторі ідентичності та встановіть його на (320, 1000).

Прокрутіть геть.

Якщо ви використовуєте автоматичну компоновку, найкращим підходом є використання UITableViewController зі статичними осередками в раскадровці.

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