小Q的博客

  • 首页
  • net编程
    • 产品和框架
    • 开发实例
    • 经验技巧
    • 开源组件
  • wp独立站
  • 自媒体
  • 日记本
  • 工具箱
每个程序员,都应该有一个自己的博客站
  1. 首页
  2. net编程
  3. 经验技巧
  4. 正文

c#中生成图片的另类方法,比gdi方式要简单很多

2022年12月3日 1350点热度 0人点赞 0条评论

一般来说,我们如果想生成一张图片,就会调用GDI方法,画直线、画文字、画矩形等,整体制作下来很繁琐。

//创建Graphics对象
Graphics GPS = this.CreateGraphics();
//创建黑色pen对象
Pen MyPen = new Pen(Color.Black, 2f);
//确定起点和终点
Point pt1 = new Point(70, 20);
Point pt2 = new Point(200, 320);
//使用DrawLine方法绘制直线
GPS.DrawLine(MyPen, pt1, pt2);

 

如果想制作这样一张图片,肯定要费不小功夫。可以剑走偏锋,用另一种方法实现。就是先生成html网页文件,制作完后再生成图片文件。这里只提供一种生成图片的方法,并不能实现所有图片。

生成图片示例

 

制作html网页文件,应该都不难。会简单的html代码即可。下面是我们制作好的html文件,代码很简单,主要包括h2、h3、img和table

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
</head>
<body>
    <center>
        <table border="0" width="800" cellspacing="10">
            <tr>
                <td rowspan="3"><img style="width:150px;height:150px;" src="https://navisoft.oss-cn-hangzhou.aliyuncs.com/tempfile2/matchCover.jpg" /></td>
                <td>2022澳大利亚羽毛球公开赛</td>
                <td rowspan="3"><img style="width:150px;height:100px;" src="D:\NaviSoft\Docs3100\02.需求分析\产品-羽毛球档案-需求\alex.jpg" /></td>
            </tr>
            <tr>
                <td>11月15日-11月20日 悉尼 super300</td>
            </tr>
            <tr>
                <td>11月18日 1/4决赛 赛程</td>
            </tr>
        </table><br />

        <h3>场地 <span style="color:red;">1</span> 北京时间<span style="color:red;">12:00</span>开始</h3>
        <table border="0" width="700" cellspacing="10">
            <tr style="background-color:darkgray"><td>项目</td><td colspan="2">对阵</td><td>排名</td><td>纪录</td></tr>

            <!--第1组-->
            <tr style="background-color:antiquewhite"><td rowspan="2">混双</td><td><img style="width:40px;height:30px;" src="https://navisoft.oss-cn-hangzhou.aliyuncs.com/badminton2/country/china.png" /></td><td>金元昊/郑娜恩</td><td>45</td><td>0</td></tr>
            <tr style="background-color:antiquewhite"><td><img style="width:40px;height:30px;" src="https://navisoft.oss-cn-hangzhou.aliyuncs.com/badminton2/country/chinesetaipei.png" /></td><td>张课琦/李芷秦</td><td>79</td><td>0</td></tr>

            <!--第2组-->
            <tr style="background-color:coral"><td rowspan="2">混双</td><td><img style="width:40px;height:30px;" src="https://navisoft.oss-cn-hangzhou.aliyuncs.com/badminton2/country/china.png" /></td><td>冯彦哲/黄东萍</td><td>2</td><td>1</td></tr>
            <tr style="background-color: coral"><td><img style="width:40px;height:30px;" src="https://navisoft.oss-cn-hangzhou.aliyuncs.com/badminton2/country/indonesia.png" /></td><td>毛拉纳/马瓦哈</td><td>34</td><td>0</td></tr>

            <!--第3组-->
            <tr style="background-color: antiquewhite"><td rowspan="2">女单</td><td><img style="width:40px;height:30px;" src="https://navisoft.oss-cn-hangzhou.aliyuncs.com/badminton2/country/korea.png" /></td><td>安洗莹</td><td>2</td><td>1</td></tr>
            <tr style="background-color: antiquewhite"><td><img style="width:40px;height:30px;" src="https://navisoft.oss-cn-hangzhou.aliyuncs.com/badminton2/country/chinesetaipei.png" /></td><td>白驭珀</td><td>34</td><td>0</td></tr>

            <!--第4组-->
            <tr style="background-color:coral"><td rowspan="2">男双</td><td><img style="width:40px;height:30px;" src="https://navisoft.oss-cn-hangzhou.aliyuncs.com/badminton2/country/china.png" /></td><td>何济霆/周昊东</td><td>28</td><td>0</td></tr>
            <tr style="background-color: coral"><td><img style="width:40px;height:30px;" src="https://navisoft.oss-cn-hangzhou.aliyuncs.com/badminton2/country/china.png" /></td><td>梁伟铿/王昶</td><td>23</td><td>0</td></tr>
        </table><br />
    </center>
