@maplibre/maplibre-react-native 11.0.0-alpha.2 → 11.0.0-alpha.20

package/android/src/main/java/org/maplibre/reactnative/components/layers/style/MLRNStyleFunctionParser.java

@@ -0,0 +1,94 @@
+package org.maplibre.reactnative.components.layers.style;
+
+import com.facebook.react.bridge.Dynamic;
+import com.facebook.react.bridge.NoSuchKeyException;
+import com.facebook.react.bridge.ReadableArray;
+import com.facebook.react.bridge.ReadableMap;
+import com.facebook.react.bridge.ReadableType;
+
+import org.maplibre.android.style.layers.PropertyValue;
+
+import java.util.ArrayList;
+import java.util.List;
+
+public abstract class MLRNStyleFunctionParser<T, V> {
+    private MLRNStyleValue mStyleValue;
+
+    public MLRNStyleFunctionParser(MLRNStyleValue styleValue) {
+        mStyleValue = styleValue;
+    }
+
+    public List<StopConfig> getRawStops() {
+        ReadableArray readableArrayRawStops = mStyleValue.getArray("stops");
+
+        List<StopConfig> rawStops = new ArrayList<>();
+
+        for (int i = 0; i < readableArrayRawStops.size(); i++) {
+            ReadableArray rawStop = readableArrayRawStops.getArray(i);
+
+            ReadableMap jsStopKey = rawStop.getMap(0);
+            ReadableMap jsStopValue = rawStop.getMap(1);
+            MLRNStyleValue innerStyleValue = new MLRNStyleValue(jsStopValue);
+
+            Object propertyValue = null;
+            try {
+                Dynamic dynamicPropertyValue = innerStyleValue.getDynamic("propertyValue");
+                ReadableType type = dynamicPropertyValue.getType();
+
+                if (type.equals(ReadableType.Number)) {
+                    propertyValue = dynamicPropertyValue.asDouble();
+                } else if (type.equals(ReadableType.Boolean)){
+                    propertyValue = dynamicPropertyValue.asBoolean();
+                } else {
+                    propertyValue = dynamicPropertyValue.asString();
+                }
+            } catch (NoSuchKeyException e) {
+                // not a zoom-property value
+            }
+
+            StopConfig config;
+            if (propertyValue != null) {
+                config = new StopConfig(getStopKey(jsStopKey), getRawStopValue(innerStyleValue), propertyValue);
+            } else {
+                config = new StopConfig(getStopKey(jsStopKey), getRawStopValue(innerStyleValue));
+            }
+
+            rawStops.add(config);
+        }
+
+        return rawStops;
+    }
+
+    protected abstract T getRawStopValue (MLRNStyleValue styleValue);
+    protected abstract PropertyValue<V> getStopValue(T value);
+
+    private Object getStopKey(ReadableMap jsStopKey) {
+        String payloadKey = "value";
+        String type = jsStopKey.getString("type");
+
+        switch (type) {
+            case "number":
+                return jsStopKey.getDouble(payloadKey);
+            case "boolean":
+                return jsStopKey.getBoolean(payloadKey);
+            default:
+                return jsStopKey.getString(payloadKey);
+        }
+    }
+
+    private class StopConfig {
+        Object propertyValue;
+        T value;
+        Object key;
+
+        StopConfig(Object key, T value) {
+            this(key, value, null);
+        }
+
+        StopConfig(Object key, T value, Object propertyValue) {
+            this.key = key;
+            this.value = value;
+            this.propertyValue = propertyValue;
+        }
+    }
+}

package/android/src/main/java/org/maplibre/reactnative/components/layers/style/MLRNStyleValue.java

