Erweitern Sie Ihre App mit den Funktionen des Telerik Blazor PDF Viewers.

Warum sollte man Telerik UI mit IronPDF kombinieren?

Der Telerik Blazor PDF-Viewer zeichnet sich durch seine hervorragende Darstellung von PDFs aus und bietet Funktionen wie Textsuche, Zoomsteuerung und eine anpassbare Symbolleiste. Wenn Sie jedoch PDF-Dateien dynamisch aus HTML, URLs oder Razor Ansichten generieren müssen, bietet IronPDF die Chrome-basierte Rendering-Engine, die Telerik UI nicht in seinen Dokumentenverarbeitungsbibliotheken enthält. Die Chrome-Rendering-Engine von IronPDF gewährleistet pixelgenaue Darstellung bei der Konvertierung von Webinhalten in PDF.

Dieser hybride Ansatz ermöglicht es Ihnen, die überlegenen PDF-Erstellungsfunktionen von IronPDF zu nutzen und gleichzeitig die eleganten UI-Komponenten von Telerik für die Anzeige zu verwenden. Es eignet sich besonders gut für die Modernisierung älterer Webprojekte oder die Erstellung neuer Blazor -PDF-Lösungen, die sowohl Generierungs- als auch Anzeigefunktionen erfordern. Sie können außerdem Kopf- und Fußzeilen hinzufügen , Wasserzeichen einfügen und benutzerdefinierte Ränder für Ihre generierten PDFs festlegen, bevor Sie diese anzeigen.

Wie installiert und richtet man das Projekt ein?

Um beide Bibliotheken in Ihrem Blazor -Projekt einzurichten, müssen Sie die erforderlichen NuGet Pakete installieren. Sie können entweder die Paket-Manager-Konsole oder die .NET -Befehlszeilenschnittstelle verwenden. IronPDF ist auf NuGet verfügbar und funktioniert mit .NET 10 und späteren Versionen. Weitere Informationen finden Sie im IronPDF NuGet-Installationshandbuch.

Install-Package IronPdf
dotnet add package IronPdf

Install-Package IronPdf
dotnet add package IronPdf

Nach der Installation konfigurieren Sie Ihren Program.cs, um Dienste hinzuzufügen:

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

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

Diese Konfiguration aktiviert sowohl die Telerik UI for Blazor-Komponenten als auch die Rendering-Funktionen von IronPDF in Ihrer Anwendung. DevCraft Suite-Benutzer, die bereits mit Telerik vertraut sind, werden diese Integration problemlos finden. Für komplexere Szenarien empfiehlt sich die Verwendung von asynchroner PDF-Generierung oder benutzerdefinierten Protokollierungskonfigurationen.

Wie erstellt man mit IronPDF PDF-Dokumente zur Anzeige?

IronPDF wandelt HTML-Inhalte in PDF-Dateien um, die vom Telerik PDF-Viewer angezeigt werden können. Hier erfahren Sie, wie Sie aus HTML eine PDF-Datei erstellen und diese für die Anzeige vorbereiten. Sie können HTML-Zeichenketten auch in PDF konvertieren oder HTML-Dateien direkt rendern:

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

Imports System.Threading.Tasks
Imports Microsoft.AspNetCore.Components
Imports DinkToPdf

@page "/generate-pdf"
@inject ChromePdfRenderer Renderer

@code
    Private pdfData As Byte()

    Private Async Function GeneratePDF() As Task
        ' Create PDF from HTML content
        Dim 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
    End Function
End Code

Dieser Code generiert ein PDF-Dokument, das zur Anzeige bereit ist. Die Rendering-Engine von IronPDF sorgt dafür, dass Ihre HTML-, CSS- und JavaScript Inhalte perfekt gerendert werden und die gesamte Formatierung erhalten bleibt, wenn Benutzer sie über die PDF-Viewer-Komponente anzeigen. Sie können auch Bilder zu PDFs hinzufügen, Bilder aus Azure Blob Storage einbetten oder Bilder direkt in PDF konvertieren. Erkunden Sie den gesamten Funktionsumfang von IronPDF , um zu verstehen, was alles möglich ist.

Die Klasse ChromePdfRenderer bietet umfangreiche Anpassungsmöglichkeiten. Sie können Seitengröße, Ränder, Kopf- und Fußzeilen festlegen und benutzerdefiniertes CSS für Druckmedien definieren – Funktionen, die die Anzeigemöglichkeiten von Telerik ergänzen. Für fortgeschrittene Szenarien sollten Sie die Steuerung von Seitenumbrüchen, die Konfiguration des Anzeigebereichs oder die Einstellungen für die Basis-URL für das korrekte Laden von Assets untersuchen.

Wie integriert man die PDF Viewer Blazor Komponente von Telerik?

