How to create string that contains mix color text with underline without adding in multiple pages




i want to draw pdf like this



1 Reply

GK Gowthamraj Kumar Syncfusion Team June 27, 2022 01:09 PM UTC

Hi Ali Hassan,


At present, we do not have support for drawing a string with multi color text and custom underline styles in a line using our PDF library. And we do not have support for applying the HTML tags styles while creating a Flutter pdf document. We have already logged a feature request for this and we do not have an immediate plan to implement this feature. We will implement this feature in any of our upcoming releases. We usually have an interval of at least three months between releases, at the planning stage of every release cycle, will review all the open features and we will notify you once this support is included.


The status of the feature can be tracked through our Feature Management system,

https://www.syncfusion.com/feedback/35281/add-support-for-applying-the-html-tags-while-creating-a-pdf-document-in-flutter


As a workaround, we can achieve the above requirement in sample level, but it is only working for word wrap type. Please find the below code snippet,

PdfDocument document = PdfDocument();

  PdfPage page = document.pages.add();

  String text =

      'Adventure Works Cycles, the fictitious company on which the Adventure Works sample databases are based, is a large, multinational manufacturing company. The company manufactures and sells metal and composite bicycles to North American, European and Asian commercial markets. While its base operation is located in Washington with 290 employees, several regional sales teams are located throughout their market base.';

  Map<String, PdfColor> highlightCollection = <String, PdfColor>{

    'Adventure': PdfColor(255, 0, 0),

    'company': PdfColor(0, 255, 0),

    '290 employees': PdfColor(0, 0, 255),

    'base.': PdfColor(255, 0, 255),

  };

  AddParagraphWithHighLight(page, text, highlightCollection,

      PdfStandardFont(PdfFontFamily.helvetica, 12));

 

  File('E://Flutter/output.pdf').writeAsBytes(document.save());

  document.dispose();

 


void AddParagraphWithHighLight(PdfPage page, String text,

    Map<String, PdfColor> highlightCollection, PdfFont font) {

  SplayTreeMap<int, String> indexAndText = SplayTreeMap<int, String>();

  for (String value in highlightCollection.keys) {

    int start = 0;

    while (text.contains(value, start)) {

      int index = text.indexOf(value, start);

      indexAndText[index] = value;

      start = index + value.length;

    }

  }

  List<String> order = indexAndText.values.toList();

  String tempText = text;

  List<String> textCollection = [];

  for (int i = 0; i < order.length; i++) {

    int index = tempText.indexOf(order[i]);

    if (index != 0) {

      textCollection.add(tempText.substring(0, index));

      tempText = tempText.substring(index, tempText.length);

    }

    textCollection.add(tempText.substring(0, order[i].length));

    tempText = tempText.substring(order[i].length, tempText.length);

    if (i == order.length - 1 && tempText.isNotEmpty) {

      textCollection.add(tempText);

    }

  }

  if (textCollection.isNotEmpty) {

    double indent = 0;

    Rect bounds = Rect.fromLTWH(

        0, 0, page.getClientSize().width, page.getClientSize().height);

    for (int i = 0; i < textCollection.length; i++) {

      PdfColor? pdfColor = highlightCollection[textCollection[i]];

      PdfFont protoType = PdfStandardFont(

          (font as PdfStandardFont).fontFamily, font.size,

          style: pdfColor != null ? PdfFontStyle.underline : font.style);

      PdfTextElement element = PdfTextElement(

          text: textCollection[i],

          brush: PdfSolidBrush(pdfColor ?? PdfColor(0, 0, 0)),

          font: protoType,

          format: PdfStringFormat(

              paragraphIndent: indent, wordWrap: PdfWordWrapType.character));

      PdfLayoutResult? result = element.draw(page: page, bounds: bounds);

      if (i + 1 < textCollection.length) {

        double y = result!.bounds.bottom - protoType.height;

        bounds = Rect.fromLTWH(

            0, y, page.getClientSize().width, page.getClientSize().height);

        String tempString = textCollection[i];

        if (textCollection[i].endsWith(' ')) {

          tempString = tempString.replaceRange(

              tempString.length - 1, tempString.length, '_');

        }

        Size size = protoType.measureString(tempString);

        indent += size.width;

        if (indent > page.getClientSize().width) {

          indent = indent % page.getClientSize().width;

        }

      }

    }

  }

}

 

 


Output : https://www.syncfusion.com/downloads/support/directtrac/general/pd/Htmloutput385005985

Please let us know if you need any further assistance in this.


Regards,

Gowthamraj K


Loader.
Up arrow icon