Refactor GobanView and ToolbarView for responsive layout

- Adjust view hierarchy based on size classes in both `GobanItems` and `ToolbarItems`
ChinChangYang · Oct 26, 2023 · 53b8b92 · 53b8b92
1 parent 68ee11c
commit 53b8b92
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 5 deletions.
diff --git a/ios/KataGo iOS/KataGo iOS/GobanView.swift b/ios/KataGo iOS/KataGo iOS/GobanView.swift
@@ -7,7 +7,7 @@
 
 import SwiftUI
 
-struct GobanView: View {
+struct GobanItems: View {
     @EnvironmentObject var stones: Stones
     @EnvironmentObject var board: ObservableBoard
     @EnvironmentObject var player: PlayerObject
@@ -16,7 +16,7 @@ struct GobanView: View {
     let texture = WoodImage.createTexture()
 
     var body: some View {
-        VStack {
+        Group {
             GeometryReader { geometry in
                 let dimensions = Dimensions(geometry: geometry, board: board)
                 ZStack {
@@ -81,6 +81,23 @@ struct GobanView: View {
     }
 }
 
+struct GobanView: View {
+    @Environment(\.horizontalSizeClass) var hSizeClass
+    @Environment(\.verticalSizeClass) var vSizeClass
+
+    var body: some View {
+        if hSizeClass == .compact && vSizeClass == .regular {
+            VStack {
+                GobanItems()
+            }
+        } else {
+            HStack {
+                GobanItems()
+            }
+        }
+    }
+}
+
 struct GobanView_Previews: PreviewProvider {
     static let stones = Stones()
     static let board = ObservableBoard()

diff --git a/ios/KataGo iOS/KataGo iOS/ToolbarView.swift b/ios/KataGo iOS/KataGo iOS/ToolbarView.swift
@@ -7,12 +7,12 @@
 
 import SwiftUI
 
-struct ToolbarView: View {
+struct ToolbarItems: View {
     @EnvironmentObject var player: PlayerObject
     @EnvironmentObject var config: Config
-    
+
     var body: some View {
-        HStack {
+        Group {
             Button(action: {
                 KataGoHelper.sendCommand("undo")
                 KataGoHelper.sendCommand("showboard")
@@ -69,6 +69,23 @@ struct ToolbarView: View {
     }
 }
 
+struct ToolbarView: View {
+    @Environment(\.horizontalSizeClass) var hSizeClass
+    @Environment(\.verticalSizeClass) var vSizeClass
+
+    var body: some View {
+        if hSizeClass == .compact && vSizeClass == .regular {
+            HStack {
+                ToolbarItems()
+            }
+        } else {
+            VStack {
+                ToolbarItems()
+            }
+        }
+    }
+}
+
 struct ToolbarView_Previews: PreviewProvider {
     static let player = PlayerObject()
     static let config = Config()