Generera och visa streckkodsbild i ASP.NET MVC

En streckkod representerar visuellt data i en maskinläsbar form. Vanligtvis innehåller den data eller information om en produkt eller ett företag, kodad i form av siffror och/eller ett mönster av parallella linjer. I ASP.NET MVC kan vi generera olika typer av streckkoder som Data Matrix, Aztec, Code 128, etc. I den här artikeln kommer vi att lära oss hur man dynamiskt genererar och visar streckkodsbilder i ASP .NET MVC-applikationen. Efter att ha följt de nämnda stegen kommer vi att ha vår egen ASP.NET MVC Barcode Generator. Så låt oss börja.

Artikeln ska täcka följande ämnen:

  1. Funktioner i ASP.NET MVC Barcode Generator
  2. C# API för att generera streckkod i ASP.NET MVC
  3. Steg för att generera och visa streckkodsbild
  4. Demo ASP.NET MVC Barcode Generator
  5. Ladda ner ASP.NET MVC Barcode Generator Source Code

Funktioner i ASP.NET MVC Barcode Generator

Vår ASP.NET MVC streckkodsgenerator kommer att ha följande funktioner.

  1. Generera följande typer av streckkodssymboler:
    • Kod128
    • Kod11
    • Kod39
    • QR
    • Datamatris
    • EAN13
    • EAN8
    • ITF14
    • PDF417
  2. Spara den genererade streckkodsbilden i följande format:
    • PNG
    • JPEG
    • BMP
    • EMF
    • SVG
  3. Förhandsgranska den genererade streckkodsbilden.
  4. Ladda ner den genererade streckkodsbilden till din lokala disk.

C# API för att generera streckkod i ASP.NET MVC

För att generera streckkodsbilder och visa dem i ASP.NET MVC-applikationen kommer vi att använda Aspose.BarCode för .NET API. Det låter oss generera och känna igen ett brett utbud av 1D och 2D streckkodstyper. Vänligen antingen ladda ner API:ts DLL eller installera den med NuGet.

PM> Install-Package Aspose.BarCode

Hur man dynamiskt genererar och visar streckkodsbild i ASP.NET MVC

Vi kan generera och visa en streckkodsbild i ASP.NET MVC-applikationen genom att följa stegen nedan:

  • Skapa först ett nytt projekt och välj projektmallen ASP.NET Web Application (.NET Framework).
  • Välj sedan MVC i dialogrutan Skapa en ny ASP.NET-webbapplikation och välj sedan att skapa.
Välj MVC

Välj MVC

Installera Aspose.BarCode för .NET

Installera Aspose.BarCode för .NET

  • Skapa sedan en ny mapp “Bilder” för att spara de genererade streckkodsbilderna.
Skapa mappen Bilder.

Skapa mappen Bilder.

  • Skapa nu en modell i mappen “Models” med namnet “Barcode” för att lagra streckkodsinformationen.
// Grundläggande streckkodsinformation
public class Barcode
{
    public string Text { get; set; }

    public BarcodeType BarcodeType { get; set; }

    public BarCodeImageFormat ImageType { get; set; }
}
  • Lägg också till en uppräkning för att lista de streckkodssymboler som stöds. Det kan läggas till i en separat klass under mappen “Modeller”, eller så kan vi lägga till det i klassfilen Barcode.cs.
// Streckkodssymboler
public enum BarcodeType
{
    Code128,
    Code11,
    Code32,
    QR,
    Datamatrix,
    EAN13,
    EAN8,
    ITF14,
    PDF417
}
  • Lägg på samma sätt till en uppräkning för att lista de bildformat som stöds.
// Bildformat
public enum ImageType
{
    Png,
    Jpeg,
    Bmp,
    Emf,
    Svg
}
  • Öppna sedan Views/Home/index.cshtml och ersätt dess innehåll med följande skript.
@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>
  • Öppna sedan klassen “HomeController” och lägg till ett nytt åtgärdsresultat för att hantera efterfrågan.
[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();
}
  • Lägg sedan till ett nytt åtgärdsresultat för att hantera begäran om bildnedladdning i “HomeController”.
public ActionResult Download(string ImagePath, string ImageName)
{
    string contentType = "application/img";
    return File(ImagePath, contentType, Path.GetFileName(ImageName));
}
  • Slutligen, kör programmet.

Demo ASP.NET MVC streckkodsgenerator

Följande är en demonstration av applikationen ASP.NET MVC Barcode Generator som vi just har skapat.

Demo ASP.NET MVC streckkodsgenerator

Demo ASP.NET MVC streckkodsgenerator

Ladda ner ASP.NET MVC Barcode Generator källkod

Du kan ladda ner hela källkoden för ASP.NET MVC Barcode Generator-applikationen från GitHub.

Skaffa en gratis licens

Du kan få en gratis tillfällig licens för att prova biblioteket utan utvärderingsbegränsningar.

Slutsats

I den här artikeln har vi lärt oss hur man genererar och visar en streckkodsbild i en ASP.NET MVC-applikation. Vi har också sett hur man laddar ner den genererade streckkodsbilden programmatiskt. Dessutom kan du lära dig mer om Aspose.BarCode för .NET API med hjälp av dokumentationen. I händelse av oklarheter, var god kontakta oss på forumet.

Se även