Код Воробья для iOS разработчиков
11.1K subscribers
378 photos
96 videos
2 files
302 links
Пишу для iOS разработчиков про Xcode, разработку на Swift и SwiftUI.
Реклама: sparrowcode.io/ru/ads
Автор: @ivanvorobei

РКН: bit.ly/sparrowcode
Download Telegram
Код Воробья для iOS разработчиков
Как устроен онбординг в App Store

Контроллер назвали OnboardingViewController. Не оборачивали в навигейшн. Основной вью выступает не коллекция, а UIScrollView.

Заголовок “What’s New…” поместили в контейнер, хотя внутри него только лейбл. Ячейки это UIView, а тайтл-описание находятся в стеке.

Тулбар обычная вью с фоном UIVisualEffectView. Текст с кнопкой "See how your data..." это UITextView.
Иконка, текст и кнопки в тулбаре поместили в вертикальный стек. Ненормально большой отсуп снизу тулбара задан фикс значением от layoutMargins.bottom + 89.

#ViewHierarchy
Код Воробья для iOS разработчиков
Как устроен системный калькулятор

Приложение написано на сценах. Root-контроллер называется DisplayViewController. Лейбл с введенными цифрами обернули в контейнер DisplayView и добавили жесты LongPress, Swipe и Tap.

Клавиатуру сделали обычный вью и назвали CalculatorKeypadView. Кнопки сделаны как UIButton. Все кнопки - объекты одного класса, даже измененный 0. Контейнер лейаутится через AutoLayout, а вот сетку с кнопками расставили с помощью фреймов.

#ViewHierarchy
Код Воробья для iOS разработчиков
Как устроено приложение Wallet

Сделали на сценах, а лейаут на фреймах. Рут контроллер называется PKPassGroupsViewController. Главная вью UIStackView, в неё поместили: заголовок Wallet, группу карточек, группу бонусных карт и футер.

Каждую карточку поместили в контейнер PKPassGroupView. Внутри находится скрол-вью, которая отрабатывает жесты и является саб-контейнером карточки. Получается каждая карточка лежит на скрол-вью и управляется жестами на скролле 🤯. Понятия не имею как это работает.

Чтобы управлять пространством сверху для тапа - эпл сделала переиспользуемый класс. Каждую карточку поместили в ещё один саб-контейнер с названием WLEasyToHitCustomView (переводится легко нажать). Возможно, связали контейнеры в родителе или через делегаты.

#ViewHierarchy
Код Воробья для iOS разработчиков
Как устроено приложение погоды. Пока для iOS 14, постараюсь сделать для iOS 15 тоже.

Написали на сценах. Корневой UISplitViewController. Для компактного режима поставили page-контроллер. Фон и анимации сделаны на трех CALayer и одного градиента.

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

Тулбар сделали кнопками. Сепаратор это UIView c эффектом. Индикатор-точки нативный от page-контроллера.

#ViewHierarchy
Код Воробья для iOS разработчиков
Как устроено приложение Настройки. Сделано нативно.

Сделали на сценах. Root это split-контроллер, проявляется на 5.5+ айфоне и айпадах. Домашний экран назвали UIPrefsListController.

Ячейки, иконки и аксесуары установлены в дефотные вьюхи. На втором скрине кликабельный текст в футере сделали через кастомную футер-вью. Кнопку добавили через формат-текст в UITextView.

Когда доступно обновление, на домашнем экране появляется ячейка с красным кружком. Это сделали картинкой с лейблом, класс назвали BadgedTableViewCell. Ячейка аккаунта названа UIAppleAccountCell.

Иконки ячеек установлены в дефолтный контейнер. Библиотека SPSettingsIcons генерирует такие иконки для SFSymbols кодом.

#ViewHierarchy
Код Воробья для iOS разработчиков
Как устроено приложение Телефон. Cкучно, не считая кнопок.

Приложение сделали на сценах, практически весь лейаут на констрейнтах. В предыдущих разборах я писал как эпл называет классы, но в этом приложении рут-контроллер называется RootController. На имена классов забьем.

Контейнер с кнопками лейаутится с помощью автолейаута, но сами кнопки цифра+буквы на фреймах. Кнопки это UIButton. На каждую кнопку добавили LongPress жест. Цифра и буквы в кнопке это не текст, а отрисованный слой. Возможно, для PP или это особенный шрифт, а эпл не хочет делиться. Кнопки Позвонить и Удалить это UIButton, но контент поставили картинкой.

Поле ввода UITextField, контейнер назвали HandsetDialerLCDView. В текст-филд добавили много жестов: TextMultiTap, TapAndAHalf, VariableDelayLoupe и Tap.

#ViewHierarchy
Код Воробья для iOS разработчиков
Как устроен новый segment-бар в AppStore. В навигейшн-бар добавили вручную search-бар и коллекцию. Ячейки коллекции назвали GuidedSearchTokenCell. Крестик в ячейках это не кнопка, а картинка. Зачем-то в каждую ячейку добавили LongPress жест, но действий по нему не нашёл.

#ViewHierarchy
Код Воробья для iOS разработчиков
This media is not supported in your browser
VIEW IN TELEGRAM
Как устроено приложение Календарь. Сделали на сценах. Навигацию между страницами сделали на скрол-вью, назвали BlockableScrollView. У скрола включен пейджинг. В памяти хранят вчерашений и завтрашний день - в Календаре используют кастомную систему переиспользования на скроле. Контейнером установили UINavigationController.

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

У события две точки слева внизу и справа вверху. Жест драга добавлен один на весь экран - проверяется какой элемент попал под палец.

#ViewHierarchy