首页 > 解决方案 > 如何在颤动中使用富文本实现对齐中心

问题描述

富文本小部件中的对齐属性有右、左、居中和对齐,

使用中心时,它给了我居中的文本而没有证明它,而当使用 justify 时,它给了我 ltr justify。

这段代码:

RichText(
      textAlign:TextAlign.center,
      text:TextSpan(
        children:[
          TextSpan(text: 'مَثَلُهُمْ كَمَثَلِ ٱلَّذِى ٱسْتَوْقَدَ نَارًا فَلَمَّآ أَضَآءَتْ مَا حَوْلَهُۥ ذَهَبَ ٱللَّهُ بِنُورِهِمْ وَتَرَكَهُمْ فِى ظُلُمَٰتٍۢ لَّا يُبْصِرُونَ, صُمٌّۢ بُكْمٌ عُمْىٌ فَهُمْ لَا يَرْجِعُونَ, أَوْ كَصَيِّبٍۢ مِّنَ ٱلسَّمَآءِ فِيهِ ظُلُمَٰتٌ وَرَعْدٌ وَبَرْقٌ يَجْعَلُونَ أَصَٰبِعَهُمْ فِىٓ ءَاذَانِهِم مِّنَ ٱلصَّوَٰعِقِ حَذَرَ ٱلْمَوْتِ ۚ وَٱللَّهُ مُحِيطٌۢ بِٱلْكَٰفِرِينَ'),
          TextSpan(text:'وَإِن كُنتُمْ فِى رَيْبٍۢ مِّمَّا نَزَّلْنَا عَلَىٰ عَبْدِنَا فَأْتُواْ بِسُورَةٍۢ مِّن مِّثْلِهِۦ وَٱدْعُواْ شُهَدَآءَكُم مِّن دُونِ ٱللَّهِ إِن كُنتُمْ صَٰدِقِينَ, فَإِن لَّمْ تَفْعَلُواْ وَلَن تَفْعَلُواْ فَٱتَّقُواْ ٱلنَّارَ ٱلَّتِى وَقُودُهَا ٱلنَّاسُ وَٱلْحِجَارَةُ ۖ أُعِدَّتْ لِلْكَٰفِرِينَ')
    ]))

给了这个: 在此处输入图像描述

这个代码:

RichText(
      textAlign:TextAlign.justify,
      text:TextSpan(
        children:[
          TextSpan(text: 'مَثَلُهُمْ كَمَثَلِ ٱلَّذِى ٱسْتَوْقَدَ نَارًا فَلَمَّآ أَضَآءَتْ مَا حَوْلَهُۥ ذَهَبَ ٱللَّهُ بِنُورِهِمْ وَتَرَكَهُمْ فِى ظُلُمَٰتٍۢ لَّا يُبْصِرُونَ, صُمٌّۢ بُكْمٌ عُمْىٌ فَهُمْ لَا يَرْجِعُونَ, أَوْ كَصَيِّبٍۢ مِّنَ ٱلسَّمَآءِ فِيهِ ظُلُمَٰتٌ وَرَعْدٌ وَبَرْقٌ يَجْعَلُونَ أَصَٰبِعَهُمْ فِىٓ ءَاذَانِهِم مِّنَ ٱلصَّوَٰعِقِ حَذَرَ ٱلْمَوْتِ ۚ وَٱللَّهُ مُحِيطٌۢ بِٱلْكَٰفِرِينَ'),
          TextSpan(text:'وَإِن كُنتُمْ فِى رَيْبٍۢ مِّمَّا نَزَّلْنَا عَلَىٰ عَبْدِنَا فَأْتُواْ بِسُورَةٍۢ مِّن مِّثْلِهِۦ وَٱدْعُواْ شُهَدَآءَكُم مِّن دُونِ ٱللَّهِ إِن كُنتُمْ صَٰدِقِينَ, فَإِن لَّمْ تَفْعَلُواْ وَلَن تَفْعَلُواْ فَٱتَّقُواْ ٱلنَّارَ ٱلَّتِى وَقُودُهَا ٱلنَّاسُ وَٱلْحِجَارَةُ ۖ أُعِدَّتْ لِلْكَٰفِرِينَ')
    ]))

给了这个: 在此处输入图像描述

我怎样才能使文本的对齐既是合理的又是居中的,尤其是像这样的阿拉伯语文本:

在此处输入图像描述

标签: fluttercentertext-alignjustify

解决方案


您可以使用小部件的softWrap&textAlign属性RichText来居中对齐并相应地包装内容文本。

例子:

RichText(
      softWrap:true,
      textAlign:TextAlign.center,
      text:TextSpan(
        style:TextStyle(color: Colors.orange),
        children:[
          TextSpan(text: 'كن لا بد أن أوضح لك أن كل هذه الأفكار المغلوطة حول استنكار'),
          TextSpan(text:' الحصول على ميزة أو فائدة؟ ولكن من لديه الحق أن ينتقد شخص ما أراد أن يشعر بالسعادة التي لا تشوبها عواقب أليمة ')
    ]))

输出: 在此处输入图像描述


推荐阅读