Création d'une visionneuse PDF Telerik Blazor avec IronPDF

Pourquoi combiner Telerik UI avec IronPDF ?

Le visualiseur PDF Telerik Blazor excelle dans l'affichage des PDF grâce à des fonctionnalités telles que la recherche de texte, les commandes de zoom et une barre d'outils personnalisable. Toutefois, lorsque vous devez générer des fichiers PDF de manière dynamique à partir de HTML, d'URL ou de vues Razor, IronPDF fournit le moteur de rendu basé sur Chrome que Telerik UI n'inclut pas dans ses bibliothèques de traitement de documents.

Cette approche hybride vous permet de tirer parti des capacités supérieures de création de PDF d'IronPDF tout en utilisant les composants d'interface utilisateur soignés de Telerik pour l'affichage. Il est particulièrement utile lorsque vous devez moderniser des projets web existants ou créer de nouvelles solutions de fichiers PDF Blazor nécessitant à la fois des fonctionnalités de génération et de visualisation. De plus, sa simplicité en fait un choix évident.

Comment puis-je configurer un projet Blazor avec les deux bibliothèques ?

Configurer les deux bibliothèques dans votre projet Blazor est simple. Commencez par installer les packages nécessaires via NuGet :

Install-Package IronPDF Telerik.UI.for.Blazor

Après l'installation, configurez votre Program.cs pour ajouter les services :

builder.Services.AddTelerikBlazor();
builder.Services.AddSingleton<ChromePdfRenderer>();

builder.Services.AddTelerikBlazor();
builder.Services.AddSingleton<ChromePdfRenderer>();

IRON VB CONVERTER ERROR developers@ironsoftware.com

Cette configuration active à la fois les composants Telerik UI pour Blazor et les capacités de rendu d'IronPDF dans votre application. Les utilisateurs de la suite DevCraft qui connaissent déjà Telerik trouveront cette intégration parfaitement fluide. Le résultat est un système entièrement configuré.

Comment créer des documents PDF avec IronPDF pour l'affichage ?

IronPDF transforme le contenu HTML en fichiers PDF que le visualiseur PDF Telerik peut afficher. Voici comment générer un PDF à partir de HTML et le préparer pour la visualisation :

