MAUI Blazor Hybrid Radzen 적용 - 어제와 내일의 나 그 사이의 이야기

https://www.radzen.com/blazor-studio/documentation/maui

2025/01/23
net9.0
Radzen v5.7.10

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover" />
    <title>MauiBlazor</title>
    <base href="/" />

    <link rel="stylesheet" href="css/bootstrap/bootstrap.min.css" />
    <!-- Radzen Head Start [Before css/app.css] -->
    <link rel="stylesheet" href="_content/Radzen.Blazor/css/material-base.css" />
    <!-- Radzen Head End -->
    <link rel="stylesheet" href="css/app.css" />

    <link rel="stylesheet" href="MauiBlazor.styles.css" />
    <link rel="icon" href="data:,">



</head>

<body>

    <div class="status-bar-safe-area"></div>

    <div id="app">Loading...</div>

    <div id="blazor-error-ui">
        An unhandled error has occurred.
        <a href="" class="reload">Reload</a>
        <a class="dismiss">🗙</a>
    </div>

    <script src="_framework/blazor.webview.js" autostart="false"></script>
    <!-- Radzen JS Start [After webview.js] -->
    <script src="_content/Radzen.Blazor/Radzen.Blazor.js"></script>
    <!-- Radzen JS End -->

</body>

</html>

MainLayout.razor

@inherits LayoutComponentBase

<!-- Radzen Start [ before div class="page"] -->
<RadzenComponents />
<!-- Radzen End -->

<div class="page">

    <div class="sidebar">
        <NavMenu />
    </div>

    <main>
        <div class="top-row px-4">
            <a href="https://learn.microsoft.com/aspnet/core/" target="_blank">About</a>
        </div>

        <article class="content px-4">
            @Body
        </article>
    </main>

</div>

_Imports.razor

@using System.Net.Http
@using System.Net.Http.Json
@using Microsoft.AspNetCore.Components.Forms
@using Microsoft.AspNetCore.Components.Routing
@using Microsoft.AspNetCore.Components.Web
@using Microsoft.AspNetCore.Components.Web.Virtualization
@using Microsoft.JSInterop
@using MauiBlazor
@using MauiBlazor.Components

@* Radzen Import Start *@
@using Radzen
@using Radzen.Blazor
@* Radzen Import End *@

MauiProgram.cs

using Microsoft.Extensions.Logging;
using Radzen;

namespace MauiBlazor
{
    public static class MauiProgram
    {
        public static MauiApp CreateMauiApp()
        {
            var builder = MauiApp.CreateBuilder();
            builder
                .UseMauiApp<App>()
                .ConfigureFonts(fonts =>
                {
                    fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
                });
            builder.Services.AddMauiBlazorWebView();

            // Radzen Builder Start After [AddMauiBlazorWebView]
            builder.Services.AddRadzenComponents();
            // Radzen Builder End

#if DEBUG
            builder.Services.AddBlazorWebViewDeveloperTools();
    		builder.Logging.AddDebug();
#endif

            return builder.Build();
        }
    }
}

Home.razor

@inject NotificationService NotificationService
@page "/"

<h1>Hello, world!</h1>

Welcome to your new app.

<RadzenButton Click=@(args => ButtonClicked()) Text=@ButtonName ButtonStyle="ButtonStyle.Primary" />

@code {

    private int currentCount = 0;
    public string ButtonName => $"Click {currentCount.ToString()}";

    void ButtonClicked()
    {
        currentCount++;
    }
}

댓글 달기 댓글 취소

관련 게시물