@@ -0,0 +1,207 @@
+package org.maplibre.reactnative.components.layers.style;
+
+import androidx.annotation.NonNull;
+
+import com.facebook.react.bridge.Dynamic;
+import com.facebook.react.bridge.ReadableArray;
+import com.facebook.react.bridge.ReadableMap;
+import com.facebook.react.bridge.ReadableType;
+import com.facebook.react.bridge.WritableNativeMap;
+
+import org.maplibre.android.style.expressions.Expression;
+import org.maplibre.android.style.layers.TransitionOptions;
+import org.maplibre.reactnative.utils.ExpressionParser;
+import org.maplibre.reactnative.utils.ImageEntry;
+
+public class MLRNStyleValue {
+
+    private String mType;
+    private boolean isExpression;
+    private Expression mExpression;
+    private ReadableMap mPayload;
+
+    private String imageURI = "";
+    private boolean isAddImage;
+    private Double imageScale = ImageEntry.defaultScale;
+
+    public static final int InterpolationModeExponential = 100;
+    public static final int InterpolationModeInterval = 101;
+    public static final int InterpolationModeCategorical = 102;
+    public static final int InterpolationModeIdentity = 103;
+
+    public MLRNStyleValue(@NonNull ReadableMap config) {
+        mType = config.getString("styletype");
+        mPayload = config.getMap("stylevalue");
+
+        if ("image".equals(mType)) {
+            imageScale = ImageEntry.defaultScale;
+            if ("hashmap".equals(mPayload.getString("type"))) {
+                ReadableMap map = getMap();
+                imageURI = map.getMap("uri").getString("value");
+                if (map.getMap("scale") != null) {
+                    imageScale = map.getMap("scale").getDouble("value");
+                }
+            } else if ("string".equals(mPayload.getString("type"))) {
+                String value = mPayload.getString("value");
+                if (value.contains("://")) {
+                    imageURI = value;
+                } else {
+                    imageURI = null;
+                    isExpression = true;
+                    mExpression = Expression.literal(value);
+                }
+            } else {
+                imageURI = null;
+            }
+            isAddImage = imageURI != null;
+            if (isAddImage) { return; }
+        }
+
+        Dynamic dynamic = mPayload.getDynamic("value");
+        if (dynamic.getType().equals(ReadableType.Array)) {
+            ReadableArray array = dynamic.asArray();
+            if (array.size() > 0 && mPayload.getString("type").equals("array")) {
+                ReadableMap map = array.getMap(0);
+                if (map != null && map.getString("type").equals("string")) {
+                    isExpression = true;
+                    mExpression = ExpressionParser.fromTyped(mPayload);
+                }
+            }
+        }
+    }
+
+    private boolean isTokenizedValue(String value) {
+        return (value.startsWith("{") && value.endsWith("}"));
+    }
+
+    public String getType() {
+        return mType;
+    }
+
+    public boolean isFunction() {
+        return mType.equals("function");
+    }
+
+    public int getInt(String key) {
+        return mPayload.getInt(key);
+    }
+
+    public String getString(String key) {
+        return mPayload.getString(key);
+    }
+
+    public Double getDouble(String key) {
+        return mPayload.getDouble(key);
+    }
+
+    public Float getFloat(String key) {
+        return getDouble(key).floatValue();
+    }
+
+    public Dynamic getDynamic(String key) {
+        return mPayload.getDynamic(key);
+    }
+
+    public ReadableArray getArray(String key) {
+        return mPayload.getArray(key);
+    }
+
+    public Boolean getBoolean(String key) {
+        return mPayload.getBoolean(key);
+    }
+
+    public Float[] getFloatArray(String key) {
+        ReadableArray arr = getArray(key);
+
+        Float[] floatArr = new Float[arr.size()];
+        for (int i = 0; i < arr.size(); i++) {
+            ReadableMap item = arr.getMap(i);
+            floatArr[i] = (float) item.getDouble("value");
+        }
+
+        return floatArr;
+    }
+
+    public String[] getStringArray(String key) {
+        ReadableArray arr = getArray(key);
+
+        String[] stringArr = new String[arr.size()];
+        for (int i = 0; i < arr.size(); i++) {
+            ReadableMap item = arr.getMap(i);
+            stringArr[i] = item.getString("value");
+        }
+
+        return stringArr;
+    }
+
+    public ReadableMap getMap() {
+        if ("hashmap".equals(mPayload.getString("type"))) {
+            ReadableArray keyValues = mPayload.getArray("value");
+            WritableNativeMap result = new WritableNativeMap();
+            for (int i = 0; i < keyValues.size(); i++) {
+                ReadableArray keyValue = keyValues.getArray(i);
+                String stringKey = keyValue.getMap(0).getString("value");
+                WritableNativeMap value = new WritableNativeMap();
+                value.merge(keyValue.getMap(1));
+                result.putMap(stringKey, value);
+            }
+            return result;
+        }
+
+        return null;
+    }
+
+    public ReadableMap getMap(String _key) {
+        return getMap();
+    }
+
+    public Expression getExpression() {
+        return mExpression;
+    }
+
+    public boolean isExpression() {
+        return isExpression;
+    }
+
+    public boolean shouldAddImage() {
+        return isAddImage;
+    }
+
+    public Boolean isImageStringValue() {
+        return "string".equals(mPayload.getString("type"));
+    }
+
+    public String getImageStringValue() {
+        return mPayload.getString("value");
+    }
+
+    public String getImageURI() {
+        return imageURI;
+    }
+
+    public double getImageScale() {
+        return imageScale;
+    }
+
+    public TransitionOptions getTransition() {
+        if (!mType.equals("transition")) {
+            return null;
+        }
+        ReadableMap config = getMap(MLRNStyleFactory.VALUE_KEY);
+
+        boolean enablePlacementTransitions = true;
+        if (config.hasKey("enablePlacementTransitions")) {
+            enablePlacementTransitions = config.getMap("enablePlacementTransitions").getBoolean("value");
+        }
+        int duration = 300;
+        int delay = 0;
+        if (config.hasKey("duration") && ReadableType.Map.equals(config.getType("duration"))) {
+            duration = config.getMap("duration").getInt("value");
+        }
+        if (config.hasKey("delay") && ReadableType.Map.equals(config.getType("delay"))) {
+            delay = config.getMap("delay").getInt("value");
+        }
+
+        return new TransitionOptions(duration, delay, enablePlacementTransitions);
+    }
+}

