Open thomasgrivet opened 8 months ago
@thomasgrivet can you explain this a bit further:
Hello, the 'pin' image is being resized to fit the text, but is not being stretched. Did I miss something? Thanks!
Images are resized by stretching the parts that specified. So being resized but not being stretched, doesn't make sense to me. Can you explain?
Hello! Sorry for the confusion, what I meant was that even though the pin image is being resized to fit the text, I would have expected it to have some spacing around my text (8px horizontally with stretchX={[[8, 100 - 8]]}
and 4px vertically with stretchY={[[4, 50 - 4]]}
). But I may have misunderstood how to use those props, let me know if I haven't been clear.
Thanks!
stretch doesn't add padding, it just means that For that you can use content or https://rnmapbox.github.io/docs/components/SymbolLayer#icontextfitpadding
https://docs.mapbox.com/mapbox-gl-js/example/add-image-stretchable/
Thanks for the quick answer! I initially wanted to use iconTextFitPadding but this would distort the borderRadius of the image, which is why I though using stretchX would be ideal. In their example, they use a stretchX which starts at 25 to avoid having the bubble's top left borderRadius change due to the resizing of the asset. I can add an example of the result with iconTextFitPadding if you want!
Mapbox Implementation
Mapbox
Mapbox Version
default
Platform
iOS
@rnmapbox/maps
version10.1.15
Standalone component to reproduce
Observed behavior and steps to reproduce
Hello, the 'pin' image is being resized to fit the text, but is not being stretched. Did I miss something? Thanks!
Expected behavior
There should be a padding of 8px vertically & 4px horizontally
Notes / preliminary analysis
No response
Additional links and references
I have created a minimum reproductible example here : https://github.com/Cocolis-1/blank-expo/tree/feat/mapbox-stretchable-images If you want to try it, you have to edit the
MAPBOX_DOWNLOAD_TOKEN
inapp.json
and theMAPBOX_TOKEN
inMap.tsx
. To create a dev client, runeas build --profile development -p ios --local
, please ping me if you need any help, thanks!