@page "/generate-pdf"
@inject ChromePdfRenderer Renderer
@code {
    private byte[] pdfData;
    private async Task GeneratePDF()
    {
        // Create PDF from HTML content
        var pdf = await Renderer.RenderHtmlAsPdfAsync(@"
            <h1>Invoice Report</h1>
            <table>
                <tr><td>Item</td><td>Amount</td></tr>
                <tr><td>Service</td><td>$100</td></tr>
            </table>");
        // Convert to byte array for Telerik viewer
        pdfData = pdf.BinaryData;
    }
}

@page "/generate-pdf"
@inject ChromePdfRenderer Renderer
@code {
    private byte[] pdfData;
    private async Task GeneratePDF()
    {
        // Create PDF from HTML content
        var pdf = await Renderer.RenderHtmlAsPdfAsync(@"
            <h1>Invoice Report</h1>
            <table>
                <tr><td>Item</td><td>Amount</td></tr>
                <tr><td>Service</td><td>$100</td></tr>
            </table>");
        // Convert to byte array for Telerik viewer
        pdfData = pdf.BinaryData;
    }
}

IRON VB CONVERTER ERROR developers@ironsoftware.com

Ce code génère un document PDF prêt à être affiché. Le moteur de rendu d'IronPDF garantit un rendu parfait de votre contenu HTML, CSS et même JavaScript, en conservant toute la mise en forme lorsque les utilisateurs le consultent via le composant de visualisation PDF.

La classe ChromePdfRenderer offre de nombreuses options de personnalisation. Vous pouvez définir la taille de la page, les marges, les en-têtes, les pieds de page et même définir un CSS personnalisé pour les supports imprimés ; des fonctionnalités qui complètent parfaitement les capacités d'affichage de Telerik. C'est également ainsi que vous pouvez soumettre des données au moteur de rendu.

Comment puis-je intégrer le composant Blazor de visionneuse PDF de Telerik ?

Une fois votre PDF généré avec IronPDF, son affichage avec la visionneuse PDF Telerik Blazor est simple :

<TelerikPdfViewer Data="@pdfData"
                  Height="600px"
                  Zoom="1.0">
    <PdfViewerToolBar>
        <PdfViewerToolBarPagerTool />
        <PdfViewerToolBarZoomTool />
        <PdfViewerToolBarSearchTool />
        <PdfViewerToolBarDownloadTool />
    </PdfViewerToolBar>
</TelerikPdfViewer>

<TelerikPdfViewer Data="@pdfData"
                  Height="600px"
                  Zoom="1.0">
    <PdfViewerToolBar>
        <PdfViewerToolBarPagerTool />
        <PdfViewerToolBarZoomTool />
        <PdfViewerToolBarSearchTool />
        <PdfViewerToolBarDownloadTool />
    </PdfViewerToolBar>
</TelerikPdfViewer>

IRON VB CONVERTER ERROR developers@ironsoftware.com

Cette configuration de composants fournit les outils essentiels pour interagir avec les fichiers PDF. La barre d'outils comprend des boutons de navigation, des commandes de zoom et une fonction de recherche. Vous pouvez personnaliser les outils affichés en fonction des besoins de votre application. La référence aux données se fait via l'attribut Data , qui fournit la valeur PDF.

L'interface utilisateur Telerik pour Blazor gère automatiquement la compatibilité avec les navigateurs, fonctionnant sur les navigateurs modernes sans plugins. Pour les applications de bureau utilisant .NET MAUI, les deux bibliothèques prennent en charge le déploiement multiplateforme, vous permettant de créer des expériences PDF cohérentes sur les plateformes web et de bureau. Cette fonctionnalité est native au visualiseur.

Comment ces composants fonctionnent-ils ensemble ?

Cette intégration crée un flux de travail puissant où IronPDF prend en charge les tâches complexes de création de PDF tandis que Telerik offre une expérience de visualisation soignée. Voici un exemple complet :

@page "/document-viewer"
@inject ChromePdfRenderer Renderer
<div class="row">
    <div class="col-md-12">
        <TelerikButton OnClick="@LoadDocument">
            Load PDF Document
        </TelerikButton>
        @if (documentData != null)
        {
            <TelerikPdfViewer Data="@documentData"
                            Height="800px">
            </TelerikPdfViewer>
        }
    </div>
</div>
@code {
    private byte[] documentData;
    private async Task LoadDocument()
    {
        // Generate dynamic PDF content
        var html = await GenerateReportHtml();
        var pdf = await Renderer.RenderHtmlAsPdfAsync(html);
        documentData = pdf.BinaryData;
    }
    private async Task<string> GenerateReportHtml()
    {
        // Build your HTML dynamically
        return "<h1>Dynamic Report</h1><p>Report content here</p>";
    }
}

@page "/document-viewer"
@inject ChromePdfRenderer Renderer
<div class="row">
    <div class="col-md-12">
        <TelerikButton OnClick="@LoadDocument">
            Load PDF Document
        </TelerikButton>
        @if (documentData != null)
        {
            <TelerikPdfViewer Data="@documentData"
                            Height="800px">
            </TelerikPdfViewer>
        }
    </div>
</div>
@code {
    private byte[] documentData;
    private async Task LoadDocument()
    {
        // Generate dynamic PDF content
        var html = await GenerateReportHtml();
        var pdf = await Renderer.RenderHtmlAsPdfAsync(html);
        documentData = pdf.BinaryData;
    }
    private async Task<string> GenerateReportHtml()
    {
        // Build your HTML dynamically
        return "<h1>Dynamic Report</h1><p>Report content here</p>";
    }
}

IRON VB CONVERTER ERROR developers@ironsoftware.com

Pourquoi choisir cette approche hybride ?

Bien que Telerik UI pour Blazor offre d'excellentes capacités de visualisation, il n'égale pas la puissance de génération de PDF d'IronPDF. Le moteur d'IronPDF, basé sur Chrome, affiche des mises en page complexes, des formulaires et du contenu stylisé avec lesquels des bibliothèques de traitement de documents plus simples pourraient avoir du mal. En combinant les deux, vous obtenez une génération de PDF de niveau entreprise avec une interface de visualisation professionnelle.

Cette approche offre également une flexibilité aux développeurs qui ont besoin d'explorer différentes options d'affichage. Vous pourriez remplacer le visualiseur Telerik par un affichage iframe plus simple ou développer des composants de visualisation personnalisés tout en conservant les capacités de génération d'IronPDF.

Conclusion

Créer une visionneuse PDF Telerik Blazor avec IronPDF vous offre le meilleur des deux mondes : une génération de PDF performante et une expérience de visualisation soignée. Cette combinaison aide les développeurs à créer des solutions PDF complètes capables de moderniser les projets web existants et de répondre aux exigences des applications modernes.

Que vous développiez des systèmes de gestion de documents, des outils de reporting ou toute application Blazor nécessitant des fonctionnalités PDF, cette intégration offre les fonctionnalités et l'expérience utilisateur requises par vos projets.

Prêt à mettre en œuvre cette solution ? Démarrez votre essai gratuit d'IronPDF pour découvrir comment il améliore vos projets Telerik UI pour Blazor. Pour une utilisation en production, consultez nos options de licence afin de trouver celle qui correspond le mieux à vos besoins.