package/android/src/main/java/org/maplibre/reactnative/components/location/LocationComponentManager.kt

@@ -0,0 +1,154 @@
+package org.maplibre.reactnative.components.location
+
+import android.annotation.SuppressLint
+import android.content.Context
+import org.maplibre.android.location.LocationComponent
+import org.maplibre.android.location.LocationComponentActivationOptions
+import org.maplibre.android.location.LocationComponentOptions
+import org.maplibre.android.location.OnCameraTrackingChangedListener
+import org.maplibre.android.location.modes.CameraMode
+import org.maplibre.android.location.modes.RenderMode
+import org.maplibre.android.maps.MapLibreMap
+import org.maplibre.android.maps.Style
+import org.maplibre.reactnative.R
+import org.maplibre.reactnative.components.mapview.MLRNMapView
+import org.maplibre.reactnative.location.LocationManager
+
+/**
+ * The LocationComponent on android implements both location tracking and display of user's current location.
+ * LocationComponentManager attempts to separate that, so that Camera can ask for location tracking independent of display of user current location.
+ * And NativeUserLocation can ask for display of user's current location - independent of Camera's user tracking.
+ */
+class LocationComponentManager(mapView: MLRNMapView?, private val context: Context) {
+    private var mMapView: MLRNMapView? = null
+    private var mMap: MapLibreMap? = null
+
+    private var mLocationManager: LocationManager? = null
+    private var mLocationComponent: LocationComponent? = null
+
+    @RenderMode.Mode
+    private var mRenderMode: Int = RenderMode.COMPASS
+
+    private var mShowUserLocation = false
+
+    private var mFollowUserLocation = false
+
+    private var mShowingUserLocation = false
+
+    private var mOnCameraTrackingChangedListener: OnCameraTrackingChangedListener? = null
+
+    init {
+        mMapView = mapView
+        mMap = mMapView?.mapLibreMap
+
+        mLocationManager = LocationManager.getInstance(context)
+    }
+
+    fun showUserLocation(showUserLocation: Boolean) {
+        mShowUserLocation = showUserLocation
+        stateChanged()
+    }
+
+    fun setFollowUserLocation(followUserLocation: Boolean) {
+        mFollowUserLocation = followUserLocation
+        stateChanged()
+    }
+
+    fun setCameraMode(@CameraMode.Mode cameraMode: Int) {
+        mLocationComponent?.cameraMode = cameraMode
+    }
+
+    fun setRenderMode(@RenderMode.Mode renderMode: Int) {
+        mRenderMode = renderMode
+        if (mShowingUserLocation) {
+            mLocationComponent?.renderMode = renderMode
+        }
+    }
+
+    fun setPreferredFramesPerSecond(preferredFramesPerSecond: Int) {
+        if (preferredFramesPerSecond <= 0) {
+            return
+        }
+
+        mLocationComponent?.setMaxAnimationFps(preferredFramesPerSecond)
+    }
+
+    fun addOnCameraTrackingChangedListener(onCameraTrackingChangedListener: OnCameraTrackingChangedListener?) {
+        mOnCameraTrackingChangedListener?.let {
+            mLocationComponent?.removeOnCameraTrackingChangedListener(
+                it
+            )
+        }
+
+        mOnCameraTrackingChangedListener = onCameraTrackingChangedListener
+
+        mOnCameraTrackingChangedListener?.let { mLocationComponent?.addOnCameraTrackingChangedListener(it) }
+    }
+
+    @SuppressLint("MissingPermission")
+    private fun stateChanged() {
+        mLocationComponent?.setLocationComponentEnabled((mFollowUserLocation || mShowUserLocation))
+
+        if (mShowingUserLocation != mShowUserLocation) {
+            updateShowUserLocation(mShowUserLocation)
+        }
+
+        if (mFollowUserLocation) {
+            if (!mShowUserLocation) {
+                mLocationComponent?.renderMode = RenderMode.GPS
+            } else {
+                mLocationComponent?.renderMode = mRenderMode
+            }
+            mLocationComponent?.onStart()
+        } else {
+            mLocationComponent?.cameraMode = CameraMode.NONE
+        }
+    }
+
+    fun hasLocationComponent(): Boolean {
+        return (mLocationComponent != null)
+    }
+
+    fun update(style: Style) {
+        update(mShowUserLocation, style)
+    }
+
+    fun update(displayUserLocation: Boolean, style: Style) {
+        val tintColor = mMapView?.tintColor
+
+        if (mLocationComponent == null || tintColor != null) {
+            mLocationComponent = mMap?.locationComponent
+
+            val locationComponentActivationOptions: LocationComponentActivationOptions =
+                LocationComponentActivationOptions.builder(context, style)
+                    .locationComponentOptions(options(displayUserLocation)).build()
+            mLocationComponent?.activateLocationComponent(locationComponentActivationOptions)
+            mLocationComponent?.locationEngine = mLocationManager!!.engine
+            mShowingUserLocation = displayUserLocation
+        }
+
+        updateShowUserLocation(displayUserLocation)
+    }
+
+    private fun updateShowUserLocation(displayUserLocation: Boolean) {
+        if (mShowingUserLocation != displayUserLocation) {
+            mLocationComponent?.applyStyle(options(displayUserLocation))
+            mShowingUserLocation = displayUserLocation
+        }
+    }
+
+    fun options(displayUserLocation: Boolean): LocationComponentOptions {
+        var builder: LocationComponentOptions.Builder = LocationComponentOptions.builder(context)
+        val tintColor = mMapView?.tintColor
+        if (!displayUserLocation) {
+            builder = builder.padding(mMap?.getPadding()).backgroundDrawable(R.drawable.empty)
+                .backgroundDrawableStale(R.drawable.empty).bearingDrawable(R.drawable.empty)
+                .foregroundDrawable(R.drawable.empty).foregroundDrawableStale(R.drawable.empty)
+                .gpsDrawable(R.drawable.empty).accuracyAlpha(0.0f)
+        } else if (tintColor != null) {
+            builder = builder.enableStaleState(false).bearingTintColor(tintColor)
+                .foregroundTintColor(tintColor).accuracyColor(tintColor)
+        }
+        return builder.build()
+    }
+}

