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

Question

我正在尝试更改标注的背景颜色，但背景颜色不会影响整个 View 。

这是我的截图:

我希望 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>

如何将背景颜色设置为整个标注？

Answer 1

您需要将 Callout 组件上的 'tooltip' 属性设置为 true。

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

支持:工具提示

类型: bool 假

如果 false，默认的“工具提示”气泡窗口将围绕这个标注子项绘制。如果 true， subview 可以完全自定义它们的外观，包括任何“气泡”样式。

这里是引用:https://github.com/react-native-community/react-native-maps/blob/master/docs/callout.md