Un code-barres représente visuellement les données sous une forme lisible par machine. Habituellement, il contient des données ou des informations sur un produit ou une entreprise, codées sous forme de chiffres et/ou d’un motif de lignes parallèles. Dans ASP.NET MVC, nous pouvons générer différents types de codes à barres tels que Data Matrix, Aztec, Code 128, etc. Dans cet article, nous apprendrons comment générer et afficher une image de code à barres dans l’application ASP.NET MVC. Après avoir suivi les étapes mentionnées, nous aurons notre propre générateur de codes à barres ASP.NET MVC. Alors commençons.
L’article doit couvrir les sujets suivants :
- Fonctionnalités du générateur de codes à barres ASP.NET MVC
- API .NET pour générer et afficher une image de code à barres
- Étapes pour générer et afficher une image de code-barres
- Démo Générateur de code-barres ASP.NET MVC
- Télécharger le code source
Fonctionnalités du générateur de codes à barres ASP.NET MVC
Notre générateur de codes à barres ASP.NET aura les fonctionnalités suivantes.
- Générez les types de symbologies de code-barres suivants :
- Code128
- Code11
- Code39
- QR
- Matrice de données
- EAN13
- EAN8
- ITF14
- PDF417
- Enregistrez l’image de code-barres générée dans les formats suivants :
- PNG
- JPEG
- BMP
- CEM
- SVG
- Prévisualisez l’image de code-barres générée.
- Téléchargez l’image de code-barres générée sur votre disque local.
API .NET pour générer et afficher une image de code à barres dans ASP.NET MVC
Pour générer des images de codes à barres et les afficher dans l’application ASP.NET MVC, nous utiliserons l’API Aspose.BarCode for .NET. Il nous permet de générer et de reconnaître un large éventail de [types de codes à barres] 1D et 2D]1. Veuillez soit télécharger la DLL de l’API ou l’installer à l’aide de NuGet.
PM> Install-Package Aspose.BarCode
Étapes pour générer et afficher une image de code à barres dans ASP.NET MVC
Nous pouvons générer et afficher une image de code-barres dans l’application ASP.NET MVC en suivant les étapes ci-dessous :
- Tout d’abord, créez un nouveau projet et sélectionnez le modèle de projet Application Web ASP.NET (.NET Framework).
- Ensuite, dans la boîte de dialogue Créer une nouvelle application Web ASP.NET, choisissez MVC, puis choisissez de créer.
Sélectionnez MVC
- Ensuite, ouvrez le gestionnaire de packages NuGet et installez le package Aspose.BarCode for .NET.
Installer Aspose.BarCode for .NET
- Ensuite, créez un nouveau dossier “Images” pour enregistrer les images de codes à barres générées.
Créer un dossier Images.
- Maintenant, créez un modèle dans le dossier “Modèles” avec le nom “Code-barres” pour stocker les informations du code-barres.
// Informations de base sur les codes-barres
public class Barcode
{
public string Text { get; set; }
public BarcodeType BarcodeType { get; set; }
public BarCodeImageFormat ImageType { get; set; }
}
- Ajoutez également une énumération pour répertorier les symbologies de code-barres prises en charge. Il peut être ajouté dans une classe distincte sous le dossier “Modèles”, ou nous pouvons l’ajouter dans le fichier de classe Barcode.cs.
// Symbologies des codes-barres
public enum BarcodeType
{
Code128,
Code11,
Code32,
QR,
Datamatrix,
EAN13,
EAN8,
ITF14,
PDF417
}
- De même, ajoutez une énumération pour répertorier les formats d’image pris en charge.
// Formats d'images
public enum ImageType
{
Png,
Jpeg,
Bmp,
Emf,
Svg
}
- Ensuite, ouvrez Views/Home/index.cshtml et remplacez son contenu par le script suivant.
@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>
- Ensuite, ouvrez la classe “HomeController” et ajoutez un nouveau résultat d’action pour gérer la demande de publication.
[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();
}
- Après cela, ajoutez un nouveau résultat d’action pour gérer la demande de téléchargement d’image dans le “HomeController”.
public ActionResult Download(string ImagePath, string ImageName)
{
string contentType = "application/img";
return File(ImagePath, contentType, Path.GetFileName(ImageName));
}
- Enfin, exécutez l’application.
Démo Générateur de code-barres ASP.NET MVC
Voici la démonstration de l’application ASP.NET MVC Barcode Generator que nous venons de créer.
Démo Générateur de code-barres ASP.NET MVC
Télécharger le code source
Vous pouvez télécharger le code source complet de l’application ASP.NET MVC Barcode Generator depuis GitHub.
Obtenez une licence gratuite
Vous pouvez obtenir une licence temporaire gratuite pour essayer la bibliothèque sans limitation d’évaluation.
Conclusion
Dans cet article, nous avons appris à générer et afficher une image de code-barres dans une application ASP.NET MVC. Nous avons également vu comment télécharger l’image de code-barres générée par programmation. En outre, vous pouvez en savoir plus sur l’API Aspose.BarCode for .NET en utilisant la documentation. En cas d’ambiguïté, n’hésitez pas à nous contacter sur le forum.