在 ASP.NET MVC 中生成和显示条码图像

条形码以机器可读的形式直观地表示数据。通常,它包含有关产品或公司的数据或信息,以数字和/或平行线图案的形式编码。在 ASP.NET MVC 中,我们可以生成各种类型的条形码,如 Data Matrix、Aztec、Code 128 等。在本文中,我们将学习如何在 ASP.NET MVC 应用程序中生成和显示条形码图像。完成上述步骤后,我们将拥有自己的 ASP.NET MVC 条码生成器。那么让我们开始吧。

文章应涵盖以下主题:

ASP.NET MVC 条码生成器的特点

我们的 ASP.NET 条码生成器将具有以下功能。

  1. 生成以下类型的条码符号:
    • 代码128
    • 代码 11
    • 代码 39
    • 二维码
    • 数据矩阵
    • EAN13
    • EAN8
    • ITF14
    • PDF417
  2. 将生成的条码图像保存为以下格式:
    • PNG
    • JPEG
    • BMP
    • 电磁场
    • SVG
  3. 预览生成的条形码图像。
  4. 将生成的条形码图像下载到本地磁盘。

.NET API 在 ASP.NET MVC 中生成和显示条码图像

为了生成条形码图像并在 ASP.NET MVC 应用程序中显示它们,我们将使用 Aspose.BarCode for .NET API。它使我们能够生成和识别范围广泛的一维和二维条形码类型。请下载 API 的 DLL 或使用 NuGet 安装它。

PM> Install-Package Aspose.BarCode

在 ASP.NET MVC 中生成和显示条码图像的步骤

我们可以按照以下步骤在 ASP.NET MVC 应用程序中生成和显示条形码图像:

  • 首先,创建一个新项目并选择 ASP.NET Web Application (.NET Framework) 项目模板。
Select the project template.
  • 接下来,在创建新的 ASP.NET Web 应用程序对话框中,选择 MVC,然后选择创建。
选择 MVC

选择 MVC

为 .NET 安装 Aspose.BarCode

为 .NET 安装 Aspose.BarCode

  • 接下来,创建一个新文件夹“Images”以保存生成的条形码图像。
创建图像文件夹。

创建图像文件夹。

  • 现在,在“Models”文件夹中创建一个名为“Barcode”的模型来存储条形码信息。
// 条码基本信息
public class Barcode
{
    public string Text { get; set; }

    public BarcodeType BarcodeType { get; set; }

    public BarCodeImageFormat ImageType { get; set; }
}
  • 此外,添加枚举以列出支持的条形码符号。它可以添加到“Models”文件夹下的单独类中,也可以添加到 Barcode.cs 类文件中。
// 条码符号
public enum BarcodeType
{
    Code128,
    Code11,
    Code32,
    QR,
    Datamatrix,
    EAN13,
    EAN8,
    ITF14,
    PDF417
}
  • 同样,添加枚举以列出支持的图像格式。
// 图像格式
public enum ImageType
{
    Png,
    Jpeg,
    Bmp,
    Emf,
    Svg
}
  • 接下来,打开 Views/Home/index.cshtml 并将其内容替换为以下脚本。
@using BarcodeGeneratorMVC.Models

@model Barcode

@{
    ViewBag.Title = "Home Page";
}

