码迷,mamicode.com
首页 > 其他好文 > 详细

随心所欲导出你的 UI 界面到 PDF 文件

时间:2014-05-01 13:03:15      阅读:424      评论:0      收藏:0      [点我收藏+]

标签:style   blog   class   java   tar   javascript   ext   width   strong   color   get   

使用 C1PDF 控件可以导出文件到 PDF 文件,结合 .NET 平台特性你可以在任何客户端生成自定义报表。你可以打印任何 UI 界面,例如 DataGrid 导出到 PDF。 在本篇文章中我们将阐述在 XAML 平台中打印 UI 到 PDF 文件的通用方法。

打印 UI 界面到 PDF 文件,需要首先把 UI 界面导出到图片,然后把图片添加到 PDF 文件中。面让我们来进入实战部分。

导出UI到图片

UI导出到 PDF 文件,最简单明了的方法是把 UI 界面作为图片插入到 PDF 文件中。每个平台都支持把 UI 界面保存为图片的接口。所以我们可以利用这些接口来获取需要的图片。接下来使用 C1PDF 控件,通过几行简单的代码导出到 PDF。

Silverlight 平台下我们使用 WriteableBitmap 类来渲染 UI 到图片。通过 Render 方法即可生成图片。这种方法不仅可以渲染某个控件,同时可以创建整个页面。只需要把根节点赋值给构造函数即可。

// render element to image (Silverlight)
var img = new WriteableBitmap(element, null);

 

WPF 平台下我们可以使用RenderTargetBitmap 类来渲染UI到图片。代码如下:

// render element to image (WPF)
RenderTargetBitmap rtbmp = new RenderTargetBitmap(width, height, 96, 96, PixelFormats.Default);
rtbmp.Render(element);

 

需要注意的是  WinRT 平台,使用的方法相同,但参数不同,代码如下:

// render element to image (WinRT)
var renderTargetBitmap = new RenderTargetBitmap();
await renderTargetBitmap.RenderAsync(element);

 

好了,上面我们介绍了 XAML 平台的导出图片方法,接下来我们就可以把图片插入到 PDF 文件了。

导出 UI 到 PDF 文件(WPF 和 Silverlight)

以下代码创建了 C1PdfDocument 对象,绘制UI元素生成的图片到PDF文件,保存到 PDF 文件。

// get stream to save to
var dlg = new SaveFileDialog();
dlg.DefaultExt = ".pdf";
var dr = dlg.ShowDialog();
if (!dr.HasValue || !dr.Value)
{
    return;
}
  
// create document
var pdf = new C1PdfDocument(PaperKind.Letter);
pdf.Clear();
  
var img = new WriteableBitmap(CreateBitmap(content));
// if Silverlight, use below instead
// var img = new WriteableBitmap(content, null);
  
pdf.DrawImage(img, pdf.PageRectangle, ContentAlignment.TopLeft, Stretch.None);
  
// save document
using (var stream = dlg.OpenFile())
{
    pdf.Save(stream);
}
MessageBox.Show(dlg.SafeFileName + " saved successfully!");

 

生成图片的方法如下:

public BitmapSource CreateBitmap(FrameworkElement element)
{
    int width = (int)Math.Ceiling(element.ActualWidth);
    int height = (int)Math.Ceiling(element.ActualHeight);
  
    width = width == 0 ? 1 : width;
    height = height == 0 ? 1 : height;
  
    // render element to image (WPF)
    RenderTargetBitmap rtbmp = new RenderTargetBitmap(width, height, 96, 96, PixelFormats.Default);
    rtbmp.Render(element);
    return rtbmp;
}

 

导出 UI 到 PDF 文件 (WinRT)

因为它涉及到C1Pdf的代码是相同的,无论你使用何种平台。但由于对WPF和Silverlight 和 WinRT  平台的差异,在其中呈现的图像,并将其保存到用户的计算机上的代码是完全不同的。下面是一些渲染UI内容为PDF格式在Windows Store应用程序(WinRT的XAML)中的代码:

FileSavePicker savePicker = new FileSavePicker();
savePicker.SuggestedStartLocation = PickerLocationId.DocumentsLibrary;
savePicker.FileTypeChoices.Add("PDF (*.pdf)", new List(new string[] { ".pdf" }));
savePicker.DefaultFileExtension = ".pdf";
StorageFile file = await savePicker.PickSaveFileAsync();
if(file != null)
{
    // create document
    var pdf = new C1PdfDocument(PaperKind.Letter);
    pdf.Clear();
  
    // set document info
    var di = pdf.DocumentInfo;
    di.Author = "ComponentOne";
    di.Subject = "C1.Xaml.Pdf demo.";
    di.Title = "Export UI to PDF";
  
    // create a bitmap from the UI element
    var img = await CreateBitmap(panel);
  
    // draw bitmap to PDF
    pdf.DrawImage(img, pdf.PageRectangle, ContentAlignment.TopLeft, Stretch.None);
  
    // save PDF file
    await pdf.SaveAsync(file);
  
    // notify user it‘s saved
    MessageDialog dialog = new MessageDialog("File saved!");
    await dialog.ShowAsync();
}

 

我们准备了三个平台的 Demo 供你体验效果:

 

C1PDF 控件下载链接:

http://www.gcpowertools.com.cn/products/componentone_studio_enterprise.htm

随心所欲导出你的 UI 界面到 PDF 文件,码迷,mamicode.com

随心所欲导出你的 UI 界面到 PDF 文件

标签:style   blog   class   java   tar   javascript   ext   width   strong   color   get   

原文地址:http://www.cnblogs.com/C1SupportTeam/p/export-your-ui-to-pdf.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!