شارك المقالة
شرح إنشاء فاتورة Flutter PDF Arabic Invoice مخصصة مع دعم و RTL خطوة بخطوة

شرح إنشاء فاتورة Flutter PDF Arabic Invoice مخصصة مع دعم و RTL خطوة بخطوة

شرح إنشاء فاتورة Flutter PDF Arabic Invoiceمخصصة مع دعم و RTL خطوة بخطوة بالتفصيل


تُعد عملية إنشاء فواتير PDF داخل تطبيقات Flutter من المتطلبات الأساسية في التطبيقات التجارية والمحاسبية. يهدف هذا الأسلوب إلى توليد فواتير احترافية قابلة للطباعة والمشاركة، مع دعم كامل للغة العربية واتجاه الكتابة من اليمين إلى اليسار (RTL). تشرح هذه المقالة كيفية إنشاء فاتورة PDF ديناميكية في Flutter باستخدام مكتبة pdf مع مثال عملي ودراسة الفوائد والمشاكل المحتملة.

ما هي فواتير PDF في Flutter؟

فواتير PDF في Flutter هي مستندات يتم إنشاؤها برمجيًا باستخدام مكتبات مخصصة مثل pdf، وتُستخدم لعرض بيانات الفاتورة مثل المنتجات، الأسعار، الضرائب، والمجموع الكلي بتنسيق ثابت يعمل على جميع الأجهزة، مع إمكانية دعم لغات متعددة مثل العربية.
تُستخدم هذه الفواتير عادةً في: – تطبيقات المتاجر الإلكترونية – أنظمة المحاسبة – تطبيقات إدارة الطلبات – تطبيقات نقاط البيع (POS)

سيناريو عملي لتوضيح الفكرة

لنفترض أنك تقوم ببناء تطبيق متجر إلكتروني باستخدام Flutter، وتريد عند إتمام الطلب إنشاء فاتورة PDF عربية تحتوي على تفاصيل المنتجات، السعر، الكمية، والضريبة، مع إمكانية إرسالها للعميل أو طباعتها مباشرة.

إنشاء فاتورة PDF بدون دعم اللغة العربية

في حال تم إنشاء فاتورة PDF بدون تحميل خط عربي أو تحديد اتجاه النص، ستظهر النصوص العربية بشكل غير صحيح أو مقطعة، كما سيكون اتجاه العرض غير مناسب للمستخدم العربي.
مساوئ هذا الأسلوب: – عدم ظهور اللغة العربية بشكل صحيح – ضعف تجربة المستخدم – صعوبة قراءة الفاتورة – عدم توافق مع الأسواق العربية

إنشاء فاتورة PDF في Flutter مع دعم اللغة العربية و RTL

لحل هذه المشكلة، يتم استخدام خط عربي مخصص مثل Cairo، مع تحديد اتجاه النص من اليمين إلى اليسار داخل pw.MultiPage، وضبط محاذاة النصوص والجداول.

Future<Uint8List> generatePdfBytes({
  required InvoiceResponse invoiceResponse,
}) async {

  final arabicFont = pw.Font.ttf(
    await rootBundle.load("assets/fonts/cairo-font.ttf"),
  );

  final pdf = pw.Document();

  pdf.addPage(
    pw.MultiPage(
      textDirection: pw.TextDirection.rtl,
      build: (pw.Context context) => [
        pw.Column(
          children: [
            pw.Row(
              children: [
                pw.Image(logo, width: 50, height: 50),
                pw.Spacer(),
                pw.Text(
                  "Geecoders",
                  style: pw.TextStyle(
                    font: arabicFont,
                    fontSize: 20,
                    color: const PdfColor.fromInt(0xff007A86),
                  ),
                ),
              ],
            ),
          ],
        ),
        pw.SizedBox(height: 20),
        pw.Table.fromTextArray(
          context: context,
          cellStyle: pw.TextStyle(font: arabicFont),
          headerStyle: pw.TextStyle(font: arabicFont),
          headerAlignment: pw.Alignment.center,
          cellAlignment: pw.Alignment.center,
          headerDecoration: const pw.BoxDecoration(
            color: PdfColor.fromInt(0xFF000000),
          ),
          data: [
            ['المجموع', 'الكمية', 'السعر', 'المنتج'],
            ...invoiceResponse.products.map(
              (p) => [
                p.total,
                '${p.quantity}',
                '${p.price}',
                '${p.productName}',
              ],
            ),
          ],
        ),
        pw.SizedBox(height: 10),
        pw.Row(
          mainAxisAlignment: pw.MainAxisAlignment.spaceAround,
          children: [
            pw.Text(
              'الضريبة: ٥٪',
              style: pw.TextStyle(font: arabicFont, fontSize: 10),
            ),
            pw.Text(
              'إجمالي قيمة الضريبة: ١٢٠',
              style: pw.TextStyle(font: arabicFont, fontSize: 10),
            ),
          ],
        ),
      ],
    ),
  );

  return pdf.save();
}

الاختلافات بين النهجين

بدون دعم اللغة العربية: – ظهور النصوص بشكل غير صحيح – اتجاه عرض غير مناسب – تجربة مستخدم ضعيفة – غير مناسب للتطبيقات العربية
باستخدام دعم اللغة العربية و RTL: – عرض النصوص بشكل صحيح – تجربة مستخدم احترافية – دعم كامل للأسواق العربية – تصميم قابل للتخصيص

مميزات وعيوب إنشاء فواتير PDF في Flutter

المميزات. – دعم كامل للغة العربية و RTL – تحكم كامل في التصميم والمحتوى – إمكانية التصدير والطباعة – مناسب للتطبيقات التجارية

العيوب. – يتطلب إعداد خطوط مخصصة – زيادة بسيطة في حجم التطبيق – يحتاج إلى اختبار جيد على أكثر من جهاز
إن إنشاء فواتير PDF في Flutter مع دعم اللغة العربية يُعد خطوة أساسية لأي تطبيق يستهدف المستخدم العربي. باستخدام مكتبة pdf وتحميل خط عربي مخصص، يمكنك إنشاء فواتير احترافية وقابلة للتخصيص بسهولة.
هذا الأسلوب يمنح تطبيقك مظهرًا احترافيًا، ويحسّن تجربة المستخدم، ويجعل تطبيقك مناسبًا للاستخدام التجاري على نطاق واسع.
الخلاصة: يتم استخدام هذا الأسلوب عندما تحتاج إلى إنشاء فواتير PDF ديناميكية تدعم اللغة العربية واتجاه RTL، مع الحفاظ على تصميم ثابت وقابل للطباعة، وهو حل مثالي لتطبيقات Flutter التجارية والمحاسبية.
شاهد أيضًا
مقالات ذات صلة
مشروع لتطبيق التعرف على النصوص من داخل الصوره في فلاتر

مشروع لتطبيق التعرف على النصوص من داخل الصوره في فلاتر كما نعلم ان تطبيقات الذكاء…

شرح كيفية انشاء model للتعرف على الصور باستخدام Flutter

شرح كيفية انشاء model للتعرف على الصور باستخدام Flutter في هذا المقال سوف نشرح معكم…

تخصيص عرض اختيار التاريخ في flutter الى reel كاجهزة ios

تخصيص عرض اختيار التاريخ في flutter الى reel كاجهزة ios في هذا المقال سوف نشرح…

🚫 مانع الإعلانات مفعل

يجب إيقاف مانع الإعلانات لاستكمال تصفح الموقع