<div class="row">
    <div class="col-lg-6">
        <h2>Generate Barcode</h2>
        @using (Html.BeginForm())
        {
            <div class="form-group">
                @Html.Label("Select Barcode Type:", new { @class = "col-md-12 control-label" })
                <div class="col-md-12">
                    @Html.DropDownListFor(model => model.BarcodeType,
         new SelectList(Enum.GetValues(typeof(BarcodeType))),
         "Select Barcode", new { @class = "form-control" })
                </div>
            </div>
            <div class="form-group">
                @Html.Label("Enter Your Text:", new { @class = "col-md-12 control-label" })
                <div class="col-md-12">
                    @Html.EditorFor(m => m.Text, new { @class = "form-control" })
                </div>
            </div>
            <div class="form-group">
                @Html.Label("Select Image Format:", new { @class = "col-md-12 control-label" })
                <div class="col-md-12">
                    @Html.RadioButtonFor(model => model.ImageType, ImageType.Png) @Html.Label("PNG")
                    @Html.RadioButtonFor(model => model.ImageType, ImageType.Jpeg) @Html.Label("JPG")
                    @Html.RadioButtonFor(model => model.ImageType, ImageType.Bmp) @Html.Label("BMP")
                    @Html.RadioButtonFor(model => model.ImageType, ImageType.Emf) @Html.Label("EMF")
                    @Html.RadioButtonFor(model => model.ImageType, ImageType.Svg) @Html.Label("SVG")
                </div>
            </div>
            <div class="form-group">
                <div class="col-md-12">
                    <input type="submit" class="btn btn-default" value="Generate Barcode" />
                </div>
            </div>
        }
    </div>
    <div class="col-lg-6">
        <h2>View Barcode Image</h2>
        @{
            if (!string.IsNullOrEmpty(@ViewBag.ImagePath))
            {
                <div class="form-group">
                    <div class="col-md-12">
                        <img src=@Url.Content(@ViewBag.ImagePath) alt="Barcode Image" />
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-md-12">
                        @Html.ActionLink("Download Image", "Download", "Home", new
                           {                                                     // routeValues
                               ImagePath = @ViewBag.ImagePath,
                               ImageName = @ViewBag.ImageName
                           },
                           null)
                    </div>
                </div>
            }
        }
    </div>
    <hr />
</div>
  • 然后,打开“HomeController”类并添加一个新的动作结果来处理发布请求。
[HttpPost]
public ActionResult Index(Barcode barcode)
{
    string codeText = barcode.Text;
    string imageName = barcode.Text + "." + barcode.ImageType;
    string imagePath = "/Images/" + imageName;
    string imageServerPath = Server.MapPath("~" + imagePath);

    var encodeType = EncodeTypes.Code128;

    switch (barcode.BarcodeType)
    {
        case BarcodeType.Code128:
            encodeType = EncodeTypes.Code128;
            break;

        case BarcodeType.ITF14:
            encodeType = EncodeTypes.ITF14;
            break;

        case BarcodeType.EAN13:
            encodeType = EncodeTypes.EAN13;
            break;

        case BarcodeType.Datamatrix:
            encodeType = EncodeTypes.DataMatrix;
            break;

        case BarcodeType.Code32:
            encodeType = EncodeTypes.Code32;
            break;

        case BarcodeType.Code11:
            encodeType = EncodeTypes.Code11;
            break;

        case BarcodeType.PDF417:
            encodeType = EncodeTypes.Pdf417;
            break;

        case BarcodeType.EAN8:
            encodeType = EncodeTypes.EAN8;
            break;

        case BarcodeType.QR:
            encodeType = EncodeTypes.QR;
            break;
    }

    using (Stream str = new FileStream(imageServerPath, FileMode.Create, FileAccess.Write))
    {
        BarcodeGenerator gen = new BarcodeGenerator(encodeType, codeText);
        gen.Save(str, barcode.ImageType);
    }

    ViewBag.ImagePath = imagePath;
    ViewBag.ImageName = imageName;

    return View();
}
  • 之后,在“HomeController”中添加一个新的 action result 来处理图片下载请求。
public ActionResult Download(string ImagePath, string ImageName)
{
    string contentType = "application/img";
    return File(ImagePath, contentType, Path.GetFileName(ImageName));
}
  • 最后,运行应用程序。

演示 ASP.NET MVC 条码生成器

下面是我们刚刚创建的 ASP.NET MVC Barcode Generator 应用程序的演示。

演示 ASP.NET MVC 条码生成器

演示 ASP.NET MVC 条码生成器

下载源代码

您可以从 GitHub 下载 ASP.NET MVC Barcode Generator 应用程序的完整源代码。

获得免费许可证

您可以 获得免费的临时许可证 试用该库而不受评估限制。

结论

在本文中,我们学习了如何在 ASP.NET MVC 应用程序中生成和显示条形码图像。我们还看到了如何以编程方式下载生成的条形码图像。此外,您可以使用 文档 了解更多关于 Aspose.BarCode for .NET API 的信息。如有任何歧义,请随时在 论坛 上与我们联系。

也可以看看