如何实现无裁剪图片大小调整？附HTML转图片C#代码

Got it, let's resolve that cropping problem so your HTML content gets converted to an image without any parts getting cut off. The issue with your original code is that you're using a fixed-size Bitmap and a restrictive maxSize—this forces the HTML content to fit within those bounds, leading to cropping when the content is larger.

Here's the step-by-step fix: #

1. First calculate the actual size your HTML content needs to render fully, using HtmlRender.Measure instead of guessing dimensions upfront.
2. Create a Bitmap that matches this exact size so there's no overflow or cropping.
3. Render the HTML to this properly sized Bitmap to capture all content.

Modified Full Code: #

using System.Drawing;
using System.Drawing.Imaging;
using System.IO;
using TheArtOfDev.HtmlRenderer.WinForms; // Ensure this NuGet package is installed

public static void ConvertHtmlToImageNoCropping(string htmlContent)
{
    // Step 1: Calculate the exact size needed for full HTML rendering
    SizeF contentSize = HtmlRender.Measure(htmlContent, new SizeF(float.MaxValue, float.MaxValue));
    
    // Round up to integer pixel dimensions (Bitmaps require whole numbers)
    int outputWidth = (int)Math.Ceiling(contentSize.Width);
    int outputHeight = (int)Math.Ceiling(contentSize.Height);

    // Step 2: Create a Bitmap sized exactly to fit the content
    using (Bitmap fullContentBitmap = new Bitmap(outputWidth, outputHeight))
    using (Graphics graphics = Graphics.FromImage(fullContentBitmap))
    {
        // Optional: Enable high-quality rendering for sharper output
        graphics.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.AntiAlias;
        graphics.TextRenderingHint = System.Drawing.Text.TextRenderingHint.ClearTypeGridFit;

        // Step 3: Render the HTML without size restrictions
        PointF renderOrigin = new PointF(0, 0);
        SizeF renderBounds = new SizeF(outputWidth, outputHeight);
        HtmlRender.Render(graphics, htmlContent, renderOrigin, renderBounds);

        // Save the full-size image (overwrite if it already exists)
        string savePath = @"D:\HtmlToImage_Full.png";
        if (File.Exists(savePath))
        {
            File.Delete(savePath);
        }
        fullContentBitmap.Save(savePath, ImageFormat.Png);
    }

    // Explicit GC collect is rarely needed with 'using' statements, but included if required
    GC.Collect();
}

Key Improvements Explained: #

• HtmlRender.Measure: This method calculates the precise width and height needed to render your entire HTML content. We pass float.MaxValue as the maximum size to ensure it measures the full, uncropped content.
• Dynamic Bitmap sizing: By creating a Bitmap that matches the measured content dimensions, we eliminate any cropping caused by fixed-size constraints.
• using statements: These automatically dispose of Bitmap and Graphics objects, preventing memory leaks and making the code cleaner than manual Dispose() calls.
• Quality settings: The optional rendering tweaks ensure the output image looks crisp and professional.

Quick Notes: #

• Ensure you have the TheArtOfDev.HtmlRenderer.WinForms NuGet package installed (this is the library powering the HtmlRender methods in your original code).
• If you need to scale the final image to a specific size after capturing the full content, add a high-quality resizing step (avoid stretching that distorts the content).

内容的提问来源于stack exchange，提问作者Nirmal