USING IRONBARCODE

Creating a Razor Barcode Generator Web App

Curtis Chau
Curtis Chau
Updated: 2026年5月11日

Razor 条形码生成器是一款实用工具，为开发人员和企业简化了条形码的创建。在 Web 应用程序中集成条形码生成可以增强功能和用户体验，使得生成各种类型的条形码变得简单直观。无论您是在管理库存、跟踪资产，还是简化结账流程，利用 Razor 条形码生成器都可以显著提高效率和准确性。 我们将在本教程中使用 IronBarcode 来创建一个条形码生成器。

IronBarcode 简介

IronBarcode 是一个针对 .NET Core 开发人员的基本工具，提供了一个易于使用的库，用于条形码生成和读取。 它的突出特点在于其简单易用，可轻松集成到您的项目中，仅需极少的代码即可生成或辨别条形码和二维码。 这使得 IronBarcode 成为增强应用程序条形码生成和读取功能的多用途选择，从使用 Razor 页面到桌面和移动应用程序的 Web 应用程序均可使用。 其广泛支持的条形码格式确保其可以满足各种项目需求，包括 .NET MVC、Blazor WebAssembly 应用程序和 Blazor 应用程序的需求，使其成为开发人员的可靠选择。

创建条形码生成器的步骤

步骤 1：创建 ASP.NET Core Web 应用程序（Razor 页面）

在 Visual Studio 中创建带有 Razor 页面的 ASP.NET Core Web 应用程序非常简单。 本指南将帮助您从头开始设置项目：

1.打开 Visual Studio：启动 Visual Studio。 在启动窗口上，选择"创建新项目"以开始设置新 Web 应用程序的过程。 2.选择项目类型：在"创建新项目"窗口中，从项目模板列表中选择"ASP.NET Core Web 应用程序"。 然后，点击"下一步"以继续。

创建一个新的Razor项目

3.配置您的项目：现在系统会提示您配置您的新项目。

  • 输入您的 Web 应用程序的"项目名称"。
  • 选择项目文件将存储在计算机上的合适"位置"。
  • 可选地，调整"解决方案名称"。
  • 点击"下一步"继续。

配置项目名称、解决方案名称和文件路径

4.设置项目详情：在"附加信息"窗口中，请确保：

  • 选择适当版本的 .NET。
  • 确保选中了"配置 HTTPS"。
  • 点击"创建"以开始创建新的 Razor 页面 Web 应用程序。

设置附加信息

步骤 2：安装 IronBarcode 库

要在 Visual Studio 中使用 NuGet 包管理器安装 IronBarcode：

1.访问NuGet包管理器：在解决方案资源管理器窗格中右键单击项目名称。 选择"管理 NuGet 包…"以打开 NuGet 包管理器选项卡。 2.搜索IronBarcode：在"浏览"选项卡中，键入"IronBarcode"以查找该库。 3. 安装IronBarcode：选择"IronBarcode"并点击"安装"。 查看任何依赖项和许可协议，然后接受继续。

通过NuGet包管理器安装IronBarcode

步骤 3：设计界面

通过编辑index.cshtml文件来增强Index页面。应用自定义样式：

<style>
    body {
        font-family: 'Poppins', sans-serif;
    }
    /* More CSS styles omitted for brevity */
</style>
HTML

添加欢迎消息：

<h1 class="text-center mb-4" style="color:#004b9b">Welcome to Barcode Generator</h1>
<div class="svg-container text-center">
    <img src="~/images/logo.svg" class="barcode-logo" alt="Barcode" />
</div>
HTML

结构化主要内容：

<div class="container">
    <div class="row justify-content-center">
        <!-- Form and Image Column will go here -->
    </div>
</div>
HTML

设计输入表单：

包含用于收集用户输入以生成条形码的表单：

<div class="col-md-6 divider col-padding">
    <form method="post" enctype="multipart/form-data">
        <!-- Form elements omitted for brevity -->
        <button type="submit" asp-page-handler="Upload" class="btn btn-primary btn-block">Generate Barcode</button>
    </form>
    <div id="messageContainer">
        <span id="message" style="color:green;">@Html.Raw(Model.Message)</span>
    </div>
</div>
HTML

图像列：

用于显示和下载生成的条形码：

<div class="col-md-6 image-padding">
    <div id="imageContainer">
        <!-- Image and download button elements omitted for brevity -->
    </div>
</div>
HTML

脚本：

添加功能以使用 jQuery 处理输入和下载操作：

@section Scripts {
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
    <script>
        $(document).ready(function () {
            // jQuery code omitted for brevity
        });
    </script>
}
JavaScript

步骤 4：编写功能代码

定义颜色：

在您的index.cshtml文件顶部添加：

using Color = IronSoftware.Drawing.Color;

条形码颜色枚举：

定义条形码可用颜色：

public enum BarcodeColors
{
    AliceBlue,
    AntiqueWhite,
    Aqua,
    Aquamarine,
    Azure,
    Beige,
    Bisque
    // And others...
}

条形码类型枚举：

定义条形码的可用类型：

public enum BarcodeTypes
{
    Aztec,
    Codabar,
    // Other barcode types...
}

助手函数：

将枚举转换为颜色和条形码编码：

private Color EnumToColor(BarcodeColors colorEnum) { /* Conversion logic */ }
private BarcodeWriterEncoding GetBarcodeEncoding(BarcodeTypes barcodeType) { /* Encoding logic */ }

OnPostUpload 函数：

处理条形码生成的表单提交：

public JsonResult OnPostUpload(string barcodeText, string barcodeType, int? maxWidth, int? maxHeight, string barcodeColor)
{
    // Function logic...
}

布局编辑：

编辑\_Layout.cshtml以获得简约设计：

<!DOCTYPE html>
<html lang="en">
<head>
    <!-- Head contents omitted for brevity -->
</head>
<body>
    <div class="container">
        <main role="main" class="pb-3">
            @RenderBody()
        </main>
    </div>
    <!-- Scripts inclusion omitted for brevity -->
</body>
</html>
HTML

运行应用程序

通过按 F5 或 Ctrl + F5 运行您的应用程序。按照屏幕上的说明输入数据，选择条形码类型，设置尺寸，生成条形码。

输出的Web应用程序

结论

此条形码生成器 Web 应用程序提供了一种简单的方法来创建自定义条形码。 您可以输入数据，选择条形码类型，设置尺寸，并选择颜色后生成条形码。 IronBarcode为此应用程序提供支持，您可以通过免费试用，许可证起价为$999。

对于生成二维码图片，可以考虑使用 IronQR。

Curtis Chau
Curtis Chau
技术作家

Curtis Chau 拥有卡尔顿大学的计算机科学学士学位，专注于前端开发，精通 Node.js、TypeScript、JavaScript 和 React。他热衷于打造直观且美观的用户界面，喜欢使用现代框架并创建结构良好、视觉吸引力强的手册。

阅读更多

相关文章