Mejora la página de Índice editando el archivo index.cshtml. Aplica un estilo personalizado:

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

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

Agregar un mensaje de bienvenida:

<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>

<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>

Estructuración del contenido principal:

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

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

Formulario de entrada de diseño:

Incluye el formulario para recopilar la entrada del usuario para generar códigos de barras:

<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>

<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>

Columna de imagen:

Para mostrar y descargar el código de barras generado:

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

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

Guiones:

Añade funcionalidad para manejar acciones de entrada y descarga usando 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>
}

@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>
}

Definir color:

En la parte superior de tu archivo index.cshtml, añade:

using Color = IronSoftware.Drawing.Color;

using Color = IronSoftware.Drawing.Color;

IRON VB CONVERTER ERROR developers@ironsoftware.com

Enumeración de colores de código de barras:

Define los colores disponibles para códigos de barras:

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

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

Public Enum BarcodeColors
	AliceBlue
	AntiqueWhite
	Aqua
	Aquamarine
	Azure
	Beige
	Bisque
	' And others...
End Enum

Enumeración de tipos de códigos de barras:

Define los tipos disponibles de códigos de barras:

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

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

Public Enum BarcodeTypes
	Aztec
	Codabar
	' Other barcode types...
End Enum

Funciones auxiliares:

Convierte enums a codificación de color y de código de barras:

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

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

Private Function EnumToColor(ByVal colorEnum As BarcodeColors) As Color
End Function
Private Function GetBarcodeEncoding(ByVal barcodeType As BarcodeTypes) As BarcodeWriterEncoding
End Function

Función OnPostUpload:

Maneja el envío del formulario para generar códigos de barras:

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

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

Public Function OnPostUpload(ByVal barcodeText As String, ByVal barcodeType As String, ByVal maxWidth? As Integer, ByVal maxHeight? As Integer, ByVal barcodeColor As String) As JsonResult
	' Function logic...
End Function

Edición de diseño:

Edita _Layout.cshtml para un diseño minimalista:

<!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>

<!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>