How to add Arabic chars in flutter pdf generating

user_9494140 0
Viewed 4574

I'm trying to generate a pdf in flutter using the package PDF ,, here is my code :

  final doc = pw.Document();
  var data = await rootBundle.load("assets/fonts/arial.ttf");
  var myFont = Font.ttf(data);
  String test = 'الشكرمون طاخ فى الترارولى';
  var data2 = utf8.encode(test);
  doc.addPage(
    pw.Page(
      build: (pw.Context context) => pw.Center(
        child: pw.Text(test, style: pw.TextStyle(fontSize: 80,font: myFont)),
      ),
    ),
  );

and here is how it is being generated :

enter image description here

while the actual result expected should be not chars separated, here is an example of what I should see :

enter image description here

dart flutter pdf android
5 Answers

just add textDirection: pw.TextDirection.rtl to the Text widget , like this :

 pw.Page(
      build: (pw.Context context) => pw.Center(
        child: pw.Text(test, style: pw.TextStyle(fontSize: 80,font: myFont),textDirection: 
        pw.TextDirection.rtl),
      ),
    ),

Note: Problems may occur if the text contains some numbers

user_104983740

just add theme: ThemeData.withFont(base: ttf,) to the Page widget, like this:

  var data = await rootBundle.load("fonts/IRANSansWeb(FaNum)_Bold.ttf");
  final ttf = Font.ttf(data);

 Page(
      pageFormat: PdfPageFormat.a4,
      theme: ThemeData.withFont(
        base: ttf,
      ),
      orientation: PageOrientation.landscape,
      build: (Context context) {
return Align(
  alignment: Alignment.center,
  child: new Column(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      crossAxisAlignment: CrossAxisAlignment.center,
      children: [
        Column(
          children: [
            Row(
              children: [
                Text(
                  'خلیج فارس',
                 textDirection: TextDirection.rtl,
                )
              ]
            )
          ]
        ),
        Column(
          children: [
            Image(compareChartImage),
          ]
        ),
        Column(
          children:[
            Image(timingChartImage),
          ]
        )
      ]
  ));
 }
)
user_101481460

if all your widget has rtl parent all widget with pw.Directionality and set TextDirection.rtl , or use TextDirection.rtl in single text widget

user_101495350

You encoded the text but used the original one! Try the encoded var

user_126766640

use font support Arabic language like Tajawal

final theme = ThemeData.withFont(
  base: Font.ttf(await rootBundle.load('assets/fonts/Tajawal-Regular.ttf')),
  bold: Font.ttf(await rootBundle.load('assets/fonts/Tajawal-Bold.ttf')),
);

pw.Document.addPage(
  MultiPage(
    pageTheme: PageTheme(
      theme: theme,
      pageFormat: PdfPageFormat.a4,
    ),
    header: (context) => _buildHeader(),
    footer: _buildFooter,
    build: (context) => _buildBody(),
  ),
);
user_75531950
Related