package/android/src/main/java/org/maplibre/reactnative/components/location/MLRNNativeUserLocation.kt

@@ -0,0 +1,70 @@
+package org.maplibre.reactnative.components.location
+
+import android.annotation.SuppressLint
+import android.content.Context
+import org.maplibre.android.location.modes.RenderMode
+import org.maplibre.android.location.permissions.PermissionsManager
+import org.maplibre.android.maps.MapLibreMap
+import org.maplibre.android.maps.OnMapReadyCallback
+import org.maplibre.android.maps.Style
+import org.maplibre.android.maps.Style.OnStyleLoaded
+import org.maplibre.reactnative.components.AbstractMapFeature
+import org.maplibre.reactnative.components.mapview.MLRNMapView
+
+class MLRNNativeUserLocation(context: Context?) : AbstractMapFeature(context), OnMapReadyCallback,
+    OnStyleLoaded {
+    private var enabled = true
+    private var map: MapLibreMap? = null
+    private var mapView: MLRNMapView? = null
+
+    @RenderMode.Mode
+    private var mRenderMode = RenderMode.COMPASS
+    private var mPreferredFramesPerSecond = 0
+
+    override fun addToMap(mapView: MLRNMapView) {
+        enabled = true
+        this.mapView = mapView
+        mapView.getMapAsync(this)
+        setRenderMode(mRenderMode)
+        setPreferredFramesPerSecond(mPreferredFramesPerSecond)
+    }
+
+    override fun removeFromMap(mapView: MLRNMapView?) {
+        enabled = false
+        if (map != null) map!!.getStyle(this)
+    }
+
+    @SuppressLint("MissingPermission")
+    override fun onMapReady(mapLibreMap: MapLibreMap) {
+        map = mapLibreMap
+        mapLibreMap.getStyle(this)
+    }
+
+    @SuppressLint("MissingPermission")
+    override fun onStyleLoaded(style: Style) {
+        val context = getContext()
+        if (!PermissionsManager.areLocationPermissionsGranted(context)) {
+            return
+        }
+
+        val locationComponent = mapView!!.locationComponentManager
+        locationComponent.update(style)
+        locationComponent.showUserLocation(enabled)
+    }
+
+    fun setRenderMode(@RenderMode.Mode renderMode: Int) {
+        mRenderMode = renderMode
+        if (mapView != null) {
+            val locationComponent = mapView!!.locationComponentManager
+            locationComponent.setRenderMode(renderMode)
+        }
+    }
+
+    fun setPreferredFramesPerSecond(framesPerSecond: Int) {
+        mPreferredFramesPerSecond = framesPerSecond
+        if (mapView != null) {
+            val locationComponent = mapView!!.locationComponentManager
+            locationComponent.setPreferredFramesPerSecond(framesPerSecond)
+        }
+    }
+}

