如何使用react-native-maps更改mapView.callout的默认背景颜色？

Question

我正在尝试更改标注的背景颜色，但是背景颜色不会影响总视图。

这是我所拥有的屏幕截图：

我希望backgroundColor包含完整的工具提示。

这是我的代码：

<MapView.Callout
            style={{
              width: 200,
              height: 40,
              backgroundColor: '#107B67',
              borderRadius: 10,
              zIndex: 10
            }}
          >
            <View
              style={{
                flex: 1,
                justifyContent: 'center',
                alignItems: 'center'
              }}
            >
              <Text>logkjbkb</Text>
            </View>
          </MapView.Callout>

如何将backgroundColor设置为整个标注？

Answer 1

您需要将“标注”组件上的“工具提示”道具设置为true。

<MapView.Callout
    tooltip={true}
    style={{
        width: 200,
        height: 40,
        backgroundColor: '#107B67',
        borderRadius: 10,
        zIndex: 10
     }}
  >
</MapView.Callout>`

道具： 工具提示

类型： 布尔假

如果 false ，则会在此标注子项周围绘制默认的“工具提示”气泡窗口。如果 true ，则子视图可以完全自定义其外观，包括任何类似“气泡”的样式。

这里是参考：https://github.com/react-native-community/react-native-maps/blob/master/docs/callout.md