diff --git a/README.md b/README.md index d9444dad..ed94682e 100644 --- a/README.md +++ b/README.md @@ -504,7 +504,7 @@ Both `NavigationView` and `MapView` support the following props. Props marked wi | `mapId` | `string` | - | | Cloud-based map styling ID from Google Cloud Console | | `mapColorScheme` | `MapColorScheme` | `FOLLOW_SYSTEM` | | Color scheme for map tiles (FOLLOW_SYSTEM, LIGHT, DARK) | | `mapStyle` | `string` | - | | Custom map styling via JSON | -| `mapPadding` | `Padding` | - | | Padding applied to the map in pixels | +| `mapPadding` | `Padding` | - | | Padding applied to the map in density-independent pixels | | `initialCameraPosition` | `CameraPosition` | - | | Initial camera position when map loads | | `minZoomLevel` | `number` | - | | Minimum allowed zoom level | | `maxZoomLevel` | `number` | - | | Maximum allowed zoom level | diff --git a/android/src/main/java/com/google/android/react/navsdk/NavAutoModule.java b/android/src/main/java/com/google/android/react/navsdk/NavAutoModule.java index d9247aee..1c11f7b7 100644 --- a/android/src/main/java/com/google/android/react/navsdk/NavAutoModule.java +++ b/android/src/main/java/com/google/android/react/navsdk/NavAutoModule.java @@ -25,6 +25,7 @@ import com.facebook.react.bridge.UiThreadUtil; import com.facebook.react.bridge.WritableArray; import com.facebook.react.bridge.WritableMap; +import com.facebook.react.uimanager.PixelUtil; import com.google.android.gms.maps.UiSettings; import com.google.android.gms.maps.model.CameraPosition; import com.google.android.gms.maps.model.Circle; @@ -619,10 +620,10 @@ public void isAutoScreenAvailable(final Promise promise) { @Override public void setMapPadding(double top, double left, double bottom, double right) { - int topInt = (int) top; - int leftInt = (int) left; - int bottomInt = (int) bottom; - int rightInt = (int) right; + int topInt = Math.round(PixelUtil.toPixelFromDIP(top)); + int leftInt = Math.round(PixelUtil.toPixelFromDIP(left)); + int bottomInt = Math.round(PixelUtil.toPixelFromDIP(bottom)); + int rightInt = Math.round(PixelUtil.toPixelFromDIP(right)); UiThreadUtil.runOnUiThread( () -> { if (mMapViewController == null) { diff --git a/android/src/main/java/com/google/android/react/navsdk/NavViewManager.java b/android/src/main/java/com/google/android/react/navsdk/NavViewManager.java index d2bc7004..3680a4a0 100644 --- a/android/src/main/java/com/google/android/react/navsdk/NavViewManager.java +++ b/android/src/main/java/com/google/android/react/navsdk/NavViewManager.java @@ -25,6 +25,7 @@ import com.facebook.react.bridge.ReadableMap; import com.facebook.react.common.MapBuilder; import com.facebook.react.module.annotations.ReactModule; +import com.facebook.react.uimanager.PixelUtil; import com.facebook.react.uimanager.SimpleViewManager; import com.facebook.react.uimanager.ThemedReactContext; import com.facebook.react.uimanager.ViewManagerDelegate; @@ -462,14 +463,19 @@ public void setNavigationNightMode(FrameLayout view, int nightMode) { @ReactProp(name = "mapPadding") public void setMapPadding(FrameLayout view, @Nullable ReadableMap padding) { if (padding != null) { - int top = padding.hasKey("top") ? padding.getInt("top") : 0; - int left = padding.hasKey("left") ? padding.getInt("left") : 0; - int bottom = padding.hasKey("bottom") ? padding.getInt("bottom") : 0; - int right = padding.hasKey("right") ? padding.getInt("right") : 0; - getMapControllerProperties(view.getId()).setPadding(top, left, bottom, right); + getMapControllerProperties(view.getId()) + .setPadding( + getPaddingInPixels(padding, "top"), + getPaddingInPixels(padding, "left"), + getPaddingInPixels(padding, "bottom"), + getPaddingInPixels(padding, "right")); } } + private int getPaddingInPixels(ReadableMap padding, String edge) { + return padding.hasKey(edge) ? Math.round(PixelUtil.toPixelFromDIP(padding.getDouble(edge))) : 0; + } + @ReactProp(name = "mapStyle") public void setMapStyle(FrameLayout view, @Nullable String mapStyle) { if (mapStyle != null) { diff --git a/src/maps/mapView/types.ts b/src/maps/mapView/types.ts index 56d849f7..78c8590e 100644 --- a/src/maps/mapView/types.ts +++ b/src/maps/mapView/types.ts @@ -213,13 +213,13 @@ export enum MapType { * Defines the padding options for a map. */ export interface Padding { - /** Top padding in pixels. */ + /** Top padding in density-independent pixels. */ top?: number; - /** Left padding in pixels. */ + /** Left padding in density-independent pixels. */ left?: number; - /** Bottom padding in pixels. */ + /** Bottom padding in density-independent pixels. */ bottom?: number; - /** Right padding in pixels. */ + /** Right padding in density-independent pixels. */ right?: number; } @@ -381,7 +381,7 @@ export interface MapViewController { moveCamera(cameraPosition: CameraPosition): void; /** - * Sets padding to the map. + * Sets padding on the map in density-independent pixels. * * @param padding - An object defining padding for each side. * Example: { top: 10, left: 5, bottom: 15, right: 10 } diff --git a/src/maps/types.ts b/src/maps/types.ts index 4f9df8dd..ec2545b5 100644 --- a/src/maps/types.ts +++ b/src/maps/types.ts @@ -263,7 +263,7 @@ export interface MapViewProps { readonly mapType?: MapViewType; /** - * Sets padding on the map in pixels. + * Sets padding on the map in density-independent pixels. */ readonly mapPadding?: Padding;