ParagraphCollection.addFromHtml Method Is Not Placing the Text within the TextBox

Aspose.Slides Product Family
,
1

Hi Team,

When I try to add a html string to a text box, the string content is getting displayed outside the text box got created.

see the below screenshot

image.png (24.2 KB)

similarly the next textbox underneath it which has html tags.

image.png (28.2 KB)

Please find the code snippet I have used for the same

Presentation pres = new Presentation();
pres.getSlideSize().setSize((float) 960, (float) 540,
        SlideSizeScaleType.DoNotScale);
try {
    // Gets the first slide in the presentation
    ISlide sld = pres.getSlides().get_Item(0);

    createTitleCard(sld);

    createGoBackCard(sld);

    createSummaryCard(sld);

    // Saves the presentation to disk
    pres.save("TextBoxesThroughAspose.pptx", SaveFormat.Pptx);
} finally {
    if (pres != null) pres.dispose();
}

private static void createTitleCard(ISlide sld) {
    // Adds an AutoShape with type set as Rectangle
    IAutoShape textBox = sld.getShapes().addAutoShape(ShapeType.Rectangle, 0, 0, 960, 15);

    textBox.getFillFormat().setFillType(FillType.NoFill);
    textBox.getLineFormat().getFillFormat().setFillType(FillType.NoFill);

    // Accesses the text frame
    ITextFrame tf = textBox.getTextFrame();

    tf.getTextFrameFormat().setAnchoringType(TextAnchorType.Top);
    tf.getParagraphs().get_Item(0).getParagraphFormat().setAlignment(TextAlignment.Left);

    // Creates the Paragraph object for text frame
    IParagraph para = tf.getParagraphs().get_Item(0);

    // Creates a Portion object for paragraph
    IPortion portion = para.getPortions().get_Item(0);

    IParagraphFormat paragraphFormat = para.getParagraphFormat();

    applyFontStyle(paragraphFormat);
    // Sets Text
    portion.setText("Title TextBox");
}

private static void applyFontStyle(IParagraphFormat paragraphFormat) {
    IBasePortionFormat portionFormat = paragraphFormat.getDefaultPortionFormat();

    portionFormat.setFontHeight(10);
    portionFormat.setLatinFont(new FontData("Montserrat"));
    portionFormat.getFillFormat().setFillType(FillType.Solid);
    portionFormat.getFillFormat().getSolidFillColor().setColor(Color.decode("#151921"));
}

private static void createGoBackCard(ISlide sld) {
    // Adds an AutoShape with type set as Rectangle
    IAutoShape textBox = sld.getShapes().addAutoShape(ShapeType.Rectangle, 0, 16, 960, 15);

    textBox.getFillFormat().setFillType(FillType.NoFill);
    textBox.getLineFormat().getFillFormat().setFillType(FillType.NoFill);

    // Accesses the text frame
    ITextFrame tf = textBox.getTextFrame();

    tf.getTextFrameFormat().setAnchoringType(TextAnchorType.Top);
    tf.getParagraphs().get_Item(0).getParagraphFormat().setAlignment(TextAlignment.Left);

    IParagraphCollection paragraphCollection = tf.getParagraphs();
    paragraphCollection.addFromHtml("Go Back");

    IParagraph paragraph = paragraphCollection.get_Item(paragraphCollection.getCount() - 1);

    IParagraphFormat paragraphFormat = paragraph.getParagraphFormat();

    paragraphFormat.getDefaultPortionFormat().getHyperlinkManager()
            .setExternalHyperlinkClick("http://google.com");

    applyFontStyle(paragraphFormat);
}

