Table with Rounded Corners and Cell Background

Max_Ingentis · June 12, 2012, 3:19am

Hi all,

i put a border to my table and set CornerRadius to 15. After this i added 2 rows with 1 cell per row.

private static void CreatePdf()
        {
            // Instantiate Pdf object
            Aspose.Pdf.Generator.Pdf pdf1 = new Aspose.Pdf.Generator.Pdf();
            //Create the section in the Pdf object
            Aspose.Pdf.Generator.Section sec1 = pdf1.Sections.Add();
            //Instantiate a table object
            Aspose.Pdf.Generator.Table tab1 = new Aspose.Pdf.Generator.Table();
        tab1.FixedHeight = 200;
        <span style="color: green;">//Add the table in paragraphs collection of the desired section</span>
        sec1.Paragraphs.Add(tab1);
        <span style="color: green;">//Set with column widths of the table</span>
        tab1.ColumnWidths = <span style="color: rgb(163, 21, 21);">"200"</span>;
        <span style="color: green;">//create a blank BorderInfo object</span>
        Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">BorderInfo</span> bInfo = <span style="color: blue;">new</span> Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">BorderInfo</span>();
        <span style="color: green;">// create a GraphInfo object without any argument to its constructor</span>
        Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">GraphInfo</span> gInfo = <span style="color: blue;">new</span> Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">GraphInfo</span>();
        <span style="color: green;">// set the corner radius for GraphInfo</span>
        gInfo.CornerRadius = 15F;
        <span style="color: green;">// specify the line color information </span>
        gInfo.Color = <span style="color: blue;">new</span> Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">Color</span>(<span style="color: rgb(163, 21, 21);">"Red"</span>);
        <span style="color: green;">// set the rounded corner table border</span>
        bInfo.Round = gInfo;
        <span style="color: green;">// specify the Corner style for table border as Round</span>
        tab1.CornerStyle = Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">BorderCornerStyle</span>.Round;
        <span style="color: green;">// set the table border information</span>
        tab1.Border = bInfo;
        <span style="color: green;">//Create rows in the table and then cells in the rows</span>

        <span style="color: green;">// Set Default border To Cells</span>
         
        <span style="color: blue;">var</span> row1 = tab1.Rows.Add();
        <span style="color: blue;">var</span> row2 = tab1.Rows.Add();

        row2.Cells.Add(<span style="color: rgb(163, 21, 21);">"Hello World..."</span>);
        row2.Cells[0].BackgroundColor = <span style="color: blue;">new</span> Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">Color</span>(<span style="color: rgb(163, 21, 21);">"Green"</span>);

        <span style="color: green;">// add sample string to paragraphs collection of table cell</span>
        row1.Cells.Add(<span style="color: rgb(163, 21, 21);">"Hello World..."</span>);
        <span style="color: green;">// set the vertical alignment of text as center aligned</span>
        row1.Cells[0].DefaultCellTextInfo.Alignment = Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">AlignmentType</span>.Center;

        row1.Cells[0].BackgroundColor = <span style="color: blue;">new</span> Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">Color</span>(<span style="color: rgb(163, 21, 21);">"Blue"</span>);

        <span style="color: green;">// set the horizontal alignment of text as center aligned </span>
        row1.Cells[0].VerticalAlignment = Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">VerticalAlignmentType</span>.Center;
        <span style="color: green;">//Save the Pdf</span>

        <span style="color: green;">//Dokument ausgeben</span>
        pdf1.Save(<span style="color: rgb(163, 21, 21);">@"C:\temp\test.pdf"</span>);
    }</pre><pre style="background: white; color: black; font-family: Consolas;"> </pre><p>The result is that i get a Table with rounded Corners. But alle Cells have the same Border. Now i tried to put a other Border without CornerRadius to my Cells.        </p><pre style="background: white; color: black; font-family: Consolas;"><pre style="background: white; color: black; font-family: Consolas;">        <span style="color: blue;">private</span> <span style="color: blue;">static</span> <span style="color: blue;">void</span> CreatePdf()
    {
        <span style="color: green;">// Instantiate Pdf object</span>
        Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">Pdf</span> pdf1 = <span style="color: blue;">new</span> Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">Pdf</span>();
        <span style="color: green;">//Create the section in the Pdf object</span>
        Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">Section</span> sec1 = pdf1.Sections.Add();
        <span style="color: green;">//Instantiate a table object</span>
        Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">Table</span> tab1 = <span style="color: blue;">new</span> Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">Table</span>();

        tab1.FixedHeight = 200;
        <span style="color: green;">//Add the table in paragraphs collection of the desired section</span>
        sec1.Paragraphs.Add(tab1);
        <span style="color: green;">//Set with column widths of the table</span>
        tab1.ColumnWidths = <span style="color: rgb(163, 21, 21);">"200"</span>;
        <span style="color: green;">//create a blank BorderInfo object</span>
        Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">BorderInfo</span> bInfo = <span style="color: blue;">new</span> Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">BorderInfo</span>();
        <span style="color: green;">// create a GraphInfo object without any argument to its constructor</span>
        Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">GraphInfo</span> gInfo = <span style="color: blue;">new</span> Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">GraphInfo</span>();
        <span style="color: green;">// set the corner radius for GraphInfo</span>
        gInfo.CornerRadius = 15F;
        <span style="color: green;">// specify the line color information </span>
        gInfo.Color = <span style="color: blue;">new</span> Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">Color</span>(<span style="color: rgb(163, 21, 21);">"Red"</span>);
        <span style="color: green;">// set the rounded corner table border</span>
        bInfo.Round = gInfo;
        <span style="color: green;">// specify the Corner style for table border as Round</span>
        tab1.CornerStyle = Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">BorderCornerStyle</span>.Round;
        <span style="color: green;">// set the table border information</span>
        tab1.Border = bInfo;
        <span style="color: green;">//Create rows in the table and then cells in the rows</span>

        <span style="color: green;">// Set Default border To Cells</span>
        <font style="background-color: rgb(255, 0, 0);" color="#000000">SetCellBorderInfo(tab1);</font>

        <span style="color: blue;">var</span> row1 = tab1.Rows.Add();
        <span style="color: blue;">var</span> row2 = tab1.Rows.Add();

        row2.Cells.Add(<span style="color: rgb(163, 21, 21);">"Hello World..."</span>);
        row2.Cells[0].BackgroundColor = <span style="color: blue;">new</span> Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">Color</span>(<span style="color: rgb(163, 21, 21);">"Green"</span>);

        <span style="color: green;">// add sample string to paragraphs collection of table cell</span>
        row1.Cells.Add(<span style="color: rgb(163, 21, 21);">"Hello World..."</span>);
        <span style="color: green;">// set the vertical alignment of text as center aligned</span>
        row1.Cells[0].DefaultCellTextInfo.Alignment = Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">AlignmentType</span>.Center;

        row1.Cells[0].BackgroundColor = <span style="color: blue;">new</span> Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">Color</span>(<span style="color: rgb(163, 21, 21);">"Blue"</span>);

        <span style="color: green;">// set the horizontal alignment of text as center aligned </span>
        row1.Cells[0].VerticalAlignment = Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">VerticalAlignmentType</span>.Center;
        <span style="color: green;">//Save the Pdf</span>

        <span style="color: green;">//Dokument ausgeben</span>
        pdf1.Save(<span style="color: rgb(163, 21, 21);">@"C:\temp\test.pdf"</span>);
    }

    <span style="color: blue;">private</span> <span style="color: blue;">static</span> <span style="color: blue;">void</span> SetCellBorderInfo(Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">Table</span> table)
    {
        <span style="color: green;">//create a blank BorderInfo object</span>
        Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">BorderInfo</span> bInfo = <span style="color: blue;">new</span> Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">BorderInfo</span>();
        <span style="color: green;">// create a GraphInfo object without any argument to its constructor</span>
        Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">GraphInfo</span> gInfo = <span style="color: blue;">new</span> Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">GraphInfo</span>();
        <span style="color: green;">// set the corner radius for GraphInfo</span>
        gInfo.CornerRadius = 0;
        <span style="color: green;">// specify the line color information </span>
        gInfo.Color = <span style="color: blue;">new</span> Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">Color</span>(<span style="color: rgb(163, 21, 21);">"Red"</span>);
        <span style="color: green;">// set the rounded corner table border</span>
        bInfo.Round = gInfo;
        <span style="color: green;">// specify the Corner style for table border as Round</span>
        table.CornerStyle = Aspose.Pdf.Generator.<span style="color: rgb(43, 145, 175);">BorderCornerStyle</span>.None;
        <span style="color: green;">// set the table border information</span>
        table.DefaultCellBorder = bInfo;
    }</pre><pre style="background: white; color: black; font-family: Consolas;">Now is the result that the cells have no corner Radius. But they are overlaying </pre><pre style="background: white; color: black; font-family: Consolas;">the rounded Corners of the Table. Is there any way to clip the cells to the table?</pre><pre style="background: white; color: black; font-family: Consolas;"> </pre><pre style="background: white; color: black; font-family: Consolas;">Thank you in advance!</pre></pre>

rashid.ali · June 12, 2012, 11:08am

Hi Maxmilian,

Thanks for using our products and sharing the sample source code with us.

I tested the scenario using your sample source code and unable to find any issue in generated PDF documents. The resultant PDF documents are attached for your reference.

Max_Ingentis:

Is there any way to clip the cells to the table?

I am not very clear about your requirement, can you please explain/elaborate to us what you are trying to achieve?

We apologize for your inconvenience.

Thanks & Regards,

Max_Ingentis · June 13, 2012, 1:54am

Hi,

Thank you for your fast answer. I wanted to have a Table where the cells are clipped to the Table. This means that the corners of the table are rounded and the background of the cells dont overlay the rounded corners and fill the available space.

I attached a picture with my issue.

Thanks,

rashid.ali · June 13, 2012, 11:12am

Hi Maxmilian,

Thanks for sharing the details.

I tested the scenario and able to notice the same problem. For rectification, I logged this problem with ID: PDFNEWNET-33798 in our Issue Tracking System. We will further look into the details of this issue and will keep you updated via this forum thread on the status of correction.

We apologize for your inconvenience.

Thanks & Regards,

codewarior · April 11, 2013, 1:21pm

Hi Maximilian,

Thanks for your patience.

In order to generate a correct output where a Table should have rounder corners, I would recommend trying to use the Document Object Model (DOM) approach of the Aspose.Pdf namespace instead of the DOM model of the Aspose.Pdf.Generator namespace. Please take a look at the following code snippet. For your reference, I have also attached the resultant PDF which is generated on my end.

[C#]

Document doc = new Document();
Page page = doc.Pages.Add();
Aspose.Pdf.Table tab1 = new Aspose.Pdf.Table();
 // Instantiate Pdf object

// tab1.FixedHeight = 200;
// Add the table in paragraphs collection of the desired section
page.Paragraphs.Add(tab1);
// Set column widths of the table
tab1.ColumnWidths = "200";
// create a blank BorderInfo object
Aspose.Pdf.BorderInfo bInfo = new Aspose.Pdf.BorderInfo(Aspose.Pdf.BorderSide.All, System.Drawing.Color.Red);
bInfo.RoundedBorderRadius = 15;
// create a GraphInfo object without any argument to its constructor
tab1.CornerStyle = Aspose.Pdf.BorderCornerStyle.Round;
// set the table border information
tab1.Border = bInfo;
// Create rows in the table and then cells in the rows

Aspose.Pdf.Row row1 = tab1.Rows.Add();
Aspose.Pdf.Row row2 = tab1.Rows.Add();

row2.Cells.Add("Hello World...");
row2.Cells[0].BackgroundColor = System.Drawing.Color.Green;
row2.Cells[0].VerticalAlignment = Aspose.Pdf.VerticalAlignment.Top;
row1.FixedRowHeight = 40;
row2.FixedRowHeight = 160;
// add sample string to paragraphs collection of table cell
row1.Cells.Add("Hello World...");
// set the vertical alignment of text as center aligned
row1.Cells[0].Alignment = Aspose.Pdf.HorizontalAlignment.Center;

row1.Cells[0].BackgroundColor = System.Drawing.Color.Blue;

// set the horizontal alignment of text as center aligned
row1.Cells[0].VerticalAlignment = VerticalAlignment.Center;
// Save the Pdf

doc.Save("c:/pdftest/RoundCornerTable.pdf");

aspose.notifier · April 11, 2013, 4:04pm

The issues you have found earlier (filed as PDFNEWNET-33798) have been fixed in Aspose.Pdf for .NET 7.9.0.

This message was posted using Notification2Forum from Downloads module by aspose.notifier.

rollyhernando · March 24, 2015, 9:45am

I'm using the aspose.pdf document constructors. How I set cell background like below:

cellhead1.BackgroundColor = "#3376B2";

codewarior · March 25, 2015, 4:12am

I’m using the aspose.pdf document constructors. How I set cell background like below:
cellhead1.BackgroundColor = “#3376B2”;

Hi Rolly,

Please try using the following code snippet to accomplish your requirement.

For your reference, I have also attached the resultant PDF generated over my end.

C#

// Load source PDF document
Aspose.Pdf.Document doc = new Aspose.Pdf.Document();

// Initialize a new instance of the Table
Aspose.Pdf.Table table = new Aspose.Pdf.Table();

// Set the table border color as LightGray
table.Border = new
Aspose.Pdf.BorderInfo(Aspose.Pdf.BorderSide.All, .5f,
Aspose.Pdf.Color.FromRgb(System.Drawing.Color.LightGray));

// Set the border for table cells
table.DefaultCellBorder =
new Aspose.Pdf.BorderInfo(Aspose.Pdf.BorderSide.All, .5f,
Aspose.Pdf.Color.FromRgb(System.Drawing.Color.LightGray));

// Create a loop to add 10 rows
for (int row_count = 1; row_count < 10; row_count++){
    // Add row to table
    Aspose.Pdf.Row row = table.Rows.Add();

    // Add table cells
    row.Cells.Add("Column (" + row_count + ", 1)");
    row.Cells.Add("Column (" + row_count + ", 2)");
    row.Cells[1].BackgroundColor = Aspose.Pdf.Color.FromRgb(System.Drawing.ColorTranslator.FromHtml("#3376B2"));
    row.Cells.Add("Column (" + row_count + ", 3)");
}

// Add table object to the first page of the input document
doc.Pages.Add(table);

// Save updated document containing table object
doc.Save("c:/pdftest/CellBackGround_test.pdf");

rollyhernando · March 25, 2015, 4:35am

yeah thanks. I did it this way:

cellquoteheader1.BackgroundColor = Aspose.Pdf.Color.FromArgb(51, 118, 178);

But your code is worked too. Is there performance difference between the two?

cellquoteheader1.BackgroundColor = Aspose.Pdf.Color.FromRgb(System.Drawing.ColorTranslator.FromHtml("#3376B2"));cellquoteheader1.BackgroundColor = Aspose.Pdf.Color.FromRgb(System.Drawing.ColorTranslator.FromHtml("#3376B2"));

Please close this thread.

codewarior · March 26, 2015, 3:10am

Hi Rolly,

We are glad to hear that your problem is resolved and you have managed to accomplish your requirement.

There should not be a performance issue when setting background with either approach. However if you notice any problem, please feel free to contact.