【SwiftUI】Viewの分割

(2020/03/10 更新)

複雑なViewを小さなViewに分割する事で、繰り返しを避け、ソースを見やすくする方法を紹介します。
Viewを分割してもパフォーマンスに大きな影響を及ぼさないのがSwiftUIの特徴の一つです。

スポンサーリンク

環境

この記事の情報は次のバージョンで動作確認しています。

【Xcode】11.2.1
【Swift】5.1
【iOS】13.2.2
【macOS】Catalina バージョン 10.15.3

Viewのプロパティ化

SwiftUIではViewをプロパティに代入して、コンテナ内で使用できます。
定義したプロパティに対して、さらにModifierを適用可能です。

Viewのプロパティ化

この例では、枠付きTextをプロパティtextWithBorderに代入した後、Modifierを適用して個別に色を変えています。

使用上の注意点としては、他のプロパティを参照するような記述をプロパティに含められません。これは、オブジェクトの作成時に問題が発生する為です。
そのような場合は、次に紹介するカスタムViewで実現します。

カスタムViewの作成

カスタムViewでは、引数が指定できる等、より複雑な制御が可能です。
以下は、テキストを引数で指定可能な枠付きTextを表示するカスタムViewの作成例です。

カスタムViewの作成

あわせて読みたい記事

【SwiftUI】図形のパス(線)描画(stroke)
図形のパス(線)を描画する.stroke()の使い方を解説します。
【SwiftUI】Viewの背景設定と重ね合わせ
Viewの背景設定と、別のViewを重ねる方法を解説します。
SwiftUI
スポンサーリンク
スポンサーリンク
カピ通信

コメント