Quantcast
Channel: Active questions tagged react-native+ios - Stack Overflow
Viewing all articles
Browse latest Browse all 16750

Why is mapPadding Prop not giving any padding on iOS devices when padding is specified?

$
0
0

I'm having an issue in which upon rendering a map using react-native-maps we are not able to display map padding on iOS devices only.

It's interesting because, Android devices do display the map padding properly, but iOS devices won't show any padding at all when that prop is set.

Here is the following code that works on Android devices but NOT iOS devices in regards to mapPadding:

<MapView          ref={(map) => (this.map = map)}          mapPadding={{ top: 0, right: 0, bottom: 550, left: 0 }}          paddingAdjustmentBehavior="always"          initialRegion={{            latitude: 30.2303 - 0.0123,            longitude: -97.7538,            latitudeDelta: 0.2,            longitudeDelta: 0.1,          }}          style={styles.mapStyle}>          {crawlCard.map((crawl, index) => {            return (<Marker                coordinate={{                  latitude: crawl.coords.lat,                  longitude: crawl.coords.lon,                }}                title={crawl.title}                key={index}                onSelect={() => {                  this.map.animateToRegion(                    {                      latitude: crawl.coords.lat,                      longitude: crawl.coords.lon,                    },                    200                  );                }}              />            );          })}</MapView>

Is there any other function/method we need to implement to get this mapPadding prop to work on iOS devices? All examples my team & I have seen have used the mapPadding just like this for both platforms.

We're using:React Native 5.xreact-native-maps 0.26.1

Any assistance would be greatly appreciated. Thank you kindly!


Viewing all articles
Browse latest Browse all 16750

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>