将图片和文字另存为

时间:2016-10-14 08:57:07

标签: c# html css model-view-controller

我目前正在制作一个MVC项目,用户将收到一个显示在页面上的证书。证书是图像,然后使用文本重叠打印用户名和其他信息的图像,使用css将文本格式化为图像的正确部分。

由于图像和文本在技术上仍然是分开的,因此保存图像不会将文本保存在顶部,因此保存的只是证书的模板而没有文本。

有没有办法将图像和文本保存为一个,就好像文本被按到图像上并且是同一个对象一样?如果是这样,我将很高兴指出正确的方向知道如何做到这一点。保存图像和文本的任何想法或代码都是非常有用的。

感谢。

2 个答案:

答案 0 :(得分:1)

这可以帮助你

private void makeCertificate(string name, string id, string otherDetails) //You can pass any other details as well 
{
    System.Drawing.Image PrePrintedCertificate;
    name = name.ToUpper();

    string PrePrintedCertificateName = "Certificate.jpg"; //Assuming Certificate JPG File is in the bin folder
    using (FileStream stream = new FileStream(PrePrintedCertificateName, FileMode.Open, FileAccess.Read))
    {
        PrePrintedCertificate = System.Drawing.Image.FromStream(stream);
    }

    RectangleF rectf4Name = new RectangleF(655, 460, 535, 90); //rectf for Name
    RectangleF rectf4ID = new RectangleF(655, 560, 400, 40); 
    System.Drawing.Rectangle rect;

    Bitmap picEdit = new Bitmap(PrePrintedCertificate, new System.Drawing.Size(1241, 1756));

    using (Graphics g = Graphics.FromImage(picEdit))
    {
        //g.DrawRectangle(new System.Drawing.Pen(System.Drawing.Color.Red, 2), 662, 530, 90, 40);
        //I have used upper line to see where is my RectangleF creating on the image
        g.SmoothingMode = SmoothingMode.AntiAlias;
        g.InterpolationMode = InterpolationMode.HighQualityBicubic;
        g.PixelOffsetMode = PixelOffsetMode.HighQuality;
        StringFormat sf = new StringFormat();
        sf.Alignment = StringAlignment.Center;
        StringFormat sf1 = new StringFormat();
        sf1.Alignment = StringAlignment.Near;

        //g.DrawImage(codeImage, rect); //If you wanted to draw another image on the certificate image
        g.DrawString(name, new System.Drawing.Font("Thaoma", 26, System.Drawing.FontStyle.Bold), System.Drawing.Brushes.Black, rectf4Name, sf);
        g.DrawString(Track.Text, new System.Drawing.Font("Thaoma", 14, System.Drawing.FontStyle.Bold), System.Drawing.Brushes.Black, rectf4ID, sf1);
    }
    try
    {
        if (File.Exists(id + ".jpg"))
            File.Delete(id + ".jpg");

        picEdit.Save(id + ".jpg", ImageFormat.Jpeg);
        picEdit.Dispose();
    }
    catch (Exception e)
    {
        MessageBox.Show(e.Message);
    }
}

此处需要注意的是,此图片是具有纵向方向的A4尺寸纸张图像。您可能需要将Bitmap picEdit = new Bitmap(PrePrintedCertificate, new System.Drawing.Size(1241, 1756));更改为Bitmap picEdit = new Bitmap(PrePrintedCertificate, new System.Drawing.Size(1756,1241));

另一件事是名字和其他细节已经随机出现在图像上,但你可以看到你想要打印细节的确切位置。

您可以使用g.DrawRectangle(new System.Drawing.Pen(System.Drawing.Color.Red, 2), 662, 530, 90, 40);查看打印位置。您将在此处传递的参数与RectangleF参数相同。

答案 1 :(得分:0)

将图形另存为SVG并使用文本对象添加文本。

您还可以在SVG中使用CSS来设置文本样式。

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    <text x="20" y="40">Example SVG text 1</text>
</svg>