es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Google Maps iOS SDK animar el relleno del mapa SwiftUI.

Estoy buscando animar el relleno de mi Google Map, ya que cuando aparece una hoja inferior, el relleno del mapa cambia de tamaño dinámicamente.

La documentación de GMSMapView.padding dice que se puede lograr con una animación basada en bloques UIView, pero no estoy seguro de cómo se integraría eso en una aplicación SwiftUI.

La hoja inferior funciona bien, se muestra cuando se espera y pasa el valor de relleno correcto al MapView. Solo la animación es lo que no puedo entender. (Esta es la biblioteca que se usa para la hoja inferior si tienes curiosidad: https://github.com/LucasMucGH/BottomSheet)

Cualquier ayuda sería muy apreciada, gracias.

Código relevante actual:

struct MapView: UIViewRepresentable {

var bottomPadding: CGFloat
  private let mapView = GMSMapView(frame: .zero)

func makeUIView(context: Context) -> GMSMapView {
    return mapView
  }

func updateUIView(_ mapView: GMSMapView, context: Context) {
    mapView.padding = UIEdgeInsets(top: 0, left: 0, bottom: bottomPadding, right: 0)
  }
}

struct ContentView: View {

@State var showBottomSheet: ShowBottomSheet = .hidden

var bottomSheetHeight: CGFloat {
    if showBottomSheet == .visible {
      return showBottomSheet.rawValue
    } else {
      return 0
    }
  }

var body: some View {

GeometryReader { geometry in
  ZStack {

    // Mapa
    MapView(bottomPadding: geometry.size.height * bottomSheetHeight)
    .edgesIgnoringSafeArea(.all)
    .bottomSheet(
      bottomSheetPosition: $showBottomSheet,
      options: [
        .allowContentDrag,
        .swipeToDismiss,
        .noBottomPosition,
        .shadow()
      ],
      content: {}
    )
  }
}
}
}

enum ShowBottomSheet: CGFloat, CaseIterable {
    case hidden = 0, visible = 0.5
  }
Tags:  , , ,

Answer

  1. Avatar for davy.ai

    Para animar el espaciado del mapa de Google en una aplicación SwiftUI, puedes utilizar un bloque withAnimation para envolver el código que actualiza el espaciado. Esto permitirá que los cambios se animen.

    Aquí tienes una versión actualizada de la función updateUIView en la estructura MapView:

    func updateUIView(_ mapView: GMSMapView, context: Context) {
        withAnimation {
            mapView.padding = UIEdgeInsets(top: 0, left: 0, bottom: bottomPadding, right: 0)
        }
    }
    

    Al envolver la asignación mapView.padding en un bloque withAnimation, cualquier cambio en la propiedad de espaciado se animará.

    También puedes ajustar la configuración de la animación especificando la duración y la curva. Por ejemplo:

    withAnimation(.easeInOut(duration: 0.3)) {
        mapView.padding = ...
    }
    

    Esto aplicará una animación de entrada y salida con una duración de 0.3 segundos.

    Ten en cuenta que el bloque withAnimation solo se puede utilizar para animar propiedades que estén declaradas como animables en SwiftUI. Afortunadamente, la propiedad de espaciado de GMSMapView está declarada como animable, por lo que debería funcionar sin problemas.

Comments are closed.