反应原生文本对齐并居中

问题描述

在 react native 中,我们有 textAlign 属性,其中包含“对齐”(最后一行将遵循认文本方向)或“居中”(文本居中但行不对齐)的选项 我想知道是否有办法将两者结合起来(即使文本居中并使线条开始和结束均匀)?

编辑: 这是代码 从“反应”导入反应; 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,});

解决方法

是的,您可以将 Text 标签放入 View 标签中,然后让您的视图 alignItems:'center' 财产

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