UIPageViewController для представления всплывающего окна в основном представлении.

В своем приложении я хочу создать пользовательскую историю (руководство по адаптации), которая будет состоять из 3–4 карточек, которые можно смахивать. Пользователь может провести пальцем по экрану, и после того, как будет проведен последний, приложение запустится. Пользователь также может пропустить в любое время он / она любит.

Ниже похоже на то, что я хотел бы иметь.

Ожидаемый результат:

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

У вас есть основной вид, появляющийся немного по бокам.

Я начал использовать UIPageViewController для управления таким набором карточек, что у меня получилось. (У меня есть 3 отдельных вида, которые попадают в мой пользовательский UIPageViewController). Я также добавил эти маленькие точки смахивания (то, что вы обычно видите в нижней части такого онбординга). Однако, поскольку в конечном итоге я хотел, чтобы за этим представлением страницы отображался основной вид, я начал использовать представление контейнера, как предлагается в этом учебник. Я вставил containerView в свой основной вид, сделал его класс контроллера своим собственным классом PageViewController.

Хотя мне удалось имитировать то, что я хотел, как вы видите ниже, большинство настроек, которые я сделал в своем пользовательском UIPageViewController, недоступны для использования в этом контроллере Container View (который теперь является моим пользовательским PageViewController).

Фактический результат:

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

Настройки, которые я сделал в своем пользовательском UIPageViewController, были следующими: 1. Проведите (или навигацию) по точкам внизу. 2. Цвет этих точек. 3. Цвет фона. 4. Я планирую сделать больше, например, изменить его границы на RoundedRect и т. д.

При изучении в инспекторе атрибутов вот какие атрибуты доступны для изменения в любом UIPageViewController:

Атрибуты для UIPageViewController в целом

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

И ниже приведены атрибуты, которые появляются для контроллера контейнера, который теперь должен быть подклассом UIPageViewController, не так ли? Как видите, раздела «Контроллер просмотра страницы» вообще нет.

Атрибуты для моего пользовательского UIPageViewController (VC контейнера не является его подклассом)

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

Итак, я искал две вещи:

Вопросы:

  1. Это лучший способ добиться того, чего я хочу? (Я также думал об использовании UIAlert и т. д. для достижения этой цели, но отказался от этого, так как хотел большего контроля).

  2. В чем проблема с контроллером контейнера, что при изменении его на UIPageViewController все настройки устанавливаются по умолчанию.

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


person Manganese    schedule 23.12.2017    source источник


Ответы (2)


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

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

Таким образом, вместо того, чтобы использовать представление контейнера, представьте контроллер представления страницы с удаленной обратной стороной, а презентацию установите на «Поверх текущего контекста» — это оставит контроллер представления позади видимым. Контроллер представления страницы будет представлять собой набор контроллеров представления учебных карточек, которые вы настраиваете.

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

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

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

person Callam    schedule 23.12.2017
comment
Спасибо, Каллам. Это действительно работает, и наряду с изменением атрибутов времени выполнения я действительно могу имитировать то, что я ожидал в первую очередь. Проблема в том, что мой основной VC всегда должен быть в фоновом режиме. И PageView вместе с 2/3 просмотрами должен быть наверху. Я изменил непрозрачность трех представлений, лежащих в основе PageViewController. Это выглядит хорошо. Тем не менее я не вижу свой основной VC, потому что, поскольку я хочу, чтобы эти карты отображались, я установил PageViewController в качестве контроллера Intial View. Как я могу установить основной VC в качестве начального ViewController и добавить свои представления PageViewController на его вершину? - person Manganese; 23.12.2017
comment
Если вы должны были сделать свой основной VC начальным контроллером, в viewDidAppear представьте контроллер просмотра страницы модально поверх текущего контекста. Это можно сделать с помощью построителя интерфейса segue или программно, установив тип модального представления контроллера, который вы представляете, на .overCurrentContext. - person Callam; 23.12.2017
comment
Попробую это и посмотрим, работает ли это. Тем не менее, я получил большую часть ответа, который мне нужен, из вашего ответа. После того, как я попробую, я приму это как ответ. Кроме того, понятно, что пакеты карт с возможностью считывания в изобилии, и их можно использовать. - person Manganese; 23.12.2017
comment
В приведенном ниже ответе желтый цвет — мой основной венчурный капитал. Спасибо за вашу помощь. - person Manganese; 24.12.2017

Вот как я смог это сделать, согласно моей потребности. Добавление в деталях, на случай, если другим людям это может быть полезно. Мой основной ViewController — это моя точка входа. Внутри основного VC я использовал Container VC. Я перетащил UIPageViewController и создал три VC, которые будут страницами в моем UIPageViewController. Я удалил контроллер ContainerView по умолчанию, который поставляется вместе с ним. И фактически встроил (Embed Segue) UIPageViewController в ContainerView (который находится в основном VC). Вся аранжировка выглядит так:

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

Таким образом, мой mainVC может оставаться первоначальным VC. Я могу уменьшить три вида с помощью углового радиуса, который выглядит как всплывающее окно, как мне и нужно. Я не использовал UIPageControl по умолчанию, который используется UIPageViewController. Вместо этого я перетащил UIPageViewControl в свой основной VC (а не в контейнер VC внутри). Таким образом, я смог добавить любые кнопки (например, «Пропустить»), что, вероятно, невозможно при использовании UIPageControl по умолчанию. Таким образом, я не использовал их в своем коде UIPageViewController.

func presentationCount(for pageViewController: UIPageViewController) -> Int {}

func presentationIndex(for pageViewController: UIPageViewController) -> Int {}

Чтобы управлять новым UIPageControl, который я перетащил, я ввел протокол делегирования в свой UIPageViewController и заставил свой основной VC следовать протоколу. Затем я мог отправить сообщение в мой основной VC (UIPageControl — это выход в основном VC), когда пользователь пролистывал страницы.

protocol OnboardingViewControllerDelegate: class {
    func onboardingPageViewController(onboardingPageViewController: OnboardingViewController, didUpdatePageCount count: Int)
    func onboardingPageViewController(onboardingPageViewController: OnboardingViewController, didUpdatePageIndex index: Int)
}

В конце концов, результат следующий, чего я и хочу. Если кто-то хочет просмотреть код, он находится на github.

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

РЕДАКТИРОВАТЬ: добавлена ​​тень за представлениями, поэтому GIF изменен.

person Manganese    schedule 24.12.2017