iamacup / react-native-markdown-display

React Native 100% compatible CommonMark renderer
MIT License
590 stars 169 forks source link

New onImagePress or alternative #93

Closed braincore closed 4 years ago

braincore commented 4 years ago

I'm looking to make images touchable. My first attempt was to modify the image rule to simply wrap FitImage with a TouchableOpacity. However, this results in an unstable render where the page expands and contracts quickly; without investigating, a guess is that the images are being shown, hidden, shown, and so forth.

Is there a recommended approach?

Whatever that approach may be, I'm happy to look into adding an onImagePress: (src) => void callback similar to onLinkPress if you think that makes sense.

braincore commented 4 years ago

Looks like the issue stems from interaction with FitImage. When replacing it with a regular Image that does its own layout size discovery, the flickering issue disappears and the wrapping TouchableOpacity behaves as expected.

iamacup commented 4 years ago

It's not needed - try this:

[![Face](https://images.theweek.com/sites/default/files/styles/tw_image_9_4/public/istock-527028804.jpg)](https://www.youtube.com/watch?v=dQw4w9WgXcQ)

You could use this with the existing link callback

braincore commented 4 years ago

Just saw this. FWIW, my use case is to tap the image to zoom & pan, not open a link.