This is a migrated thread and some comments may be shown as answers.

placing image on ExportToPdf

7 Answers 109 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Mehreen
Top achievements
Rank 1
Mehreen asked on 11 May 2015, 09:09 PM

I am using a radgrid to display data. I want to place a banner on the pdf file that gets downloaded.

this is my code:

<PageHeader>
<MiddleCell Text="<img src='Images/CME-Transcript-HeaderLong.jpg' />" TextAlign="Center" />

<RightCell TextAlign="Center" />
</PageHeader>

 

this inserts a small image in the center but I need it to be displayed as the same length as my radgrid on the pdf. How do I change the size of this image to make it a banner size?

 

Also, I am displaying some data generated dynamically in the middle of the header. I need to move it below the header but before the radgrid on the pdf. I need to display it in a horizontal line above the grid. How do I go about changing the position of data?

 

headerText += "<br /><span style='font-size:8px;font-family:Segoe UI;'>Report Date: " + DateTime.Now.Date.ToShortDateString() + "</span>" ;
headerText += "<br /><span style='font-size:8px; font-family:Segoe UI;'>" + lblParticipantName.Text + "</span>";
headerText += "<br /><span style='font-size:8px; font-family:Segoe UI;'>SDMS Member #: " + lblNo.Text + "</span>";

RadGrid1.ExportSettings.Pdf.PageHeader.RightCell.Text = headerText;

Thanks,

7 Answers, 1 is accepted

Sort by
0
Kostadin
Telerik team
answered on 14 May 2015, 10:46 AM
Hello Mehreen,

I am afraid that the middle cell or any of the other cells could not be resized. Nevertheless you can occupy the entire space of the cell by resizing the image. For this purpose you have to add a style attribute to the image element.
Regards your second question you can add the text after the image element and you need to use a <br/> tag. Know that you might need to increase the PageTopMargin in order to fit the image and the text on the page.  Please check out the following code snippet which demonstrates both approaches.
string headerMiddleCell = "<img src=\"images/telerik.png\" style=\"width:200px\" /><br/> This text will apear below the image";
protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        RadGrid1.ExportSettings.Pdf.PageTopMargin = 100;
        RadGrid1.ExportSettings.Pdf.PageHeader.MiddleCell.Text = headerMiddleCell;
        RadGrid1.ExportSettings.Pdf.PageHeader.MiddleCell.TextAlign = GridPdfPageHeaderFooterCell.CellTextAlign.Center;
    }
}


Regards,
Kostadin
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
Mehreen
Top achievements
Rank 1
answered on 15 May 2015, 06:44 PM

The image does not display like a banner still. It seems like its ignoring the style width tag. How can I increase the width of the image in the pdf?

 

I have 3 labels and I need them to be displayed directly above the grid but with spacing. i.e. label1 is on the top left side of the grid, label2 is in the middle above the grid and labe3 on the right side above the grid.

Is this possible? When I tried putting your sample code, it just displays my labels in one line side by side.

 

0
Kostadin
Telerik team
answered on 19 May 2015, 08:21 AM
Hi Mehreen,

Note that the image cannot be spread out over the three cells. Basically if you place the image in the middle cell you can occupy the entire space of the cell but you cannot stretch the image over the left and right cells. Nevertheless you can cut the image to three parts and set a part of the image to each cell.
Regards your second question you have to set a text to the three cells by setting MiddleCell.Text, LeftCell.Text, RightCell.Text. This way the text will be shown above the grid.

Regards,
Kostadin
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
Mehreen
Top achievements
Rank 1
answered on 29 May 2015, 07:17 PM

When I cut the image into 3 pieces, I see a gap between them now. I cant get my label to show up. 

I need someone to tell me how I can accomplish putting a banner on the exported pdf and insert 3 labels below the banner but above the grid!

 

 

0
Kostadin
Telerik team
answered on 03 Jun 2015, 08:48 AM
Hello Mehreen,

I am afraid that cutting the image of three parts is the only option to show a banner over the three cells. Otherwise you can display a banner only over one of the cell.
Regards the text you can use the approach from my previous reply to add a text below the image. Note that you might need to increase the PageTopMarging property if the text is not visible above the grid.

Regards,
Kostadin
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
Mehreen
Top achievements
Rank 1
answered on 04 Jun 2015, 05:18 PM

Can you please tell me the dimensions of these cells, left middle and right, if I wanted to make three different images, I need to know their sizes.

Thanks,

0
Kostadin
Telerik team
answered on 09 Jun 2015, 08:56 AM
Hello Mehreen,

Note that the dimensions of the cells are not fixed since the page size might vary. Nevertheless for a standard (default page size) page you can use a 200px for each image. In case you change the width of the page you need to increase/decrease the image size as well.

Regards,
Kostadin
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Tags
Grid
Asked by
Mehreen
Top achievements
Rank 1
Answers by
Kostadin
Telerik team
Mehreen
Top achievements
Rank 1
Share this question
or