GeometryReader in SwiftUI: An Annoying Nightmare

Рет қаралды 758

Күн бұрын

GeometryReader in SwiftUI: An Annoying Nightmare
SwiftUI Camp (50% OFF) 👉 store.rebeloper.com/swiftuica...
SwiftUI's GeometryReader can be challenging to work with due to its flexible and dynamic nature. While it offers powerful capabilities for creating responsive user interfaces by allowing views to adapt to the size and shape of their container, its reliance on coordinate spaces and relative sizing can lead to complexities in layout and positioning.
As a result, mastering GeometryReader necessitates a significant investment of time and effort to harness its full potential while navigating its inherent complexities. This is where this video will help.
00:00 INTRODUCTION
00:28 WHAT'S IS GEOMETRY READER
04:38 BETTER THAN GEOMETRY READER - GEOMETRY STACK
06:08 SWIFTUI CAMP
06:53 CENTER GEOMETRY READER CONTENTS
08:10 ADD AXIS TO GEOMETRY STACK
11:12 SET A CONTENT FOR GEOMETRY STACK
13:05 SET ALIGNMENT IN GEOMETRY STACK
19:15 SET SPACING FOR THE GEOMETRY STACK
23:45 WHERE TO GO FROM HERE
→ PLAYLIST:
SwiftUI Camp April 2024 👉 • GeometryReader in Swif...
DO YOU WANT TO ME TO WORK ON YOUR PROJECT?
HIRE ME → rebeloper.com/hire-us/
TOOLS I RECOMMEND:
→ rebeloper.com/tools
Resources: store.rebeloper.com/youtube-c...
__________
Get in touch:
→ support@rebeloper.com
SUBSCRIBE to weekly tips & tutorials for building iOS apps!
→ kzfaq.info?su...
GitHub: github.com/rebeloper/
Hire me: rebeloper.com/hire-us/
LinkedIn: / rebeloper
My Blog: rebeloper.com/blog
Follow me on Instagram: / rebeloper
Twitter: / rebeloper
______
#rebeloper

Пікірлер: 4

@rebeloper 3 ай бұрын

🤦‍♂ Forgot to move the proxy out. Here's the updated code (see the GeometryProxy added): import SwiftUI struct ContentView: View { var body: some View { GeometryStack(.top(spacing: 50)) { proxy in Color.teal Text("GeometryStack: \(proxy.size)") } } } #Preview { ContentView() } struct GeometryStack: View { private var axis: GeometryStackAxis @ViewBuilder private var content: (GeometryProxy) -> Content private var verticalAlignment: VerticalAlignment private var horizontalAlignment: HorizontalAlignment private var spacing: CGFloat? init(_ alignment: GeometryStackAlignment = .verticalCentered(spacing: nil), @ViewBuilder content: @escaping (GeometryProxy) -> Content) { switch alignment { case .leading(let spacing): self.horizontalAlignment = .leading self.verticalAlignment = .center self.spacing = spacing self.axis = .vertical case .trailing(let spacing): self.horizontalAlignment = .trailing self.verticalAlignment = .center self.spacing = spacing self.axis = .vertical case .verticalCentered(let spacing): self.horizontalAlignment = .center self.verticalAlignment = .center self.spacing = spacing self.axis = .vertical case .top(let spacing): self.horizontalAlignment = .center self.verticalAlignment = .top self.spacing = spacing self.axis = .horizontal case .bottom(let spacing): self.horizontalAlignment = .center self.verticalAlignment = .bottom self.spacing = spacing self.axis = .horizontal case .horizontalCentered(let spacing): self.horizontalAlignment = .center self.verticalAlignment = .center self.spacing = spacing self.axis = .horizontal case .depth: self.horizontalAlignment = .center self.verticalAlignment = .center self.axis = .depth } self.content = content } var body: some View { GeometryReader { proxy in Group { switch axis { case .vertical: VStack(alignment: horizontalAlignment, spacing: spacing) { content(proxy) } case .horizontal: HStack(alignment: verticalAlignment, spacing: spacing) { content(proxy) } case .depth: ZStack { content(proxy) } } } .frame(maxWidth: .infinity, maxHeight: .infinity) } } enum GeometryStackAxis { case vertical, horizontal, depth } enum GeometryStackAlignment { case leading(spacing: CGFloat?), trailing(spacing: CGFloat?), verticalCentered(spacing: CGFloat?) case top(spacing: CGFloat?), bottom(spacing: CGFloat?), horizontalCentered(spacing: CGFloat?) case depth } }

@rebeloper 3 ай бұрын

STOP using NavigationStack in SwiftUI - Navigation Coordinator is BETTER 👉 kzfaq.info/get/bejne/sJt5da56rK-tqnU.html&ab_channel=Rebeloper-RebelDeveloper