package/android/src/main/java/org/maplibre/reactnative/components/location/MLRNNativeUserLocationManager.kt

@@ -0,0 +1,50 @@
+package org.maplibre.reactnative.components.location
+
+import com.facebook.react.module.annotations.ReactModule
+import com.facebook.react.uimanager.ThemedReactContext
+import com.facebook.react.uimanager.ViewGroupManager
+import com.facebook.react.uimanager.ViewManagerDelegate
+import com.facebook.react.uimanager.annotations.ReactProp
+import com.facebook.react.viewmanagers.MLRNNativeUserLocationManagerDelegate
+import com.facebook.react.viewmanagers.MLRNNativeUserLocationManagerInterface
+import org.maplibre.android.location.modes.RenderMode
+
+@ReactModule(name = MLRNNativeUserLocationManager.REACT_CLASS)
+class MLRNNativeUserLocationManager() :
+    ViewGroupManager<MLRNNativeUserLocation>(),
+    MLRNNativeUserLocationManagerInterface<MLRNNativeUserLocation> {
+    private val delegate: MLRNNativeUserLocationManagerDelegate<MLRNNativeUserLocation, MLRNNativeUserLocationManager> =
+        MLRNNativeUserLocationManagerDelegate(this)
+
+    override fun getDelegate(): ViewManagerDelegate<MLRNNativeUserLocation> = delegate
+
+    companion object {
+        const val REACT_CLASS: String = "MLRNNativeUserLocation"
+    }
+
+    override fun getName(): String = REACT_CLASS
+
+    override fun createViewInstance(context: ThemedReactContext): MLRNNativeUserLocation {
+        return MLRNNativeUserLocation(context)
+    }
+
+    @ReactProp(name = "mode")
+    override fun setMode(userLocation: MLRNNativeUserLocation, mode: String?) {
+        if ("heading".equals(mode, ignoreCase = true)) {
+            userLocation.setRenderMode(RenderMode.COMPASS)
+        } else if ("course".equals(mode, ignoreCase = true)) {
+            userLocation.setRenderMode(RenderMode.GPS)
+        } else {
+            userLocation.setRenderMode(RenderMode.NORMAL)
+        }
+    }
+
+    @ReactProp(name = "androidPreferredFramesPerSecond")
+    override fun setAndroidPreferredFramesPerSecond(
+        userLocation: MLRNNativeUserLocation, preferredFramesPerSecond: Int
+    ) {
+        userLocation.setPreferredFramesPerSecond(preferredFramesPerSecond)
+    }
+
+
+}

