react native text justify and center

Question

In react native we have textAlign property with the options to either "justify" (and the last line will follow default text direction) or "center" (where the text is centered but lines are not justified) I want to know if there is a way to combine both (i.e. center the text and also have the lines start and end uniformly)?

Edit: Here is the code import React from "react"; import { StyleSheet, Text, View, ScrollView, StatusBar } from "react-native";

export default function App() {
 return (
  <View style={styles.background}>
  <View style={styles.pageContainer}>
    <ScrollView
      contentContainerStyle={{
        alignItems: "center",
        justifyContent: "center",
      }}
    >
      <Text style={styles.arabicText}>
        ??? ????? ?????? (1) ??? ????? ?????? (1) ??? ????? ?????? (1) ???
        ????? ?????? (1) ??? ????? ?????? (1) ??? ????? ?????? (1) ??? ?????
        ?????? (1) ??? ????? ?????? (1) ??? ????? ?????? (1) ??? ?????
        ?????? (1) ??? ????? ?????? (1) ??? ????? ?????? (1) ??? ?????
        ?????? (1) ??? ????? ?????? (1) ??? ????? ?????? (1) ??? ?????
        ?????? (1) ??? ????? ?????? (1) ??? ????? ?????? (1) ??? ?????
        ?????? (1) ??? ????? ?????? (1)
        </Text>
       </ScrollView>
     </View>
    </View>
  );
 }

  const styles = StyleSheet.create({
  background: {
  flex: 1,
  justifyContent: "space-evenly",
  alignItems: "center",
  backgroundColor: "white",
  },
  pageContainer: {
  alignItems: "center",
  width: "100%",
  flex: 1,
  backgroundColor: "#FFFAF1",
},
 arabicText: {
 direction: "rtl",
 marginRight: 8,
 marginLeft: 8,
 marginTop: 5,
 marginBottom: 5,
 flexDirection: "row",
 textAlign: "justify",
 fontSize: 26,
  padding: 2,
  },
});

---

question from:https://stackoverflow.com/questions/66047067/react-native-text-justify-and-center

Answer 1

Yes you can put your Text tag inside View tag and give your View alignItems:'center' property

 <View style={{ alignItems: 'center' }}>
    <Text style={{ textAlign: 'justify' }}>
         Enter your text here
    </Text>
 </View>