Add Scalebar preview

[dfeinzimer]

Add a Scalebar preview to quickly validate changes

When we bump up to iOS 17 minimum this'll be easier to implement with View.onChange(of:initial:_:)

[dfeinzimer]

Here's one possible starter implementation:

Expand

@available(iOS 17.0, *)
#Preview {
    /// Allows for communication between the `Scalebar` and `MapView`.
    @Previewable @State var spatialReference: SpatialReference?
    
    /// Allows for communication between the `Scalebar` and `MapView`.
    @Previewable @State var unitsPerPoint: Double?
    
    /// Allows for communication between the `Scalebar` and `MapView`.
    @Previewable @State var viewpoint: Viewpoint?
    
    @Previewable @State var style = ScalebarStyle.alternatingBar
    
    VStack {
        Form {
            Scalebar(
                maxWidth: 175,
                spatialReference: spatialReference,
                style: style,
                unitsPerPoint: unitsPerPoint,
                viewpoint: viewpoint
            )
            .onAppear {
                unitsPerPoint = 99689
                viewpoint = .init(center: .init(x: 0, y: 0, spatialReference: .webMercator), scale: 376777662)
                spatialReference = .webMercator
            }
            
            Picker("Style", selection: $style) {
                Text("\(ScalebarStyle.alternatingBar)")
                    .tag(ScalebarStyle.alternatingBar)
                Text("\(ScalebarStyle.bar)")
                    .tag(ScalebarStyle.bar)
                Text("\(ScalebarStyle.dualUnitLine)")
                    .tag(ScalebarStyle.dualUnitLine)
                Text("\(ScalebarStyle.graduatedLine)")
                    .tag(ScalebarStyle.graduatedLine)
                Text("\(ScalebarStyle.line)")
                    .tag(ScalebarStyle.line)
            }
        }
    }
}