Commit 31b0b234d7d82d4a5038319ac22c07eef21fdc02
1 parent
7a90d593
新增线段覆盖物自定义纹理
Showing
3 changed files
with
68 additions
and
45 deletions
lib/android/src/main/java/cn/feewee/amap3d/map_view/Polyline.kt
@@ -2,10 +2,15 @@ package cn.feewee.amap3d.map_view | @@ -2,10 +2,15 @@ package cn.feewee.amap3d.map_view | ||
2 | 2 | ||
3 | import android.content.Context | 3 | import android.content.Context |
4 | import android.graphics.Color | 4 | import android.graphics.Color |
5 | +import android.os.Handler | ||
6 | +import android.os.Looper | ||
7 | +import cn.feewee.amap3d.fetchImage | ||
5 | import com.amap.api.maps.AMap | 8 | import com.amap.api.maps.AMap |
9 | +import com.amap.api.maps.model.BitmapDescriptor | ||
6 | import com.amap.api.maps.model.LatLng | 10 | import com.amap.api.maps.model.LatLng |
7 | import com.amap.api.maps.model.Polyline | 11 | import com.amap.api.maps.model.Polyline |
8 | import com.amap.api.maps.model.PolylineOptions | 12 | import com.amap.api.maps.model.PolylineOptions |
13 | +import com.facebook.react.bridge.ReadableMap | ||
9 | import com.facebook.react.views.view.ReactViewGroup | 14 | import com.facebook.react.views.view.ReactViewGroup |
10 | 15 | ||
11 | class Polyline(context: Context) : ReactViewGroup(context), Overlay { | 16 | class Polyline(context: Context) : ReactViewGroup(context), Overlay { |
@@ -49,10 +54,18 @@ class Polyline(context: Context) : ReactViewGroup(context), Overlay { | @@ -49,10 +54,18 @@ class Polyline(context: Context) : ReactViewGroup(context), Overlay { | ||
49 | polyline?.isDottedLine = value | 54 | polyline?.isDottedLine = value |
50 | } | 55 | } |
51 | 56 | ||
57 | + var line: BitmapDescriptor? = null | ||
58 | + fun setLine(source: ReadableMap) { | ||
59 | + fetchImage(source) { | ||
60 | + line = it | ||
61 | + } | ||
62 | + } | ||
63 | + | ||
52 | override fun add(map: AMap) { | 64 | override fun add(map: AMap) { |
53 | polyline = map.addPolyline( | 65 | polyline = map.addPolyline( |
54 | PolylineOptions() | 66 | PolylineOptions() |
55 | .addAll(points) | 67 | .addAll(points) |
68 | + .setCustomTexture(line) | ||
56 | .color(color) | 69 | .color(color) |
57 | .colorValues(colors) | 70 | .colorValues(colors) |
58 | .width(width) | 71 | .width(width) |
lib/android/src/main/java/cn/feewee/amap3d/map_view/PolylineManager.kt
@@ -7,58 +7,64 @@ import com.facebook.react.uimanager.annotations.ReactProp | @@ -7,58 +7,64 @@ import com.facebook.react.uimanager.annotations.ReactProp | ||
7 | import cn.feewee.amap3d.getEventTypeConstants | 7 | import cn.feewee.amap3d.getEventTypeConstants |
8 | import cn.feewee.amap3d.toLatLngList | 8 | import cn.feewee.amap3d.toLatLngList |
9 | import cn.feewee.amap3d.toPx | 9 | import cn.feewee.amap3d.toPx |
10 | +import com.facebook.react.bridge.ReadableMap | ||
10 | 11 | ||
11 | @Suppress("unused") | 12 | @Suppress("unused") |
12 | internal class PolylineManager : SimpleViewManager<Polyline>() { | 13 | internal class PolylineManager : SimpleViewManager<Polyline>() { |
13 | - override fun getName(): String { | ||
14 | - return "AMapPolyline" | ||
15 | - } | 14 | + override fun getName(): String { |
15 | + return "AMapPolyline" | ||
16 | + } | ||
16 | 17 | ||
17 | - override fun createViewInstance(context: ThemedReactContext): Polyline { | ||
18 | - return Polyline(context) | ||
19 | - } | 18 | + override fun createViewInstance(context: ThemedReactContext): Polyline { |
19 | + return Polyline(context) | ||
20 | + } | ||
20 | 21 | ||
21 | - override fun getExportedCustomBubblingEventTypeConstants(): Map<String, Any> { | ||
22 | - return getEventTypeConstants("onPress") | ||
23 | - } | 22 | + override fun getExportedCustomBubblingEventTypeConstants(): Map<String, Any> { |
23 | + return getEventTypeConstants("onPress") | ||
24 | + } | ||
24 | 25 | ||
25 | - @ReactProp(name = "points") | ||
26 | - fun setPoints(polyline: Polyline, points: ReadableArray) { | ||
27 | - polyline.points = points.toLatLngList() | ||
28 | - } | 26 | + @ReactProp(name = "points") |
27 | + fun setPoints(polyline: Polyline, points: ReadableArray) { | ||
28 | + polyline.points = points.toLatLngList() | ||
29 | + } | ||
29 | 30 | ||
30 | - @ReactProp(name = "colors") | ||
31 | - fun setColors(polyline: Polyline, colors: ReadableArray) { | ||
32 | - polyline.colors = (0 until colors.size()).map { colors.getInt(it) } | ||
33 | - } | 31 | + @ReactProp(name = "colors") |
32 | + fun setColors(polyline: Polyline, colors: ReadableArray) { | ||
33 | + polyline.colors = (0 until colors.size()).map { colors.getInt(it) } | ||
34 | + } | ||
34 | 35 | ||
35 | - @ReactProp(name = "color", customType = "Color") | ||
36 | - fun setColor(polyline: Polyline, color: Int) { | ||
37 | - polyline.color = color | ||
38 | - } | 36 | + @ReactProp(name = "color", customType = "Color") |
37 | + fun setColor(polyline: Polyline, color: Int) { | ||
38 | + polyline.color = color | ||
39 | + } | ||
39 | 40 | ||
40 | - @ReactProp(name = "width") | ||
41 | - fun setWidth(polyline: Polyline, width: Float) { | ||
42 | - polyline.width = width.toPx().toFloat() | ||
43 | - } | 41 | + @ReactProp(name = "width") |
42 | + fun setWidth(polyline: Polyline, width: Float) { | ||
43 | + polyline.width = width.toPx().toFloat() | ||
44 | + } | ||
44 | 45 | ||
45 | - @ReactProp(name = "zIndex") | ||
46 | - fun setIndex(polyline: Polyline, zIndex: Float) { | ||
47 | - polyline.zIndex = zIndex | ||
48 | - } | 46 | + @ReactProp(name = "zIndex") |
47 | + fun setIndex(polyline: Polyline, zIndex: Float) { | ||
48 | + polyline.zIndex = zIndex | ||
49 | + } | ||
49 | 50 | ||
50 | - @ReactProp(name = "geodesic") | ||
51 | - fun setGeodesic(polyline: Polyline, geodesic: Boolean) { | ||
52 | - polyline.geodesic = geodesic | ||
53 | - } | 51 | + @ReactProp(name = "geodesic") |
52 | + fun setGeodesic(polyline: Polyline, geodesic: Boolean) { | ||
53 | + polyline.geodesic = geodesic | ||
54 | + } | ||
54 | 55 | ||
55 | - @ReactProp(name = "dashed") | ||
56 | - fun setDashed(polyline: Polyline, dashed: Boolean) { | ||
57 | - polyline.dashed = dashed | ||
58 | - } | 56 | + @ReactProp(name = "dashed") |
57 | + fun setDashed(polyline: Polyline, dashed: Boolean) { | ||
58 | + polyline.dashed = dashed | ||
59 | + } | ||
59 | 60 | ||
60 | - @ReactProp(name = "gradient") | ||
61 | - fun setGradient(polyline: Polyline, gradient: Boolean) { | ||
62 | - polyline.gradient = gradient | ||
63 | - } | 61 | + @ReactProp(name = "gradient") |
62 | + fun setGradient(polyline: Polyline, gradient: Boolean) { | ||
63 | + polyline.gradient = gradient | ||
64 | + } | ||
65 | + | ||
66 | + @ReactProp(name = "line") | ||
67 | + fun setLine(view: Polyline, line: ReadableMap?) { | ||
68 | + line?.let { view.setLine(it) } | ||
69 | + } | ||
64 | } | 70 | } |
lib/src/polyline.tsx
1 | import * as React from "react"; | 1 | import * as React from "react"; |
2 | -import { ColorValue, Platform, processColor, requireNativeComponent } from "react-native"; | 2 | +import { ColorValue, ImageSourcePropType, Platform, processColor, requireNativeComponent } from "react-native"; |
3 | +// @ts-ignore | ||
4 | +import resolveAssetSource from "react-native/Libraries/Image/resolveAssetSource"; | ||
3 | import { LatLng } from "./types"; | 5 | import { LatLng } from "./types"; |
4 | 6 | ||
5 | export interface PolylineProps { | 7 | export interface PolylineProps { |
@@ -12,12 +14,14 @@ export interface PolylineProps { | @@ -12,12 +14,14 @@ export interface PolylineProps { | ||
12 | * 线段宽度 | 14 | * 线段宽度 |
13 | */ | 15 | */ |
14 | width?: number; | 16 | width?: number; |
15 | - | 17 | + /** |
18 | + * 线段的纹理 | ||
19 | + */ | ||
20 | + line?: ImageSourcePropType; | ||
16 | /** | 21 | /** |
17 | * 线段颜色 | 22 | * 线段颜色 |
18 | */ | 23 | */ |
19 | color?: ColorValue; | 24 | color?: ColorValue; |
20 | - | ||
21 | /** | 25 | /** |
22 | * 层级 | 26 | * 层级 |
23 | */ | 27 | */ |
@@ -58,7 +62,7 @@ export default class extends React.PureComponent<PolylineProps> { | @@ -58,7 +62,7 @@ export default class extends React.PureComponent<PolylineProps> { | ||
58 | ...Platform.select({ android: { colors: this.props.colors.map(processColor) } }), | 62 | ...Platform.select({ android: { colors: this.props.colors.map(processColor) } }), |
59 | }; | 63 | }; |
60 | // @ts-ignore | 64 | // @ts-ignore |
61 | - return <NativePolyline {...props} />; | 65 | + return <NativePolyline {...props} line={resolveAssetSource(props.line)} />; |
62 | } | 66 | } |
63 | } | 67 | } |
64 | 68 |