[SwiftUI] modifier positionとoffset

SwiftUIで面白いのは、modifierをつける順番で、効果が全く変わったりすること。

特に、Textにbackgroundとその他modifierをつけると面白い

position modifier

position modifierは、その時点でparentから提案されている領域全てを使う。

なので、以下のコードは、描画可能領域を塗りつぶす

Text("Hello, world!")
.position(x: 100, y: 100)
.background(Color.red)

それと比較して、offset modifierは、単に描画域をoffsetするため、塗り潰される領域は、Textが必要と返した領域のみとなる

Text("Hello, world!")
.offset(x: 100, y: 100)
.background(Color.red)

ただし、offsetは、Textに付与されているので、Textはオフセットされた領域に描画されるけど、backgroundは本来(?)の位置を塗りつぶす

SwiftUI 面白いね!