如何调整文档大小 – 为 PDF、图像等设置页面大小

在当今世界，大多数文档都是 A4 格式，但有时从 HTML 导出的内容却是不同的尺寸。这就导致页面上出现大量空白，或者内容无法在页面上显示！在本文中，我们将讨论如何使用呈现选项来调整文档页面的大小，使其与内容的大小一致，反之亦然。

如何使用 Aspose.HTML 调整文档大小

Aspose.Html.Rendering 名称空间提供了一系列功能强大的工具，如底层选项类、接口、结构和枚举，用于将 HTML、MHTML、EPUB 和 SVG 文档渲染为不同的输出格式，如 PDF、XPS、DOCX 和图像。在将 HTML 文档呈现为输出格式时， PageSize 类提供了一种指定页面宽度、高度和方向的方法。但有时，您可能需要裁剪文档，以创建适合页面内容大小的较小页面尺寸。这意味着外边距、边框或空白空间将被移除。

PageSetup 类提供了一组属性，用于在将 HTML 文档渲染为不同文件格式时管理页面设置。下面我们就来看看一些常用的属性：

• 设置页面设​​置。 通过 AnyPage属性，可以为渲染为 PDF、XPS、DOCX、PNG、JPG 等多页格式的 HTML 文档的任何页面设置页面(大小、页边距、方向等)。
• **调整文档大小以适应内容大小。**使用 PageLayoutOptions 属性，你可以根据内容调整页面大小，反之亦然。该属性是一组控制渲染器行为的位标志。你可以裁剪文档或缩放文档，使其内容与页面大小相匹配。

您可以轻松使用 C# 示例将 HTML 转换为带有自定义页面布局的图像，并将 HTML 转换为 PDF、XPS 和 DOCX。唯一的区别在于指定

• 相应的渲染选项 – ImageRenderingOption、PdfRenderingOption、XpsRenderingOption 或 DocRenderingOption；
• 适当的输出设备 – ImageDevice、PdfDevice、XpsDevice 或 DocDevice。

使用默认渲染选项将 HTML 转换为 PNG

要使用默认渲染选项将 HTML 转换为 PNG，应遵循以下几个步骤：

1. 使用 HTMLDocument() 构造函数之一来初始化一个 “文档 “实例。在下面的示例中，我们将加载本地的 rendering.html 文件。
2. 如果要将 HTML 转换为图像文件格式，请初始化 ImageRenderingOption 类的实例。默认情况下，ImageFormat 为 PNG。此外，注意默认情况下 HorizontalResolution 和 VerticalResolution 属性为 300 dpi。因此，由于源内容的分辨率为 96 dpi，渲染后的图像高度和宽度将被拉伸约 3 倍。
3. 创建 ImageDevice 类的新实例。使用以 options 和输出文件路径 savePath 为参数的 ImageDevice() 构造函数。
4. 使用 RenderTo(device) 方法将 HTML 转换为 PNG，该方法将 device 对象作为参数。

此外，C# 代码片段显示了一个将 HTML 文档转换为图像的示例，没有任何附加选项，即使用默认渲染选项。转换后得到的 A4 PNG 文档有大量空白(见 转换结果示例 (a).

// Render HTML to PDF with default RenderingOptions

// Prepare path to a source HTML file
string documentPath = Path.Combine(DataDir, "rendering.html");

// Prepare path for converted file saving 
string savePath = Path.Combine(OutputDir, "a4.png");

// Create an instance of the HTMLDocument class
using HTMLDocument document = new HTMLDocument(documentPath);

// Initialize an ImageRenderingOptions object with default options
ImageRenderingOptions opt = new ImageRenderingOptions();

// Create an output rendering device and convert HTML
using ImageDevice device = new ImageDevice(opt, savePath);
document.RenderTo(device);

渲染选项

Aspose.Html.Rendering 命名空间的 PageLayoutOptions 枚举指定了与其他 PageSetup 选项一起决定页面大小和布局的标志。这些标记可以根据其说明组合在一起。

Name	Description
FitToContentWidth	This flag specifies that the width of pages is determined by the size of the content itself and not by the set page width. Instead, content width is calculated individually for each page.
UseWidestPage	When combined with FitToContentWidth, it specifies that the width of each page will be the same and equal to the widest content size of all pages.
FitToWidestContentWidth	This flag specifies that the width of each page will be the same and equal to the widest content size among all pages.
FitToContentHeight	This flag specifies that the page height is determined by the content’s size, not by the specified page height. If this flag is set, all document content will be placed on one page.
ScaleToPageWidth	This flag indicates that the document’s content will be scaled to fit the page. It collides with the FitToContentWidth flag, and if both flags are specified, only ScaleToPageWidth will take effect.
ScaleToPageHeight	This flag indicates that the document’s content will be scaled to fit the height of the first page. It collides with the FitToContentHeight flag, and if both flags are specified, only ScaleToPageHeight will take effect. All document content will be placed on a single page only.

