As you can see below in the screenshot, the DOT starting the paragraph instead of ending it when aligning the text to right and do have the RTL ability in the code.
I'm using react-native-render-html Lib and tried too much options to make it fully Right to Left inside the <HTML code ... but with no success.
The Text aligned correctly Right to Left but not the Paragraph.
Also in the first line, it should began with the English words then the Hebrew ones.
Code example:
import HTML from 'react-native-render-html';
<HTML
html={ item.post_description }
tagsStyles={tagsStyles}
containerStyle={{ alignSelf: isRTL ? 'flex-end' : 'flex-start', alignItems: isRTL ? 'flex-end' : 'flex-start'}}
classesStyles={classesStyles}
imagesMaxWidth={Dimensions.get('window').width * .9 }
staticContentMaxWidth={Dimensions.get('window').width * .9 }
onLinkPress={(event, url) => Linking.openURL(url)} />
const tagsStyles = {
p: {
textAlign: 'center',
marginBottom: 10,
textAlign: 'right',
fontSize: 18,
dir: 'rtl',
},
img: {
marginLeft: 'auto',
marginRight: 'auto',
marginTop: 20
}
}
const classesStyles = {
}
Platform: iOS (ReactNative) in both simulator and real Device.
"react-native-render-html": "^6.1.0"
Data for testing:
<p>High Intensity Interval Training - או בעברית: אימון הפוגות בעצימות גבוהה. משתייך לקבוצת האימונים הפונקציונליים, בדגש על שיפור מרכיב הסבולת. שיטת אימונים זו תופסת תאוצה בישראל ובעולם ויש לכך סיבה בהחלט טובה: שיטה זו מאפשרת להשיג תוצאות יוצאות דופן גם בהיבט הוויזואלי, עיצוב הגוף, וגם בהיבט הכושר הגופני על מרבית מרכיביו, בעיקרם סבולת שרירית וסבולת לב ריאה, מהירות, קואורדינציה ושיווי משקל. תוצאות שניכרות במהירות למתמידים בשיטה זו. מאוד זמין ונגיש לביצוע לאור העובדה שניתן ליישם גם ללא ציוד מיוחד.</p>
Solution could be found here: https://stackoverflow.com/a/68284174/19460851 It worked for me! I used a function instead of a hook:
...and just called it whenever I needed.