How te remove whitespace below text in table cell?

[Kees]

Hi all,

This is a fragment from my code where I use tables in a RadFlowDocument to list some values. This all works fine for me, except one thing: between the text in a cell en the bottom border of that cell is some white space I can't get rid of. I want the bottom border of the cell to have the same distance to the text in the cell as between the text and the top border (border color set to blue for debugging..)

Tried playing with the row Height, cell padding, etc., but that doesn't change anything.

What am I missing?

  
var doc = new RadFlowDocument();

                    var tableStyle = new Style("TableStyle", StyleType.Table);
                    tableStyle.TableProperties.Borders.LocalValue = new TableBorders(new Border(1, BorderStyle.Single, new ThemableColor(Colors.Blue)));
                    tableStyle.TableProperties.Alignment.LocalValue = Alignment.Left;
                    tableStyle.TableCellProperties.VerticalAlignment.LocalValue = VerticalAlignment.Top;
                    tableStyle.TableCellProperties.Padding.LocalValue = new Padding(0, 0, 0, 0);
                    tableStyle.TableRowProperties.TableCellSpacing.LocalValue = 0;
                    tableStyle.CharacterProperties.FontSize.LocalValue = 12;
                    doc.StyleRepository.Add(tableStyle);

                    var section = new Section(doc)
                    {
                        PageMargins = new Padding(50, 50, 50, 50),
                        PageNumberingSettings =
                        {
                            StartingPageNumber = 1,

                        }
                    };
                    doc.Sections.Add(section);

                    var paragraph = new Paragraph(doc);
                    section.Blocks.Add(paragraph);

                    Table table = new Table(doc, 0, 2)//  0 rows, 2 columns. 
                    {
                        LayoutType = TableLayoutType.FixedWidth,
                        PreferredWidth = new TableWidthUnit(700),
                        StyleId = "TableStyle"
                    };
                    // add 2 rows with 2 cells
                    TableRow row = table.Rows.AddTableRow();
                    TableCell cell = row.Cells.AddTableCell();
                    cell.PreferredWidth = new TableWidthUnit(100);
                    paragraph = cell.Blocks.AddParagraph();
                    paragraph.Inlines.AddRun($"Cell R1C1");

                    cell = row.Cells.AddTableCell();
                    cell.PreferredWidth = new TableWidthUnit(600);
                    paragraph = cell.Blocks.AddParagraph();
                    paragraph.Inlines.AddRun("Cell R1C2");

                    cell = row.Cells.AddTableCell();
                    cell.PreferredWidth = new TableWidthUnit(100);
                    paragraph = cell.Blocks.AddParagraph();
                    paragraph.Inlines.AddRun($"Cell R2C1");

                    cell = row.Cells.AddTableCell();
                    cell.PreferredWidth = new TableWidthUnit(600);
                    paragraph = cell.Blocks.AddParagraph();
                    paragraph.Inlines.AddRun("Cell R2C2");

Kind regards,

Kees Alderliesten

[Vladislav]

Hi Kees,

I built the provided code snippet by adding: "section.Blocks.Add(table);". After that, I have set the table row height like this:

row.Height = new TableRowHeight(HeightType.Exact, Telerik.Windows.Documents.Media.Unit.InchToDip(0.2));

Finally, I have exported the document to *.docx and the result has equal space from the top and bottom of the row:

Am I missing something from the setup? I am looking forward to your reply.

[Kees]

Hi Vladislav,

The Add(table) I forgot to copy/paste.

I'm exporting to PDF, but did tested it now with docx and see the same whitespace.
The only difference between my code above and my real code is that there is a full-width image above the table.
For the sake of brevity, I omitted that.
I will extract my code to a separate test-project and if I can reproduce it there I will post that project here.

Thanks for looking into it!

Kind regards,

Kees Alderliesten

[Vladislav]

Hi Kees,

Initially, I didn't understand that the final result was to be a PDF file. To achieve this you will need to add this line when initializing the table style:

tableStyle.ParagraphProperties.SpacingAfter.LocalValue = 0;

It is needed because if not specified, it is treated as the SpacingAfter is 9pt.

My previous approach was to set the row height like this:

row.Height = new TableRowHeight(HeightType.Exact, Telerik.Windows.Documents.Media.Unit.InchToDip(0.2));

This worked in a Word document (*.docx) because regardless of the size of the content in the table cell, it is cropped if it is bigger than the table row set. But when I tried to export it to a PDF file, it rendered the result that you have experienced. After some further investigation on the reason that is happening, I was able to find the cause. When we pass the row height to the PDF exporter it is correctly saved, but when the table cell tries to render its contents (that includes the paragraph's SpacingAfter and SpacingBefore properties), it measures bigger than the row height. Because we do not have a built-in mechanism for cropping content if it is bigger than the rendering space (when exporting from DOCX), the table row size is overwritten with the bigger value.

So the correct approach is to override the SpacingAfter property of the paragraphs. I am sorry, that I didn't think of it earlier. Please, accept my sincere apology.

I hope that you will find the provided solution viable.

Regards,
Vladislav
Progress Telerik

[Kees]

Hi Vladislav,

Thank you so much, that was exactly what I was looking for!
I realized after your first reaction that I forgot to mention that I was creating a PDF, so excuse the confusion.

I just tried to find the documentation on SpacingAfter by browsing the docs pages but had to use Google to find some info. And that is what I have mentioned earlier (here or in a support ticket), the docs pages are nice but sometimes a bit sparse. I use them a lot for the Blazor components and now for document processing. Sometimes you have to do some reading between the lines and connecting the dots to get a complete picture of how to do something, Instead of a few single/double-line code examples (like on the Getting Started page of PdfProcessing) I would like one example with these snippets combined. That tells so much more. 

I know, one of your colleagues, asked to report on pages that need some extra info, but in the heat to get something working I haven't the time to collect these and afterward I don't remember the pages I was grumbling at :-)

One tip on PdfProcessing: What would really help are some images of the layout system of a page, block, paragraph etc outlining the the structure and adding the property names. A bit like what Edge/Chrome (or some other browser) does when using F12 and checking out the page element, there is an image with the margin, border, and padding. If such an image mentions 'SpacingAfter' it is immediately clear what it does.
I have some previous experience with PDF docs using another library (from Essential Objects), if I didn't have that I would have a hard time finding out where to start.
I've been using your products for years (10+), and enjoy them a lot, but the docs need some TLC here and there :-)

Thanks again!
Kind regards,

Kees Alderliesten

[Vladislav]

Hi Kees,

I have forwarded your feedback to our documentation team. Thank you for the time you took to summarize these recommendations.

Please, do not hesitate to contact us again should you have any other inquiries.