SwiftUI

СОЗДАЙТЕ ОДИН РАЗ ИСПОЛЬЗУЙТЕ ВЕЗДЕ

Новый декларативный UI Framework, управляемый государством

Apple потрясла мир iOS с помощью WWDC 2019, когда анонсировала свою новую управляемую государством декларативную структуру пользовательского интерфейса. Это изменение к лучшему, и в этой статье мы познакомим с фреймворком и затронем некоторые из его новых компонентных примитивов.

Прежде чем мы начнем, многие из вас могут оказаться перед дилеммой: начинать SwiftUI учиться или расширять UIKit’s знания. Ответ на этот вопрос прост: поскольку многие текущие приложения все еще должны поддерживать версии ОС ниже iOS13, рекомендуется продолжать расширять свои горизонты в обоих направлениях.

iOS13 - это минимальная версия развертывания для SwiftUI.

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

Поскольку SwiftUI только что вышел из бета-версии, можно ожидать появления некоторых известных проблем и значительных изменений в API.

Чтобы начать сборку, вам понадобится Xcode 11+, и вы можете скачать его с developer.apple.com. Вы также заметите, что Xcode 11 "из коробки" поддерживает новую функцию под названием рендеринг в реальном времени. Благодаря рендерингу в реальном времени вам больше не нужно создавать свои проекты, чтобы увидеть пользовательский интерфейс на симуляторе. Но минимальная необходимая версия Mac OS для поддержки рендеринга - Mac OS Catalina. .

Вы можете установить Xcode 11+ и работать с ним в Mac OS Mohave, но рендеринг в реальном времени в этом случае работать не будет.

Swift UI - фреймворк

По словам Apple, Swift UI обеспечивает исключительно простой и быстрый способ создания пользовательских интерфейсов на всех платформах Apple с помощью Swift.

Это структура для создания пользовательских интерфейсов, которая значительно сокращает объем стандартного кода, необходимого для создания пользовательских интерфейсов. Хороший пользовательский интерфейс построен на основе компонентов пользовательского интерфейса, которые адаптируются к разным размерам и типам устройств. Swift UI позволяет вам как разработчику с минимальными усилиями поднять этот опыт на ступень выше, поскольку он обеспечивает автоматическую поддержку для Dynamic Type, Dark Mode, Localization и Accessibility из коробки.

Вы столкнетесь со многими знакомыми функциями, такими как текст, изображения, навигация, жесты, работая с Swift UI.

В мире Swift UI мы определяем наш UI, создавая представления. Эти представления представляют собой детализированные и управляемые компоненты пользовательского интерфейса, которые можно комбинировать для создания более крупных и сложных иерархий с использованием декларативного стиля программирования.

Декларативный интерфейс: определите ЧТО, а не КАК.

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

В декларативном пользовательском интерфейсе мы объявляем пользовательский интерфейс в терминах его иерархии с использованием повторно используемых компонентов. Следующее изображение от Apple дает некоторый контекст:

Пример кода, который написан слева, точно имитирует следующую иерархию:

Составить мысленную карту иерархии представлений для кода, написанного выше, очень просто.

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

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

Это работает полностью противоположно традиционному императивному способу компоновки пользовательского интерфейса, когда от разработчиков требуется предоставить абсолютно все свойства и ограничения компоновки.

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

Swift UI против традиционных раскадровок

Декларативный стиль пользовательского интерфейса очень близко имитирует реальную иерархию представлений. Давайте посмотрим на следующий пример:

import SwiftUI 
struct ContentView: View { 
    var body: some View { 
        Text(“Turtle Rock”) 
            .font(.title) 
            .foregroundColor(.green)
    }
} 
struct ContentView_Preview: PreviewProvider { 
    static var previews: some View { 
        ContentView() 
    }
}

Код генерирует на устройстве следующий макет:

При первом взгляде на код иерархия представлений начинает иметь для вас некоторый смысл.

Чтобы создать подобное представление с помощью UIKit раскадровок, Xcode сгенерирует намного больше кода, которым трудно управлять при работе в коллективной среде. Если вы работаете в команде, небольшое изменение раскадровки, когда ваш коллега работает над той же раскадровкой, возможно, закончится рядом конфликтов слияния - мы все были в этом!

Если нам нужно создать подобное представление в традиционной раскадровке, код, который Xcode сгенерирует под капотом, будет выглядеть примерно так:

Как видите, этот код намного больше, чем то, что мы должны написать с помощью Swift UI.

Чтобы избежать конфликтов слияния и решить проблемы с раскадровками, многие команды избегали использования раскадровок и вместо этого перешли на программный пользовательский интерфейс, чтобы создавать представления для приложения IOS с использованием Visual format language, NSLayoutConstraints, NSLayoutAnchorsetc.

Два разных подхода были источником долгих жарких споров среди разработчиков iOS на протяжении многих лет, и SwiftUI стремится ответить на них всем, предлагая решение писать один раз и использовать где угодно.

Готовые к использованию преимущества Swift UI

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

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

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

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

За другими обновлениями вы можете следить за мной в Твиттере на моем твиттере @NavRudraSambyal.

Спасибо за чтение, поделитесь, если вы нашли его полезным 🙂

SwiftUI - Введение