С помощью нескольких макетов мы можем компоновать представления различными способами. Одним из важнейших параметров является интервал (spacing) между дочерними элементами конкретного макета. На этой неделе мы узнаем, как создать кастомный макет, позволяющий задавать определенное расстояние между представлениями, и как соблюдать платформенно-ориентированные предопределенные правила интервалов в SwiftUI. Как и многие типы, которые мы создаем в Swift, тип, соответствующий протоколу Layout, может определять свои свойства и инициализировать их с помощью функции init. Наш тип FlowLayout не является здесь исключением. Давайте добавим свойство spacing к типу FlowLayout. Чтобы узнать больше об основных принципах работы протокола Layout, ознакомьтесь с моей статьей "Создание пользовательского макета в SwiftUI. Основы". Как видно из вышеуказанного примера, теперь мы можем разместить инстанс типа FlowLayout с определенным интервалом между представлениями. Но сначала мы должны настроить функцию sizeThatFits так, чтобы она учитывала интервал между представлениями при расчете окончательного размера макета. Во-вторых, мы должны добавить интервалы между представлениями при их размещении в функции placeSubviews. Наконец, у нас есть полноценно работающий FlowLayout, позволяющий устанавливать кастомные интервалы между представлениями. Как видите, большинство макетов в SwiftUI позволяют устанавливать интервал в nil, когда макет использует предпочтительный интервал вместо нулевого. В SwiftUI есть различные предпочтения по расстоянию между представлениями. Например, между представлениями "Image" и "Text" существует предпочтительный интервал, но он может отличаться для представлений "Text" и "Text". И эти предпочтения по расстоянию между представлениями могут быть разными для iOS, macOS, watchOS и tvOS. К счастью, SwiftUI предоставляет API для расчета расстояний между представлениями с учетом платформенно-ориентированных настроек интервалов. Этот API является частью протокола Layout и находится в типе прокси Subview. Давайте начнем с добавления свойства spacing в наш кэш. Это идеальный кандидат для размещения в кэше, потому что нам нужно вычислять его при каждом изменении списка вложенных представлений. Далее мы перебираем вложенные представления и используем свойство spacing в типе Subview для вызова функции distance с последующим представлением в качестве параметра для вычисления предпочтительного интервала между двумя представлениями по горизонтальной оси. При необходимости мы также можем определить размер вертикального интервала между представлениями, используя ту же функцию с параметром vertical для вертикальной оси. Чтобы узнать больше об имплементации кэша макета, посмотрите мою статью "Создание пользовательского макета в SwiftUI. Кэширование". Давайте настроим функцию sizeThatFits так, чтобы она учитывала интервалы между представлениями при расчете окончательного размера макета. Следующим шагом будет добавление интервалов между представлениями при их размещении. Мы можем применить аналогичные изменения к функции placeSubviews для соблюдения предпочтительного расстояния между различными представлениями. Наконец, у нас есть макет потока, в котором по умолчанию соблюдается предпочтительный интервал между представлениями. Протокол Layout предоставляет API для создания многократно используемых макетов на всех платформах. Нам следует внимательно изучить API, предоставляемый SwiftUI, чтобы создавать макеты с соблюдением платформенно-ориентированных правил. Надеюсь, вам понравилась эта статья. Не стесняйтесь присоединиться ко мне в Twitter и задавать вопросы, связанные с данным постом. Спасибо, что прочитали, и до встречи на следующей неделе! Кстати, компания Apple недавно анонсировала фреймворк Swift Charts, который мы можем использовать для создания диаграмм в приложениях. Приглашаю всех на бесплатный урок, где рассмотрим возможности API Swift Charts. Зарегистрироваться на бесплатный урок