private static void createSummaryCard(ISlide sld) {
    // Adds an AutoShape with type set as Rectangle
    IAutoShape textBox = sld.getShapes().addAutoShape(ShapeType.Rectangle, 0, 32, 960, 15);

    textBox.getFillFormat().setFillType(FillType.NoFill);
    textBox.getLineFormat().getFillFormat().setFillType(FillType.NoFill);

    // Accesses the text frame
    ITextFrame tf = textBox.getTextFrame();

    tf.getTextFrameFormat().setAnchoringType(TextAnchorType.Top);
    tf.getParagraphs().get_Item(0).getParagraphFormat().setAlignment(TextAlignment.Left);

    IParagraphCollection paragraphCollection = tf.getParagraphs();
    paragraphCollection.addFromHtml("<b>Hi</b> This is <b>Summmmaarrryyy</b>");

    IParagraph paragraph = paragraphCollection.get_Item(paragraphCollection.getCount() - 1);

    IParagraphFormat paragraphFormat = paragraph.getParagraphFormat();

    applyFontStyle(paragraphFormat);
}

But able to achieve the multiple text boxes with hyperlink and bold tags manually without any issues. Only with aspose, the text content coming outside the text box.

image.png (20.0 KB)

Attaching the pptx file created from aspose and manually created pptx file.Aspose-textbox-issue.zip (45.7 KB)

Please help us resolving this issue ASAP.

Thanks,
Thilak

2

@Thilakbabu,
Thank you for contacting support.

When you create a new text frame in a PowerPoint presentation using Aspose.Slides, it does not apply autofit for text by default. You should specify this behavior for the text frame. The following code line shows you how to do this:

tf.getTextFrameFormat().setAutofitType(TextAutofitType.Shape);

Documents: Set the AutofitType Property for TextFrame
API Reference: TextAutofitType

3

Hi @Andrey_Potapov,

Thanks for the reply. I tried adding the setAutoFitType. Now the text content is within the textBox. But the size and position of the textbox is not what I have provided. It takes some bigger text box. Please see the attached image

image.png (36.9 KB)

I need to the box size to be as equal to the first text box which has normal text (without html text). Could you please help me on this ?

Thanks,
Thilak

4

@Thilakbabu,
When you add a new TextBox in a PowerPoint presentation using Aspose.Slides, the text frame already contains one empty paragraph. You can remove this paragraph like this:

tf.getParagraphs().clear();

Documents: Manage Paragraph

5

Hi @Andrey_Potapov,

Should I do this clear() before calling the paragraphCollection.addFromHtml ?

6

Hi @Andrey_Potapov

I tried doing clear() before calling the addFromHtml like below code snippet

private static void createGoBackCard(ISlide sld) {
    // Adds an AutoShape with type set as Rectangle
    IAutoShape textBox = sld.getShapes().addAutoShape(ShapeType.Rectangle, 0, 16, 960, 15);

    textBox.getFillFormat().setFillType(FillType.NoFill);
    textBox.getLineFormat().getFillFormat().setFillType(FillType.NoFill);

    // Accesses the text frame
    ITextFrame tf = textBox.getTextFrame();

    tf.getTextFrameFormat().setAnchoringType(TextAnchorType.Top);
    tf.getParagraphs().get_Item(0).getParagraphFormat().setAlignment(TextAlignment.Left);

    tf.getTextFrameFormat().setAutofitType(TextAutofitType.Shape);

    **tf.getParagraphs().clear();**
    
    **IParagraphCollection paragraphCollection = tf.getParagraphs();**  
    **paragraphCollection.addFromHtml("Go Back");**

    IParagraph paragraph = paragraphCollection.get_Item(paragraphCollection.getCount() - 1);

    IParagraphFormat paragraphFormat = paragraph.getParagraphFormat();

    paragraphFormat.getDefaultPortionFormat().getHyperlinkManager()
            .setExternalHyperlinkClick("http://google.com");

    applyFontStyle(paragraphFormat);
}

And now, the ppt looks good. Thanks @Andrey_Potapov.

Thanks,
Thilak

7

@Thilakbabu,
Yes, you need to remove the empty paragraph before adding new ones. We are glad to know that you solved the problem.