SWiftUIでいこう- GeometryReader

チュートリアルをやっていく中で"GeometryReader"というのが出てきました。少し使い方をみていきます。

Viewのサイズを取得する時に使うようです。

GeometryReader | Apple Developer Documentation

以下サイトをXcodeで試してみます。

SwiftUIで画面の大きさに応じて内容が変わるビューを作る - Qiita

struct ContentView: View {
   var body: some View {
       GeometryReader{geometry in
           
           Text("\(Int(geometry.size.width)) x \(Int(geometry.size.height))")
  
       }
   }
}

として実行してみると、Preview画面には

という感じで画面サイズが表示されました。

SwiftUIの肝となるGeometryReaderについて理解を深める - Qiita

で紹介されていることを試してみます。

HStack(spacing: 0) {
       Text("Left")
          .frame(width: geometry.size.width / 2, height: 50)
          .background(Color.green)
       Text("Right")
          .frame(width: geometry.size.width / 2, height: 50)
          .background(Color.blue)
    }

実行すると

という感じに画面の幅を取得して半分ずつに表示されるようになりました。UIKitのUIScreenでも同じことができます。

.frame(width: UIScreen.main.bounds.width / 2, height: 200)

というようになります。

GeometryReaderは、親Viewのサイズや自身の座標を知ることができるので、アニメーションやインタラクティブなUIを実現するには欠かせない技術となる。自身のViewに対する親Viewが何かを把握して実装することが肝になりそうだ。

というふうにまとめてあります。