【Swift UI】@ViewBuilderの使い方!カスタムスタックとTupleView型

この記事からわかること
- Swift UIの@ViewBuilderとは?
- 役割と使い方
- TupleViewとは
- ビューを複数構築する方法
- Function declares an opaque return type, but has no return statements in its body from which to infer an underlying typeとは?
- カスタムスタックビューの実装する方法
index
[open]
\ アプリをリリースしました /
@ViewBuilderとは?
Swift UIの@ViewBuilder
属性とはクロージャから階層構造のビューを構築するためのResult Builderです。クロージャの前に付与して使用します。
通常クロージャが返すのは1つのビュー(値)だけですが、@ViewBuilder
を付与したクロージャは複数のビューを1つのビューとみなして返すことができます。
Function declares an opaque return type, but has no return statements in its body from which to infer an underlying type
@ViewBuilder
を外して以下のように実装しようとすると、Function declares an opaque return type, but has no return statements in its body from which to infer an underlying type
というエラーが発生します。
エラーが発生しないようにするにはGroup
やStack
などで囲って1つのビューにする必要があります。
TupleView型
@ViewBuilder
を使用して返されるのはTupleView
型です。異なる型を保持することができるタプルのような特性としてビューを保持するデータ型です。
おすすめ記事:タプルとは?使い方や注意点
使われているところ
@ViewBuilder
はSwift UIのさまざまなところで使用されています。例えばView
プロトコルのbody
プロパティやStack
のイニシャライザなど複数のビューを記述できる箇所に使用されていることが多いです。
カスタムスタックを実装する
@ViewBuilder
を使用することで間に任意のビューを挟める独自のコンテナビューを実装することができます。
言葉だけでは分かりにくいので一度使い方を見てみます。
ここではCustomStack
構造体を定義し、プロパティとしてView
プロトコルに準拠したジェネリック型のContent
型を定義しています。
またインスタンス化時にContent
型を渡せるようにイニシャライザから初期値を格納できるようにしています。そしてイニシャライザの引数定義の際に@ViewBuilder
を付与します。
ここでの@ViewBuilder
の役割はクロージャ内で複数のビューを単一のビューとして扱えるようにすることです。
あとはbody
プロパティの中に実装したいコンテナビューを記述し、イニシャライザで渡されるcontent
プロパティを呼び出します。
定義したコンテナビューは以下のように使用できます。
ご覧いただきありがとうございました。