package/android/src/main/java/org/maplibre/reactnative/components/mapview/MLRNAndroidTextureMapView.kt

@@ -0,0 +1,23 @@
+package org.maplibre.reactnative.components.mapview
+
+import android.content.Context
+import android.util.AttributeSet
+import org.maplibre.android.maps.MapLibreMapOptions
+
+class MLRNAndroidTextureMapView(
+    context: Context, options: MapLibreMapOptions?
+) : MLRNMapView(context, options) {
+    constructor(context: Context) : this(context, options = null)
+
+    @Suppress("UNUSED_PARAMETER")
+    constructor(context: Context, attrs: AttributeSet?) : this(context, options = null)
+
+    @Suppress("UNUSED_PARAMETER")
+    constructor(context: Context, attrs: AttributeSet?, defStyleAttr: Int) : this(
+        context, options = null
+    )
+
+    companion object {
+        const val LOG_TAG: String = "MLRNAndroidTextureMapView"
+    }
+}

package/android/src/main/java/org/maplibre/reactnative/components/mapview/MLRNAndroidTextureMapViewManager.kt

@@ -0,0 +1,23 @@
+package org.maplibre.reactnative.components.mapview
+
+import com.facebook.react.bridge.ReactApplicationContext
+import com.facebook.react.uimanager.ThemedReactContext
+import org.maplibre.android.maps.MapLibreMapOptions
+
+class MLRNAndroidTextureMapViewManager(context: ReactApplicationContext) :
+    MLRNMapViewManager(context) {
+    override fun getName(): String = REACT_CLASS
+
+
+    override fun createViewInstance(themedReactContext: ThemedReactContext): MLRNAndroidTextureMapView {
+        val options = MapLibreMapOptions.createFromAttributes(themedReactContext)
+        options.textureMode(true)
+
+        return MLRNAndroidTextureMapView(themedReactContext, options)
+    }
+
+    companion object {
+        const val LOG_TAG: String = "MLRNAndroidTextureMapViewManager"
+        const val REACT_CLASS: String = "MLRNAndroidTextureMapView"
+    }
+}