将 HTML 转换为 JPG 时调整页面宽度

为了使输出图像的页面宽度与内容宽度相匹配，您需要使用 FitToContentWidth 标志或 FitToWidestContentWidth 标志，这将使生成文档的宽度与最宽页面的宽度相匹配。让我们来看看应该遵循的步骤：

1. 加载 HTML 文件。在示例中， HTMLDocument(documentPath) 构造函数从本地文件系统加载 HTML 文档。
2. 创建 ImageRenderingOption 类的实例。在本例中，我们将 PageLayoutOptions 属性设置为 FitToWidestContentWidth，这意味着输出文档的页面宽度将符合最宽内容页面的宽度。
3. 创建一个 ImageDevice 类的新实例，并将其传递给 RenderTo(device) 方法，以便将 HTML 转换为 JPG。

// Render HTML to image with width fitting in C#

// Prepare path to a source HTML file
string documentPath = Path.Combine(DataDir, "rendering.html");

// Prepare path for converted file saving 
string savePath = Path.Combine(OutputDir, "FitWidth.jpg");

// Create an instance of HTMLDocument class
using HTMLDocument document = new HTMLDocument(documentPath);

// Initialize an ImageRenderingOptions object with custom options. Use the FitToWidestContentWidth flag
ImageRenderingOptions opt = new ImageRenderingOptions(ImageFormat.Jpeg)
{
    PageSetup =
    {
        PageLayoutOptions = PageLayoutOptions.FitToWidestContentWidth
    }
};

// Create an output rendering device and convert HTML
using ImageDevice device = new ImageDevice(opt, savePath);
document.RenderTo(device);

HTML 转换为 JPG 的结果是，JPG 文档的页面宽度与内容宽度一致，但页面高度与 A4 格式的高度一致(见 转换结果图示 (b))。

将 HTML 裁剪为 PNG 渲染结果

要使输出页面大小与源文件中图像的高度相匹配，必须在 PageLayoutOptions 属性中设置 FitToContentHeight 标志。下面的示例显示了两个标志的组合：FitToContentHeight 和FitToContentWidth。

// Fit HTML to content size when rendering to image in C#

// Prepare path to a source HTML file
string documentPath = Path.Combine(DataDir, "rendering.html");

// Prepare path for converted file saving 
string savePath = Path.Combine(OutputDir, "FitPage.png");

// Create an instance of the HTMLDocument class
using HTMLDocument document = new HTMLDocument(documentPath);

// Initialize an ImageRenderingOptions object with custom options. Use FitToContentWidth and FitToContentHeight flags
ImageRenderingOptions opt = new ImageRenderingOptions()
{
    PageSetup =
    {
        PageLayoutOptions = PageLayoutOptions.FitToContentWidth | PageLayoutOptions.FitToContentHeight
    },
    HorizontalResolution=96,
    VerticalResolution=96
};

// Create an output rendering device and convert HTML
using ImageDevice device = new ImageDevice(opt, savePath);
document.RenderTo(device);

根据 HTML 渲染成 JPG 的内容调整页面大小

在下面的示例中， AnyPage 属性将页面大小设置为 20x20 px，当渲染为图像时，该大小不足以适应 HTML 文档的内容。如果使用带有 FitToWidestContentWidth 和 FitToContentHeight 标志的 PageLayoutOptions，页面尺寸就会增大以适应内容。

1. 创建一个 HTMLDocument 实例。在以下示例中，我们将加载本地的 rendering.html 文件。
2. 如果要将 HTML 转换为 JPG 文件格式，请初始化 ImageRenderingOption 类的实例。
   • Specify the ImageFormat as Jpeg.
   • Create a PageSetup object with the PageLayoutOptions property with the FitToWidestContentWidth and FitToContentHeight flags set. This ensures that the output image will fit the width and height of the content without any empty space.
3. 创建 ImageDevice 类的新实例。
4. 使用 RenderTo(device) 方法将 HTML 转换为 JPG，该方法将 device 对象作为参数。

// Render HTML to image with small custom page size

// Prepare path to a source HTML file
string documentPath = Path.Combine(DataDir, "rendering.html");

