9

I wanted to use the GeometryReader to use some computation. Without my design looks like it should:

var body: some View {
    ZStack {
        Color(#colorLiteral(red: 0.117543973, green: 0.2897527516, blue: 0.4028342962, alpha: 1)).edgesIgnoringSafeArea(.all)
        VStack {
            HStack(spacing: self.spacing) { // todo auch berechnen?
                ForEach(self.chartValues, id: \.self) { point in
                    DataPoint(width: 200)
                }
            }.animation(.default)
        }
    }
}

enter image description here

After adding it, each line is overlapping each other in its height, did I something wrong:

var body: some View {
    ZStack {
        Color(#colorLiteral(red: 0.117543973, green: 0.2897527516, blue: 0.4028342962, alpha: 1)).edgesIgnoringSafeArea(.all)
        VStack {
            GeometryReader { geo in
                HStack(spacing: self.spacing) { // todo auch berechnen?
                    ForEach(self.chartValues, id: \.self) { point in
                        DataPoint(width: geo.size.width)
                    }
                }.animation(.default)
            }
        }
    }
}

enter image description here

gurehbgui
  • 14,236
  • 32
  • 106
  • 178
  • 3
    GeometryReader consumes all available space, so this might confuse some calculations if not taken into account. If you wrap something into GeometryReader all responsibility about layout is on you. – Asperi Dec 28 '19 at 19:19
  • Hi, thank you. I added a frame tag to the upper level and set a default Height. now its working fine. – gurehbgui Dec 29 '19 at 08:56
  • 1
    It is also possible to set GeometryReader around List and use its values inside cells by passing geometryproxy down view hierarchy – Michał Ziobro Mar 23 '20 at 10:28

0 Answers0