iPadのPlaygroundsでSwiftUIを試す
iPad用アプリ Swift Playgrounds の新バージョン3.1が Swift 5.1 に対応し SwiftUI も実行できるようになったので早速ためしてみました。
この記事は有料ですが期間限定で全部読めます。
♡クリックやシェアなどでご支援いただけるとありがたいです。
[2019年12月5日]ソースコードを若干修正しました。
SwiftUIをiPadで実行
実行した画面です:
iPadの実行環境
Swift Playgrounds は最新の3.1にアップデートしています。
iPad の OSは13.1.1、9.7インチのiPad Proです。
「空白」のテンプレートで新規に作成しました。
Playgrounds 3.1ではテンプレートは Swift 5.1版になっています。
古い書類では試していません。
SwiftUIをどうやって表示するか
最初の画面の全コードです:
※flagプロパティにprivateを追加しました[2019年12月5日]
// PlaygroundsでSwiftUI
import SwiftUI
import PlaygroundSupport
struct FirstSample: View {
@State private var flag: Bool = true
var body: some View {
VStack {
Text("iPadのPlaygroundsで")
.padding()
Text("SwiftUI🤯")
.padding()
.font(.largeTitle)
.background(Color.green)
Toggle(isOn: $flag, label: {
Text("最新を試す")
})
.padding(50)
}
}
}
PlaygroundPage.current.liveView = UIHostingController(rootView: FirstSample())
PlaygroundSupport だけでなく SwiftUI もインポートします。
SwiftUI 部分のコードはそのまま記述します。
ライブビューの指定が UIHostingController(rootView: FirstSample()) とします。FirstSample() が SwiftUI のビューです。
SwiftUI のビューをUIKitで使えるようにするだけです。
実行時には『"結果"を有効にする』をオフにするのが良いでしょう。
これだけでとても手軽に、リリース済みのOSで SwiftUI を試すことができます。
気づいた点
リアルタイムでプレビューを表示するわけではありません。
実行ボタンタップでライブビューに表示します。
SwiftUI のコード部分は改行やインデントが乱れている部分があります。
SwiftUI 部分入力中のコード補完は改善の余地があります。
ソフトウェアキーボードでのコード入力も使いやすいとはまだ言えません。
Xcode11ならMojaveでもSwiftUIを試せる
上記のコードを Xcode 11.1 の Playground で実行するとそのまま動きます。
追伸:現在最新の Xcode 11.2.1 でも問題なう実行できます。
(プレビューではないので Runは必要です。実行中はトグルスイッチの操作も可能です。)
いろいろ厄介なmacOSのアップデートをしなくても最新の Xcode で SwiftUI を試すことができます。
Xcode 11 では行番号上の runボタンをクリックすると自動でライブビューが開きました。
SwiftUI関連の有料記事をまとめたマガジンを作りました。
ご購入いただくと今後の追加記事も読めます。
Appleのブックストアから『Swift5初級ガイド』をリリースしました。
2019年12月2日 加筆修正した第4版がダウンロード可能になりました。(ご購入済みの場合は無料アップデートです)
Swift5.1の追加変更点は第3版で対応済みです。
ブックストアで購入した電子書籍はほぼリアルタイムで無料アップデートが読めるので安心です。
サンプルは無料ですが、こちらの記事にページのサンプルなどを確認できます。
おしらせ
私の活動内容はこちらをご覧ください。
iOSアプリ作りをアシストするセミナーは今後も月一回のペースで続ける予定です。
詳細は connpass.com の 札幌Swiftでご確認ください。そして機会があればぜひ参加してください。
アプリ作りやプログラミング教育に関連する話題は 札幌Swift のfacebookページで発信しています。
ここから先は
¥ 100
今後も記事を増やすつもりです。 サポートしていただけると大変はげみになります。