Back to Devexpress

ITheme Interface

blazor-devexpress-dot-blazor-bee45ea6.md

latest2.5 KB
Original Source

ITheme Interface

An interface that defines theme API members (properties and methods).

Namespace : DevExpress.Blazor

Assembly : DevExpress.Blazor.Resources.v25.2.dll

NuGet Package : DevExpress.Blazor.Resources

Declaration

csharp
public interface ITheme

The following members return ITheme objects:

Remarks

The following methods use ITheme as parameter type:

RegisterTheme(ITheme)Registers a DevExpress Blazor theme.SetTheme(ITheme)Applies a theme to an application.

Call the RegisterTheme(ITheme) method in the App.razor file to register a theme in your Blazor application:

razor
<head>
    @*...*@
    @DxResourceManager.RegisterTheme(Themes.Fluent)
</head>

To change an application theme at runtime, inject IThemeChangeService with the [Inject] attribute into a Razor page and call the SetTheme(ITheme) method:

razor
@inject IThemeChangeService ThemeChangeService
@rendermode InteractiveServer

<DxButton Text="Blazing Berry" Click="() => HandleClick(Themes.BlazingBerry)" />
<DxButton Text="Fluent" Click="() => HandleClick(Themes.Fluent)" />
<DxButton Text="Fluent Dark" Click="() => HandleClick(AppThemes.FluentDark)" />

@code {
    void HandleClick(ITheme theme) {
        ThemeChangeService.SetTheme(theme);
        // ...
    }
    public class AppThemes {
        public static ITheme FluentDark = Themes.Fluent.Clone(properties => {
            properties.Name = "FluentDark";
            properties.Mode = ThemeMode.Dark;
        });
        public static List<ITheme> All { get; private set; } = new List<ITheme>() {
            Themes.BlazingBerry,
            Themes.Fluent,
            FluentDark
        };
    }
}

See Also

ITheme Members

DevExpress.Blazor Namespace