feat: add mapType

Author: pinpong

android/src/main/java/com/rngooglemapsplus/GoogleMapsViewImpl.kt

@@ -14,6 +14,7 @@ import com.google.android.gms.maps.OnMapReadyCallback
 import com.google.android.gms.maps.model.CameraPosition
 import com.google.android.gms.maps.model.LatLng
 import com.google.android.gms.maps.model.LatLngBounds
+import com.google.android.gms.maps.model.MapColorScheme
 import com.google.android.gms.maps.model.MapStyleOptions
 import com.google.android.gms.maps.model.Marker
 import com.google.android.gms.maps.model.MarkerOptions
@@ -45,6 +46,7 @@ class GoogleMapsViewImpl(
   private var pendingMinZoomLevel: Double? = null
   private var pendingMaxZoomLevel: Double? = null
   private var pendingMapPadding: RNMapPadding? = null
+  private var pendingMapType: Int? = null
   private val pendingPolygons = mutableListOf<Pair<String, PolygonOptions>>()
   private val pendingPolylines = mutableListOf<Pair<String, PolylineOptions>>()
   private val pendingMarkers = mutableListOf<Pair<String, MarkerOptions>>()
@@ -245,6 +247,9 @@ class GoogleMapsViewImpl(
         googleMap?.isTrafficEnabled = it
       }
       googleMap?.setMapStyle(pendingCustomMapStyle)
+      pendingMapType?.let {
+        googleMap?.mapType = it
+      }
       pendingUserInterfaceStyle?.let {
         googleMap?.mapColorScheme = it
       }
@@ -282,20 +287,25 @@ class GoogleMapsViewImpl(
     get() = googleMap?.isBuildingsEnabled ?: pendingBuildingEnabled
     set(value) {
       pendingBuildingEnabled = value
-      value?.let {
-        onUi {
+      onUi {
+        value?.let {
           googleMap?.isBuildingsEnabled = it
         }
+          ?: run {
+            googleMap?.isBuildingsEnabled = false
+          }
       }
     }
 
   var trafficEnabled: Boolean?
     get() = googleMap?.isTrafficEnabled ?: pendingTrafficEnabled
     set(value) {
       pendingTrafficEnabled = value
-      value?.let {
-        onUi {
+      onUi {
+        value?.let {
           googleMap?.isTrafficEnabled = it
+        } ?: run {
+          googleMap?.isTrafficEnabled = false
         }
       }
     }
@@ -319,10 +329,11 @@ class GoogleMapsViewImpl(
     get() = pendingUserInterfaceStyle
     set(value) {
       pendingUserInterfaceStyle = value
-
-      value?.let {
-        onUi {
+      onUi {
+        value?.let {
           googleMap?.mapColorScheme = it
+        } ?: run {
+          googleMap?.mapColorScheme = MapColorScheme.FOLLOW_SYSTEM
         }
       }
     }
@@ -331,9 +342,11 @@ class GoogleMapsViewImpl(
     get() = pendingMinZoomLevel
     set(value) {
       pendingMinZoomLevel = value
-      value?.let {
-        onUi {
+      onUi {
+        value?.let {
           googleMap?.setMinZoomPreference(it.toFloat())
+        } ?: run {
+          googleMap?.setMinZoomPreference(2.0f)
         }
       }
     }
@@ -342,9 +355,11 @@ class GoogleMapsViewImpl(
     get() = pendingMaxZoomLevel
     set(value) {
       pendingMaxZoomLevel = value
-      value?.let {
-        onUi {
+      onUi {
+        value?.let {
           googleMap?.setMaxZoomPreference(it.toFloat())
+        } ?: run {
+          googleMap?.setMaxZoomPreference(21.0f)
         }
       }
     }
@@ -362,6 +377,21 @@ class GoogleMapsViewImpl(
             it.bottom.dpToPx().toInt(),
           )
         }
+      } ?: run {
+        googleMap?.setPadding(0, 0, 0, 0)
+      }
+    }
+
+  var mapType: Int?
+    get() = pendingMapType
+    set(value) {
+      pendingMapType = value
+      onUi {
+        value?.let {
+          googleMap?.mapType = it
+        } ?: run {
+          googleMap?.mapType = 1
+        }
       }
     }
 

android/src/main/java/com/rngooglemapsplus/RNGoogleMapsPlusView.kt

@@ -76,6 +76,14 @@ class RNGoogleMapsPlusView(
       view.mapPadding = value
     }
 
+  override var mapType: RNMapType?
+    get() = RNMapType.entries.firstOrNull { it.value == view.mapType }
+    set(value) {
+      value?.let {
+        view.mapType = it.value
+      }
+    }
+
   override var markers: Array<RNMarker>? = emptyArray()
     set(value) {
       val prevById = field?.associateBy { it.id } ?: emptyMap()

example/src/App.tsx

@@ -368,6 +368,7 @@ export default function App() {
           zoom: 15,
         }}
         userInterfaceStyle={'light'}
+        mapType={'normal'}
         maxZoomLevel={20}
         minZoomLevel={0}
         mapPadding={{

ios/GoogleMapViewImpl.swift

@@ -173,97 +173,97 @@ final class GoogleMapsViewImpl: UIView, GMSMapViewDelegate {
 
   @MainActor
   var buildingEnabled: Bool? {
-      get { mapView.isBuildingsEnabled }
-      set {
-          pendingBuildingEnabled = newValue
-          if let value = newValue {
-              mapView.isBuildingsEnabled = value
-          }
+    get { mapView.isBuildingsEnabled }
+    set {
+      pendingBuildingEnabled = newValue
+      if let value = newValue {
+        mapView.isBuildingsEnabled = value
       }
+    }
   }
 
   @MainActor
   var trafficEnabled: Bool? {
-      get { mapView.isTrafficEnabled }
-      set {
-          pendingTrafficEnabled = newValue
-          if let value = newValue {
-              mapView.isTrafficEnabled = value
-          }
+    get { mapView.isTrafficEnabled }
+    set {
+      pendingTrafficEnabled = newValue
+      if let value = newValue {
+        mapView.isTrafficEnabled = value
       }
+    }
   }
 
   @MainActor
   var customMapStyle: GMSMapStyle? {
-      get { pendingCustomMapStyle }
-      set {
-          pendingCustomMapStyle = newValue
-          if let style = newValue {
-              mapView.mapStyle = style
-          }
+    get { pendingCustomMapStyle }
+    set {
+      pendingCustomMapStyle = newValue
+      if let style = newValue {
+        mapView.mapStyle = style
       }
+    }
   }
 
   @MainActor
   var initialCamera: GMSCameraPosition? {
-      get { pendingInitialCamera }
-      set {
-          pendingInitialCamera = newValue
-          if let camera = newValue, !mapReady {
-              mapView.camera = camera
-          }
+    get { pendingInitialCamera }
+    set {
+      pendingInitialCamera = newValue
+      if let camera = newValue, !mapReady {
+        mapView.camera = camera
       }
+    }
   }
 
   @MainActor
   var userInterfaceStyle: UIUserInterfaceStyle? {
-      get { pendingUserInterfaceStyle }
-      set {
-          pendingUserInterfaceStyle = newValue
-          if let style = newValue {
-              mapView.overrideUserInterfaceStyle = style
-          }
+    get { pendingUserInterfaceStyle }
+    set {
+      pendingUserInterfaceStyle = newValue
+      if let style = newValue {
+        mapView.overrideUserInterfaceStyle = style
       }
+    }
   }
 
   @MainActor
   var minZoomLevel: Double? {
-      get { pendingMinZoomLevel }
-      set {
-          pendingMinZoomLevel = newValue
-          if let min = newValue, let max = pendingMaxZoomLevel {
-              mapView.setMinZoom(Float(min), maxZoom: Float(max))
-          }
+    get { pendingMinZoomLevel }
+    set {
+      pendingMinZoomLevel = newValue
+      if let min = newValue, let max = pendingMaxZoomLevel {
+        mapView.setMinZoom(Float(min), maxZoom: Float(max))
       }
+    }
   }
 
   @MainActor
   var maxZoomLevel: Double? {
-      get { pendingMaxZoomLevel }
-      set {
-          pendingMaxZoomLevel = newValue
-          if let max = newValue, let min = pendingMinZoomLevel {
-              mapView.setMinZoom(Float(min), maxZoom: Float(max))
-          }
+    get { pendingMaxZoomLevel }
+    set {
+      pendingMaxZoomLevel = newValue
+      if let max = newValue, let min = pendingMinZoomLevel {
+        mapView.setMinZoom(Float(min), maxZoom: Float(max))
       }
+    }
   }
 
   @MainActor
   var mapPadding: RNMapPadding? {
-      get { pendingMapPadding }
-      set {
-          pendingMapPadding = newValue
-          if let padding = newValue {
-              mapView.padding = UIEdgeInsets(
-                  top: padding.top,
-                  left: padding.left,
-                  bottom: padding.bottom,
-                  right: padding.right
-              )
-          } else {
-              mapView.padding = .zero
-          }
+    get { pendingMapPadding }
+    set {
+      pendingMapPadding = newValue
+      if let padding = newValue {
+        mapView.padding = UIEdgeInsets(
+        top: padding.top,
+        left: padding.left,
+        bottom: padding.bottom,
+        right: padding.right
+        )
+      } else {
+        mapView.padding = .zero
       }
+    }
   }
 
   func setCamera(camera: RNCamera, animated: Bool, durationMS: Double) {

ios/RNGoogleMapsPlusView.swift

@@ -85,6 +85,17 @@ final class RNGoogleMapsPlusView: HybridRNGoogleMapsPlusViewSpec {
     set { impl.mapPadding = newValue }
   }
 
+  @MainActor
+  var mapType: RNMapType? {
+    get {
+      guard let value = impl.mapType else { return nil }
+      return RNMapType(rawValue: value)
+    }
+    set {
+      impl.mapType = newValue.map { Int32($0.rawValue) }
+    }
+  }
+
   @MainActor
   var markers: [RNMarker]? {
     didSet {

src/RNGoogleMapsPlusView.nitro.ts

@@ -16,6 +16,7 @@ import type {
   RNRegion,
   RNLocation,
   RNMapErrorCode,
+  RNMapType,
 } from './types';
 
 export interface RNGoogleMapsPlusViewProps extends HybridViewProps {
@@ -27,6 +28,7 @@ export interface RNGoogleMapsPlusViewProps extends HybridViewProps {
   minZoomLevel?: number;
   maxZoomLevel?: number;
   mapPadding?: RNMapPadding;
+  mapType?: RNMapType;
   markers?: RNMarker[];
   polygons?: RNPolygon[];
   polylines?: RNPolyline[];

src/types.ts

@@ -14,6 +14,8 @@ export type RNMapPadding = {
   right: number;
 };
 
+export type RNMapType = 'none' | 'normal' | 'hybrid' | 'satellite' | 'terrain';
+
 export type RNUserInterfaceStyle = 'light' | 'dark' | 'default';
 
 export type RNFeatureType = string;