// Prepare path for converted file saving 
string savePath = Path.Combine(OutputDir, "FitSmallPage.jpg");

// Initialize HTMLDocument
using HTMLDocument document = new HTMLDocument(documentPath);

// Initialize an ImageRenderingOptions object with custom options. Use FitToWidestContentWidth and FitToContentHeight flags
ImageRenderingOptions opt = new ImageRenderingOptions(ImageFormat.Jpeg)
{
    PageSetup =
    {
        PageLayoutOptions = PageLayoutOptions.FitToWidestContentWidth | PageLayoutOptions.FitToContentHeight,
        AnyPage = new Page(new Size(20,20))
    }
};

// Create an output rendering device and convert HTML
using ImageDevice device = new ImageDevice(opt, savePath);
document.RenderTo(device);

尽管将页面大小设置为 20x20 像素，但 FitToWidestContentWidth 和 FitToContentHeight 标志允许我们将生成的 JPG 文档的页面大小与内容大小相匹配(见 转换结果图解 (d))。

在将 HTML 转换为 PNG 的过程中缩放页面大小

与控制页面大小的 FitTo* 标志类似，还有一组 ScaleTo* 标志控制内容大小并允许缩放内容。如果内容大小超出了页面大小，内容会按宽高比缩放，直到宽度和/或高度适合页面为止，具体取决于标志的组合。下面的示例展示了如何设置内容的宽度和高度缩放：

// Scale HTML content to fixed page size

// Prepare path to a source HTML file
string documentPath = Path.Combine(DataDir, "rendering.html");

// Prepare path for converted file saving 
string savePath = Path.Combine(OutputDir, "ScaleSmallPage.png");

// Initialize an HTMLDocument object
using HTMLDocument document = new HTMLDocument(documentPath);

// Initialize an ImageRenderingOptions object and use ScaleToPageWidth and ScaleToPageHeight flags
ImageRenderingOptions opt = new ImageRenderingOptions()
{
    PageSetup =
    {
        PageLayoutOptions = PageLayoutOptions.ScaleToPageWidth | PageLayoutOptions.ScaleToPageHeight,
        AnyPage = new Page(new Size(200,200))
    }
};

// Create an output rendering device and convert HTML
using ImageDevice device = new ImageDevice(opt, savePath);
document.RenderTo(device);

在示例中，PageSetup 的 AnyPage 属性设置了一个新的 Page 对象，其 Size 为 200x200 像素。这就将页面大小设置为 200x200 像素。 然后，我们设置 PageSetup 对象的 PageLayoutOptions 属性，使其包含 ScaleToPageWidth 和 ScaleToPageHeight 标志。这意味着输出文档内容将按比例缩放，以适应页面的宽度和/或高度(请参阅 转换结果示例 (e).)。

裁剪并调整大小后的转换结果图

图中显示了使用 RenderTo() 方法和控制输出文档页面大小的各种渲染选项将 rendering.html 文件转换为 PNG、JPG 和 PDF 格式的结果。

注： rendering.html 文件中的源图像大小为 404x303，分辨率为 96 dpi。

**a)**使用默认渲染选项将 HTML 转换为 PNG 的结果是一个 A4 纸大小的 PNG 文档，上面有大量空白。由于默认分辨率为 300 dpi，A4 页面上的渲染图像在高度和宽度上被拉伸了约 3 倍。

b) HTML 转换为 JPG 的结果是，JPG 文档的页面宽度与内容宽度一致，但页面高度与 A4 格式的高度一致。由于默认分辨率为 300 dpi，A4 页面上呈现的图像在高度和宽度上被拉伸了约 3 倍。

c) 将 HTML 转换为 PNG 的结果，并对输出文档进行裁剪，使页面大小与内容大小相适应。

d) 尽管页面大小被设置为 20x20 px，但使用 FitToWidestContentWidth 和 FitToContentHeight 标志可以得到页面大小与内容大小相匹配的 JPG 文档。

e) 当内容大小大于页面大小时，将 HTML 转换为图像的结果。我们缩小了内容，以适应 200x200 px 的页面大小。

您可以从 GitHub 下载完整的 C# 示例和数据文件。

Aspose.HTML 提供免费的在线 转换器，用于将 HTML、XHTML、MHTML、EPUB、XML 和 Markdown 文件转换为各种流行格式。例如，你可以轻松地将 HTML 转换为 PDF、HTML 转换为 JPG、HTML 转换为 XHTML、SVG 转换为 PDF、MHTML 转换为 PDF、MD 转换为 HTML 等。只需选择文件，选择要转换的格式，就大功告成了。它速度快，完全免费！