Как устроен онбординг в App Store
Контроллер назвали
Заголовок “What’s New…” поместили в контейнер, хотя внутри него только лейбл. Ячейки это
Тулбар обычная вью с фоном
Иконка, текст и кнопки в тулбаре поместили в вертикальный стек. Ненормально большой отсуп снизу тулбара задан фикс значением от layoutMargins.bottom + 89.
#ViewHierarchy
Контроллер назвали
OnboardingViewController. Не оборачивали в навигейшн. Основной вью выступает не коллекция, а UIScrollView. Заголовок “What’s New…” поместили в контейнер, хотя внутри него только лейбл. Ячейки это
UIView, а тайтл-описание находятся в стеке.Тулбар обычная вью с фоном
UIVisualEffectView. Текст с кнопкой "See how your data..." это UITextView. Иконка, текст и кнопки в тулбаре поместили в вертикальный стек. Ненормально большой отсуп снизу тулбара задан фикс значением от layoutMargins.bottom + 89.
#ViewHierarchy
👍32🔥15❤2
Как устроен системный калькулятор
Приложение написано на сценах. Root-контроллер называется
Клавиатуру сделали обычный вью и назвали
#ViewHierarchy
Приложение написано на сценах. Root-контроллер называется
DisplayViewController. Лейбл с введенными цифрами обернули в контейнер DisplayView и добавили жесты LongPress, Swipe и Tap.Клавиатуру сделали обычный вью и назвали
CalculatorKeypadView. Кнопки сделаны как UIButton. Все кнопки - объекты одного класса, даже измененный 0. Контейнер лейаутится через AutoLayout, а вот сетку с кнопками расставили с помощью фреймов.#ViewHierarchy
🔥53👍20😱4❤3🎉1
Как устроено приложение Wallet
Сделали на сценах, а лейаут на фреймах. Рут контроллер называется
Каждую карточку поместили в контейнер
Чтобы управлять пространством сверху для тапа - эпл сделала переиспользуемый класс. Каждую карточку поместили в ещё один саб-контейнер с названием
#ViewHierarchy
Сделали на сценах, а лейаут на фреймах. Рут контроллер называется
PKPassGroupsViewController. Главная вью UIStackView, в неё поместили: заголовок Wallet, группу карточек, группу бонусных карт и футер.Каждую карточку поместили в контейнер
PKPassGroupView. Внутри находится скрол-вью, которая отрабатывает жесты и является саб-контейнером карточки. Получается каждая карточка лежит на скрол-вью и управляется жестами на скролле 🤯. Понятия не имею как это работает.Чтобы управлять пространством сверху для тапа - эпл сделала переиспользуемый класс. Каждую карточку поместили в ещё один саб-контейнер с названием
WLEasyToHitCustomView (переводится легко нажать). Возможно, связали контейнеры в родителе или через делегаты.#ViewHierarchy
🔥35👍9😱8
Как устроено приложение погоды. Пока для iOS 14, постараюсь сделать для iOS 15 тоже.
Написали на сценах. Корневой
Контент лежит на вертикальном скроле. Температуру по часам сделали горизонтальной коллекцией. А вот температуру по дням ниже - обычными вью с автолейаутом, даже не в стеке.
Тулбар сделали кнопками. Сепаратор это
#ViewHierarchy
Написали на сценах. Корневой
UISplitViewController. Для компактного режима поставили page-контроллер. Фон и анимации сделаны на трех CALayer и одного градиента.Контент лежит на вертикальном скроле. Температуру по часам сделали горизонтальной коллекцией. А вот температуру по дням ниже - обычными вью с автолейаутом, даже не в стеке.
Тулбар сделали кнопками. Сепаратор это
UIView c эффектом. Индикатор-точки нативный от page-контроллера.#ViewHierarchy
👍56🔥6😱2
Как устроено приложение Настройки. Сделано нативно.
Сделали на сценах. Root это split-контроллер, проявляется на 5.5+ айфоне и айпадах. Домашний экран назвали
Ячейки, иконки и аксесуары установлены в дефотные вьюхи. На втором скрине кликабельный текст в футере сделали через кастомную футер-вью. Кнопку добавили через формат-текст в
Когда доступно обновление, на домашнем экране появляется ячейка с красным кружком. Это сделали картинкой с лейблом, класс назвали
Иконки ячеек установлены в дефолтный контейнер. Библиотека SPSettingsIcons генерирует такие иконки для SFSymbols кодом.
#ViewHierarchy
Сделали на сценах. Root это split-контроллер, проявляется на 5.5+ айфоне и айпадах. Домашний экран назвали
UIPrefsListController.Ячейки, иконки и аксесуары установлены в дефотные вьюхи. На втором скрине кликабельный текст в футере сделали через кастомную футер-вью. Кнопку добавили через формат-текст в
UITextView. Когда доступно обновление, на домашнем экране появляется ячейка с красным кружком. Это сделали картинкой с лейблом, класс назвали
BadgedTableViewCell. Ячейка аккаунта названа UIAppleAccountCell.Иконки ячеек установлены в дефолтный контейнер. Библиотека SPSettingsIcons генерирует такие иконки для SFSymbols кодом.
#ViewHierarchy
👍43🔥6❤4
Как устроено приложение Телефон. Cкучно, не считая кнопок.
Приложение сделали на сценах, практически весь лейаут на констрейнтах. В предыдущих разборах я писал как эпл называет классы, но в этом приложении рут-контроллер называется
Контейнер с кнопками лейаутится с помощью автолейаута, но сами кнопки цифра+буквы на фреймах. Кнопки это
Поле ввода
#ViewHierarchy
Приложение сделали на сценах, практически весь лейаут на констрейнтах. В предыдущих разборах я писал как эпл называет классы, но в этом приложении рут-контроллер называется
RootController. На имена классов забьем.Контейнер с кнопками лейаутится с помощью автолейаута, но сами кнопки цифра+буквы на фреймах. Кнопки это
UIButton. На каждую кнопку добавили LongPress жест. Цифра и буквы в кнопке это не текст, а отрисованный слой. Возможно, для PP или это особенный шрифт, а эпл не хочет делиться. Кнопки Позвонить и Удалить это UIButton, но контент поставили картинкой. Поле ввода
UITextField, контейнер назвали HandsetDialerLCDView. В текст-филд добавили много жестов: TextMultiTap, TapAndAHalf, VariableDelayLoupe и Tap.#ViewHierarchy
👍66❤5🔥5
Как устроен новый segment-бар в AppStore. В навигейшн-бар добавили вручную search-бар и коллекцию. Ячейки коллекции назвали
#ViewHierarchy
GuidedSearchTokenCell. Крестик в ячейках это не кнопка, а картинка. Зачем-то в каждую ячейку добавили LongPress жест, но действий по нему не нашёл.#ViewHierarchy
👍50🔥7❤1
This media is not supported in your browser
VIEW IN TELEGRAM
Как устроено приложение Календарь. Сделали на сценах. Навигацию между страницами сделали на скрол-вью, назвали
Ячейки событий сделали двухслойными картинками 🤯. Первый слой - фоновая картинка, а текст внутри события - слой повыше. Скорее всего так сделали для оптимизации скрола.
У события две точки слева внизу и справа вверху. Жест драга добавлен один на весь экран - проверяется какой элемент попал под палец.
#ViewHierarchy
BlockableScrollView. У скрола включен пейджинг. В памяти хранят вчерашений и завтрашний день - в Календаре используют кастомную систему переиспользования на скроле. Контейнером установили UINavigationController.Ячейки событий сделали двухслойными картинками 🤯. Первый слой - фоновая картинка, а текст внутри события - слой повыше. Скорее всего так сделали для оптимизации скрола.
У события две точки слева внизу и справа вверху. Жест драга добавлен один на весь экран - проверяется какой элемент попал под палец.
#ViewHierarchy
🔥46👍15🐳7😱3❤2👏2⚡1🤩1🏆1