</body>
</html>

效果如下图所示,需要美化只要加些样式文件即可

html文件效果图

接下来才是重点,如果把这个html文件转成图片文件,思路还是把html文件加载至WebBrowser控件(也可以加载至微软最新的浏览器控件WebView2),然后在控件的DocumentComplete事件中,调用DrawToBitmap方法即可

/// <summary>
/// 网页地址转为图片服务类
/// </summary>
class WebPageToImageService
{
    //调用示例
    //string urlPath = "http://www.cnblogs.com/xiyang1011/";
    //string filePath = @"C:\Test.jpeg";
    //WebPageToImageUtil imageUtil = new WebPageToImageUtil(urlPath, filePath);
    //Bitmap imageWebPage = imageUtil.Generate();

    private Bitmap m_Bitmap;
    private string m_Url;
    private string m_FileName = string.Empty;

    public WebPageToImageService(string url)
    {
        // Without file 
        m_Url = url;
    }
    public WebPageToImageService(string url, string fileName)
    {
        // With file 
        m_Url = url;
        m_FileName = fileName;
    }

    private void _Generate()
    {
        var browser = new WebBrowser { ScrollBarsEnabled = false };
        browser.Navigate(m_Url);
        browser.DocumentCompleted += WebBrowser_DocumentCompleted;
        while (browser.ReadyState != WebBrowserReadyState.Complete)
        {
            Application.DoEvents();
        }
        browser.Dispose();
    }
    private void WebBrowser_DocumentCompleted(object sender, WebBrowserDocumentCompletedEventArgs e)
    {
        // Capture 
        var browser = (WebBrowser)sender;
        browser.ClientSize = new Size(browser.Document.Body.ScrollRectangle.Width, browser.Document.Body.ScrollRectangle.Bottom);
        browser.ScrollBarsEnabled = false;
        m_Bitmap = new Bitmap(browser.Document.Body.ScrollRectangle.Width, browser.Document.Body.ScrollRectangle.Bottom);
        browser.BringToFront();
        browser.DrawToBitmap(m_Bitmap, browser.Bounds);

        // Save as file? 
        if (m_FileName.Length > 0)
        {
            // Save 
            m_Bitmap.SaveJPG100(m_FileName);
        }
    }

    public Bitmap Generate()
    {
        // Thread 
        var m_thread = new Thread(_Generate);
        m_thread.SetApartmentState(ApartmentState.STA);
        m_thread.Start();
        m_thread.Join();
        return m_Bitmap;
    }
}

 

代码二次封装

public static Image SnippingWebPage(string url, string fileName = null)
{
    WebPageToImageService imService = new WebPageToImageService(url, fileName);
    Bitmap bitmap = imService.Generate();

    return bitmap;
}

 

经过测试,html中包含图片也能一并生成到图片里,图片可以是网络地址,还可以是本地文件。怎么样?这个方法是不是比Gdi要简单很多吧

string htmlFile = @"D:\NaviOther\aliyunoss\badminton2\player2\59673-2022.html";
string imgFile = @"D:\NaviOther\aliyunoss\badminton2\player2\59673-2022.jpg";
ImageUtil.SnippingWebPage(htmlFile, imgFile);

 

相关阅读

net平台中优秀的图形处理组件NetVips,很好很强大

net中c#教程 image图形操作,支持webp和svg格式

标签: gdi html转图片 WebBrowser控件 WebView2控件 生成图片
最后更新:2022年12月3日

小Q

80后中年不油腻大叔,喜欢编写代码、打羽毛球、做木制玩具。目前定居浙江杭州

打赏 点赞
< 上一篇
下一篇 >

文章评论

razz evil exclaim smile redface biggrin eek confused idea lol mad twisted rolleyes wink cool arrow neutral cry mrgreen drooling persevering
取消回复

COPYRIGHT © 2022 小Q的博客. ALL RIGHTS RESERVED.

Theme Kratos Made By Seaton Jiang

浙ICP备2022019157号-2