按下标记时如何在底部显示视图

Question

当我按下一个标记时，我需要在底部显示一个视图，就像谷歌地图应用程序或苹果地图，当你点击一个地方并在屏幕底部显示它的信息

这是我现在的代码：

export function Home() {
  return (
    <View className="w-full h-full">
      <MapView region={location} className="flex-1">
        {summary &&
          summary.map((item) => (
            <Marker
              key={item.id}
              coordinate={{ latitude: item.latitude, longitude: item.longitude }}
              onPress={() => setSelectedMarker(item.id)}
            >
              <Image source={uberCaricon} className="w-12 h-12" />
              <Callout>
                <Text className="font-bold text-black ">Hello world</Text>
              </Callout>
            </Marker>
          ))}
      </MapView>
    </View>
  );
}```


I want to look like this:
[Google Maps bottom view when you press a place](https://i.stack.imgur.com/DIPEW.jpg)

I tried the callout function, but I got only a callout at the top of my marker

[How its working RN](https://i.stack.imgur.com/XOI3W.png)