Estoy tratando de representar imágenes usando el paquete react-native-htmlview , pero en Android solo coloca la posición de la imagen al comienzo de la línea. Funciona bastante bien en iOS.

Androide:

iOS:

La react-native-htmlview básicamente representa una cadena html reemplazada con componentes React Native.

Traté de cambiar los estilos a position:'absolute' , justifyContent: 'flex-start' , flexDirection:'row' , establecí un paddingTop: imgWidth , pero nada funciona...

Cuando realizo algún cambio en el código y el simulador de Android se actualiza, ¡las imágenes se mueven a la posición correcta!

El código:

 import React from 'react'; import { StyleSheet, Dimensions, Image } from 'react-native'; import ImageZoom from 'react-native-image-pan-zoom'; import HTMLView from 'react-native-htmlview'; export function HtmlView(props) { let now = new Date().getTime() const renderNode = (node, index, siblings, parent, defaultRenderer) => { if (node.name === 'img') { const data = node.attribs; const imgWidth = Dimensions.get('window').width - 100 return ( <View key={`${now}-img-view`} style={props.type == 'resolution'? styles.imgViewResolution: styles.imgView}> <ImageZoom key={`${now}-img-zoom`} style={styles.imageZoom} cropWidth={imgWidth} cropHeight={imgWidth} imageWidth={imgWidth} imageHeight={imgWidth}> <Image resizeMode="contain" key={`${now}-img`} source={{ uri: data.src }} style={{ width: imgWidth, height: imgWidth, aspectRatio: 1 }} /> </ImageZoom> <Text key={`${now}-img-text`} style={props.type == 'cell'? cellStyles.zoomImageText : styles.zoomImageText}><Ionicons name="resize-outline" size={12}/> utilize o zoom para ampliar a imagem</Text> </View> ); } return ( <HTMLView key={`${now}-htmlview`} stylesheet={styles} renderNode={renderNode} paragraphBreak={props.paragraphBreak || '\n'} value={props.value}/> ) }