SwiftUIとは？わかりやすく解説

SwiftUIとは、Appleが開発した、アプリケーションのグラフィカルユーザーインターフェイス (GUI) を構築するためのフレームワークである。WWDC 2019で発表され^[1]、Xcode 11以降で利用可能となった。

概要

Swiftを利用して、すべてのAppleプラットフォームデバイス向けのアプリを単一のコードベースで開発できることを目的として開発された。SwiftUIが登場する前は、macOS向けにはCocoa/AppKitを、そしてiOSなどのモバイルプラットフォーム向けにはCocoa Touch/UIKitを使い分けなければならなかった。画面設計（UIデザイン）には、GUI部品の生成・配置や画面遷移をObjective-CやSwiftのようなプログラミング言語によってコードベースで記述する原始的な方法のほかに、Interface BuilderやStoryboardといった専用のツールを使うこともできたが^[2]、前者は外観のプレビューができずコード量も増えるため生産性に難があり、後者は管理すべきファイルの種類や数が増えて再利用性や移植性が低下する、といった問題を抱えていた。Interface Builderが自動生成するレイアウト管理ファイルはXML形式だが、プログラマーが直接編集するのには向いておらず、複数人で共同開発する際のコンフリクト解消が難しいという問題もあった^[3]。

SwiftUIの動作環境をサポートするオペレーティングシステムは、macOS Catalina 10.15以降、iOS/iPadOS/tvOS 13.0以降、watchOS 6.0以降、およびvisionOSである^[4]。またMac Catalystを利用してmacOS上で動作するiPad向けアプリを開発する際にSwiftUIを使用することもできる。

宣言型シンタックスにより、ユーザーインターフェイスの動作をシンプルに記述することができる^[5]。相対的なレイアウト方式を採用しており、またすべてのデバイスで自動的に各ウィジェットのデザインが変更されるため、同一のコードで他のプラットフォームに移植することが容易になる。

SwiftUIがカバーしきれない、プラットフォームごとに細やかなカスタマイズが必要な部分は、適宜プラットフォームのネイティブUI部品やフレームワークを組み合わせるといった相互運用も可能である^[6]。

Swift PlaygroundsもSwiftUIに対応している^[7]。

サンプルコード

Hello, World

以下はSwiftUIで単純なテキストラベルを表示するだけのViewを記述するプログラムである（Hello world）。ViewはSwiftUIにおいてUIの一部を表現するためのプロトコル（英語版）である^[8]。実際のアプリケーションとして動作させるには、ホスティングコードが必要となる。

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("Hello, World!")
    }
}

プレビュー用のPreviewProviderプロトコルを採用した構造体を別途定義しておくことで、Xcode上で実際の表示結果を確認しながらコーディングすることもできるようになる^[9]。

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

macOS Big Sur 11.0以降、iOS/iPadOS/tvOS 14.0以降、watchOS 7.0以降では、共通のライフサイクル管理用プロトコルとしてAppが導入され、コードベースの統一がさらに進んだ^[10]。

import SwiftUI

@main
struct HelloWorldApp: App {
    var body: some Scene {
        WindowGroup {
            Text("Hello, World!")
            //ContentView()
        }
    }
}