Sobald Sie Ihr PDF mit IronPDF erstellt haben, ist die Anzeige mit dem Telerik Blazor PDF-Viewer unkompliziert:

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

Diese Komponentenkonfiguration bietet wichtige Werkzeuge für die Interaktion mit PDFs. Die Symbolleiste enthält Navigationsschaltflächen, Zoomstufenregler und eine Suchfunktion. Sie können je nach Ihren Anwendungsanforderungen anpassen, welche Werkzeuge angezeigt werden. Das Attribut Data gibt den anzuzeigenden PDF-Wert an. Zur Verbesserung der Funktionalität empfiehlt sich die Implementierung von Textextraktions- oder PDF-Suchfunktionen.

Der Telerik UI for Blazor Viewer kümmert sich automatisch um die Browserkompatibilität und funktioniert ohne Plugins auf allen modernen Browsern. Für Desktop-Anwendungen, die .NET MAUI verwenden, unterstützen beide Bibliotheken die plattformübergreifende Bereitstellung, sodass Sie konsistente PDF-Erlebnisse auf Web- und Desktop-Plattformen schaffen können.

Wie funktionieren diese Komponenten zusammen?

Durch die Integration entsteht ein effizienter Arbeitsablauf, bei dem IronPDF die aufwendige PDF-Erstellung übernimmt, während Telerik für ein optimales Anzeigeerlebnis sorgt. Hier ist ein vollständiges Beispiel, das die Erstellung von PDFs aus HTML mit dynamischem Inhalt demonstriert:

@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 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 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 IsNot Nothing Then
            <TelerikPdfViewer Data="@documentData"
                              Height="800px">
            </TelerikPdfViewer>
        End If
    </div>
</div>
@code
    Private documentData As Byte()
    
    Private Async Function LoadDocument() As Task
        ' Generate dynamic PDF content
        Dim html = Await GenerateReportHtml()
        Dim pdf = Await Renderer.RenderHtmlAsPdfAsync(html)
        documentData = pdf.BinaryData
    End Function

    Private Async Function GenerateReportHtml() As Task(Of String)
        ' Build HTML dynamically
        Return "<h1>Dynamic Report</h1><p>Report content here</p>"
    End Function
End Code

Warum dieser Hybridansatz?

Während Telerik UI für Blazor hervorragende Anzeigefunktionen bietet, kann es in puncto PDF-Generierungsleistung nicht mit IronPDF mithalten. Die Chrome-basierte Engine von IronPDF rendert komplexe Layouts, Formulare und formatierte Inhalte, mit denen einfachere Dokumentenverarbeitungsbibliotheken möglicherweise Schwierigkeiten haben. Durch die Kombination beider erhalten Sie eine Professional PDF-Erstellung und gleichzeitig eine Professional Anzeigeoberfläche.

Dieser Ansatz bietet Entwicklern Flexibilität, die verschiedene Anzeigeoptionen ausprobieren möchten. Sie könnten den Telerik-Viewer durch eine einfachere iFrame-Anzeige ersetzen oder benutzerdefinierte Anzeigekomponenten entwickeln und dabei die Generierungsfunktionen von IronPDF beibehalten. Die Lösung eignet sich gut für einfache HTML-zu-PDF-Konvertierungen bis hin zu komplexen Berichtgenerierungsszenarien. Die IronPDF Homepage bietet eine Übersicht über alle unterstützten Anwendungsfälle.

Was sind die nächsten Schritte für die Umsetzung?

Die Entwicklung eines Telerik Blazor PDF-Viewers mit IronPDF bietet Ihnen das Beste aus beiden Welten: effektive PDF-Generierung und ein erstklassiges Anzeigeerlebnis. Diese Kombination hilft Ihnen beim Aufbau kompletter PDF-Lösungen, mit denen Sie ältere Webprojekte modernisieren und gleichzeitig die Anforderungen moderner Anwendungen erfüllen können. Unabhängig davon, ob die Anwendung unter Windows, Linux oder macOS eingesetzt wird, bieten beide Bibliotheken plattformübergreifende Unterstützung.

Egal ob Sie Dokumentenmanagementsysteme, Reporting-Tools oder eine beliebige Blazor Anwendung mit PDF-Funktionalität entwickeln – diese Integration bietet die Funktionalität und Benutzerfreundlichkeit, die Ihre Projekte erfordern. Von der einfachen Rechnungserstellung bis zur komplexen Berichtsproduktion – die kombinierte Lösung bewältigt unterschiedlichste Anforderungen effektiv.

Sind Sie bereit, diese Lösung umzusetzen? Starten Sie Ihre kostenlose IronPDF Testversion und entdecken Sie, wie es Ihre Telerik UI for Blazor -Projekte verbessert. Für den produktiven Einsatz sollten Sie die IronPDF -Lizenzoptionen prüfen, um die passende Lösung für Ihre Bedürfnisse zu finden.