iOS/macOS UIフレームワーク SwiftUIプログラミング
iOS/macOS UIフレームワーク SwiftUIプログラミング
秀和システム
著者:掌田津耶乃
はじめに
Chapter 1 iOSアプリとSwiftUIの基本
1-1 SwiftUIのセットアップ
macOS/iOS開発の流れ
SwiftUIとは?
SwiftUIに必要なもの
iOSアプリ開発で覚えよう
1-2 SwiftUIプロジェクト
Xcodeのウェルカムウインドウ
SwiftUIのプロジェクトを作成する
Column No Author informationについて
プロジェクトウインドウについて
ナビゲーターについて
プロジェクトの構成
プレビューを表示する
シミュレータで実行する
シミュレータのハードウェア設定
プレビューで表示、シミュレータで動作
Chapter 2 Text、TextField、Buttonをマスターする
2-1 Textの基本をマスターする
ContentViewの基本形
Column クラス? 構造体?
ContentView.swiftのソースコードを整理する
ContentView構造体の内容
ContentView_Previews構造体の内容
ContentViewはどこで使われる?
Textについて
2-2 主な属性とModifier
Textの基本属性
Font属性を設定する
属性操作メソッドとModifier
システムフォントを設定する
カスタムフォントを指定する
ボールドとイタリックの設定
Column メソッドチェーンについて
フォントの太さを設定する
テキストの色を変更する
背景色の設定
View用メソッドとText用メソッド
パディングを設定する
Column paddingとbackgroundの呼び出し順に注意!
余白の場所を指定するEdge.Set構造体
frameでサイズを指定する
positionで位置を指定する
borderによる輪郭の描画
2-3 複数Viewのレイアウト
VStackおよびHStack
VStackおよびHStackの使い方
複数のTextを並べてみる
部品を縦横に配置する
VStackおよびHStackのプロパティ設定
Column コントロールは最大10個まで!
ForEachによる複数項目の生成
プロパティをデータに利用する
ForEachの引数にデータを渡す
Identifiableなデータを用意する
Dividerで仕切りを表示する
Spacerによるスペース設定
固定幅のスペース
2-4 ButtonとTextFieldを利用する
Buttonを利用する
Buttonをタップして処理を行う
State変数について
Column 「属性」って何?
ユーザーが入力するTextFieldを利用する
TextFieldの入力イベント
Column イベントの発生順に注意!
Textをタップするには?
ダブルタップの処理
Column 複数のタップ処理も実装できる?
ロングプレスのイベント処理
Column オブジェクト指向からプロトコル指向へ
Chapter 3 コントロールとコンテナ
3-1 コントロールをマスターする
ON/OFFする「Toggle」
Column ON/OFF時のイベント処理は?
数値を入力する「Slider」
onEditingChangedによる編集中イベントの処理
Stepper
Stepperでコントロールを増減する
複数項目から選択する「Picker」
日付を設定する「DatePicker」
Column 「.none」の「.」の意味は?
日付ピッカーの表示とロケール設定
3-2 コントロールをレイアウトするコンテナ
フォームの利用
Form外にGUIがあると?
Sectionによるグループ化
Form内のコントロールを変更するには?
Listについて
複雑なコントロールの表示
Column Listはどう使うの?
表示のスクロールについて
3-3 複雑なコンテナ
ナビゲーションとNavigationView
NavigationLinkを使う
NavigationViewでPicker使う
Column 1回だけしかナビゲーションで移動できない?
タブで表示をする「TabView」
ZStackによる重ね合わせ
コントロールをグループ化する「Group」
定形コントロールを作る「TupleView」
不特定のコントロールを利用する「AnyView」
コントロール使いこなしのポイントは?
Column 命令型から宣言型UIプログラミングへ
Chapter 4 シェイプによるグラフィック
4-1 シェイプの利用
シェイプとは?
四角形の「Rectangle」
Rectangleを表示する
Column frameやpositionは使いたくない!
四角形の輪郭だけ描くには?
半透明とForEachによる繰り返し
Column CGFloatについて
丸みのある四角形「RoundedRectangle」
真円を描く「Circle」
楕円を描く「Ellipse」
カプセル状の図形を描く「Capsule」
4-2 図形のイベント処理
基本は「onTapGesture」
図形の重ね合わせとzIndex
gestureメソッドとDragGesture
シェイプをタップして移動する
タップすると図形が増える
ドラッグできるシェイプ
タップを処理する「TapGesture」
ロングプレスを処理する「LongPressGesture」
4-3 Pathによる複雑な図形
Pathとは?
「move」「addLine」による直線の描画
Column Pathはメソッドチェーンが使えない!
strokeによる線の描画
StrokeStyleによる線の設定
点線・破線の表示
四角形を追加する「addRect」
四角形の角を丸くする「addRoundedRect」
円を描く「addEllipse」
円弧を描く「addArc」
2次ベジエ曲線を描く「addQuadCurve」
3次ベジエ曲線を描く「addCurve」
図形とCore Graphics構造体の関係
4-4 図形を更に活用する諸機能
グラディエーションで描画する
円形のグラディエーション
イメージの表示
イメージで図形を塗りつぶす
図形のトランスフォーム
トランスフォーム用シェイプ
Column rotationがあればRotatedShapeはいらない?
クリッピングについて
オーバーレイとシャドウ
GeometryReaderによるジオメトリデータへのアクセス
Column GeometryReaderは「親コンテナ」のサイズ
図形の描画はPath次第!
Column SwiftUIか、UIKitか?
Chapter 5 より高度な表現とデータアクセス
5-1 アラート、シート、ポップオーバー
Alertによるアラート表示
選択したボタンに応じて処理する
アクションシートについて
ポップオーバー
5-2 視覚効果とアニメーション
表示のON/OFFとtransition
Column opacityがなめらかに変化しない?
Column withAnimationの正体は「Animation」
AnyTransitionのプロパティ
animationの働き
シェイプを動かす
より複雑なアニメーション
Animationについて
アニメーションの動きを調整する
エンドレスなアニメーション
5-3 外部データの取得と利用
外部データとモデルクラス
外部からテキストデータを取得する
URLSessionとdataTask
@escapingと非同期クロージャ
LoremModelモデルクラスを作る
ContentViewからLoremModelを利用してリストを表示する
JSONデータを利用する
データ用のFireData構造体を用意する
外部サイトにアクセスするサービスを作る
JSONDecoderによるJSONデータの変換
FireModelモデルクラスを作る
ContentViewからFireModelを利用してリストを表示する
サーバーからイメージを取得し表示する
PicsumServiceの作成
PicsumModelクラスを作成する
ContentViewを修正する
ファイルを利用するには?
TextFileServiceを作成する
TextFileModelを作成する
ContentViewでテキストファイルを利用する
Column ファイルの保存場所について
URLと取得データの処理がポイント
Column macOSアプリを作るには?
Chapter 6 カスタム部品、プレビュー、UIテスト
6-1 カスタムViewの実装
ViewBuilderとViewModifier
ViewBuilderの働き
CustomContainerクラスを作る
CustomContainerを利用する
ViewModifierについて
CustomTextを作成する
CustomTextを利用する
ViewBuilderやViewModifierを使わないカスタムコントロールの作成
6-2 カスタムStyleの実装と利用
コントロールのスタイルを作成する
CheckboxStyle構造体を作成する
Column SF Symbolsについて
CheckboxStyleを使ってToggleを作る
ButtonStyleを作成する
独自シェイプの作成
芒形シェイプを作る
Asterをアニメーションに対応させる
6-3 プレビューの活用
ContentView_Previewsについて
プレビューデバイスとプレビュー名
iPhone SEでプレビューする
利用可能なデバイス名
ForEachで複数デバイスを表示する
タブのコンテンツをプレビューで確認する
プレビューの限界
6-4 UIテストの基本
XCTestによるUIテスト
XCUIApplicationについて
テスト用のアプリを用意する
TextFieldを操作する
TextFieldを取り出す
Column コントロール名には注意!
TextFieldをタップする
テキストを入力する
カット&ペーストするには?
XCTAssertTrueについて
Toggleの操作と値のチェック
Stepperの操作
XCUICoordinateによる位置の指定
プレスとドラッグについて
アラートの表示と操作
UIテストは、tapしてXCTAssertTrueする
Appendix 追補 Swift基礎文法入門
A-1 値・変数・演算
プレイグラウンドを用意しよう
プレイグラウンドを使おう
値と変数を使おう
値と変数を使ってみる
変数の宣言と代入
変数には「タイプ」がある
タイプを指定しない変数は?
四則演算をする
異なるタイプの演算は?
テキストの演算
テキストに値を埋め込む
A-2 構文をマスターしよう
制御構文とは?
二者択一の「if」文
比較演算子について
複数の分岐を行う「switch」文
条件で繰り返す「while」文
範囲指定で繰り返す「for」文
関数について
引数を利用する
戻り値を利用する
クロージャについて
クロージャを返す関数
A-3 複雑な値
配列について
配列とfor
辞書(ディクショナリ)について
Optionalとは?
辞書とfor文
タプルについて
構造体について
A-4 オブジェクト指向とクラス
オブジェクト指向とは?
クラスについて
Computedプロパティ
継承について
メソッドのオーバーライド
列挙体(enum)について
静的プロパティと静的メソッド
プロトコルについて
まだまだある、Swiftの機能
Index 索引
著者略歴