Implementação do depurador discreto SwiftUI

Se você quiser que a altura da visualização de rolagem ocupe todo o espaço disponível, então é totalmente apropriado usar GeometryReaderaqui. Não há nada de errado com isso. Caso contrário, você teria que usar alguma outra visualização que preencha o espaço disponível (por exemplo, Color.clear), e medir a geometria dessa visualização.

Color.clear
    .onGeometryChange(for: CGSize.self) { proxy in
        proxy.size
    } action: { newValue in
        viewSize = newValue
    }
    .overlay {
        ScrollView { ... } // the actual scroll view would go on an overlay
            .frame(height: viewSize?.height)
    }

Claramente, usar apenas um GeometryReaderé mais conveniente.

Neste caso em particular, se você quiser apenas impedir que o Texts seja recortado, você pode simplesmente desabilitar o recorte colocando scrollClipDisabled()na visualização de rolagem. Não há necessidade de fazer nada relacionado à geometria e você pode remover o framena visualização de rolagem.

Note que o Texts ainda estará fora dos limites do ScrollView. Se você quiser que eles fiquem dentro dos limites, considere usar a VStackpara dispor as marcas de escala e o texto:

ForEach(0...totalSteps, id: \.self) { index in
    let remainder = index % config.steps
    VStack {
        Rectangle() // changed the Divider to a Rectangle, because a Divider is horizontal in a VStack
            .fill( remainder == 0 ? Color.primary : Color.gray)
            .frame(width: 1, height: remainder == 0 ? 20 : 10, alignment: .center)
            .frame(maxHeight: 20, alignment: .bottom)
        Text("\(index / config.steps)")
            .font(.caption)
            .fontWeight(.semibold)
            .textScale(.secondary)
            .fixedSize()
            .opacity(remainder == 0 ? 1 : 0)
    }
}

Isso pressupõe que todo o texto tenha a mesma altura. Se você não puder supor isso, você pode encontrar as alturas máximas de todos os Texts usando uma chave de preferência. Então, defina a altura do HStackpara ser a altura máxima dos textos, mais a altura máxima dos divisores (ou seja, 20).

struct MaxHeightPreference: PreferenceKey {
    static let defaultValue: CGFloat = 0
    
    // this reduce implementation finds the maximum height of all the sibling views
    static func reduce(value: inout CGFloat, nextValue: () -> CGFloat) {
        value = max(value, nextValue())
    }
}

struct MaxHeightPreferenceModifier: ViewModifier {
    @State private var height: CGFloat = 0

    func body(content: Content) -> some View {
        content
            .onGeometryChange(for: CGFloat.self, of: \.size.height) { newValue in
                height = newValue
            }
            .preference(key: MaxHeightPreference.self, value: height)
    }
}

struct ScrollScrubber: View {
    var config:ScrubberConfig
    
    @State var viewWidth: CGFloat = 0
    @State var maxTextHeight: CGFloat = 0
    
    var body: some View {
        let horizontalPadding = viewWidth / 2
        
        ScrollView(.horizontal) {
            HStack(spacing:config.spacing) {
                let totalSteps = config.steps * config.count
                ForEach(0...totalSteps, id: \.self) { index in
                    let remainder = index % config.steps
                    Divider()
                        .background( remainder == 0 ? Color.primary : Color.gray)
                        .frame(width: 0, height: remainder == 0 ? 20 : 10)
                        .frame(maxHeight: 20, alignment: .bottom)
                        // the text should align to the top of the divider, so that
                        // .offset(y:20) will put the text directly under the divider
                        .overlay(alignment: .top) {
                            if remainder == 0 {
                                Text("\(index / config.steps)")
                                    .font(.caption)
                                    .fontWeight(.semibold)
                                    .textScale(.secondary)
                                    .fixedSize()
                                    .modifier(MaxHeightPreferenceModifier())
                                    .offset(y:20)
                            }
                        }
                }
            }
            .frame(height: maxTextHeight + 20, alignment: .top)
        }
        .scrollIndicators(.hidden)
        .safeAreaPadding(.horizontal, horizontalPadding)
        .onGeometryChange(for: CGFloat.self, of: \.size.width) { newValue in
            viewWidth = newValue
        }
        .onPreferenceChange(MaxHeightPreference.self) { newValue in
            maxTextHeight = newValue
        }
        // this border is to show the bounds of the ScrollView.
        // you can see that it does not take up all the available height,
        // only as much height as needed by the dividers + texts
        .border(.red)
    }
}