MudTheme自定义颜色后按钮Hover仍显示默认深色变体的问题

自定义主题代码 #

public static MudTheme CustomTheme = new MudTheme()
{
    Palette = new Palette()
    {
        Primary = "#001478",
        Secondary = "#00B0F0",
        Error = "#F44336",
        Success = "#4CAF50",
        Warning = " #FF1493",
        Info = "#2196F3",
        BackgroundGrey = "BEBEBE",
        GrayDarker = "#00000099"
    },
    LayoutProperties = new LayoutProperties()
    {
        DrawerWidthLeft = "260px",
        DrawerWidthRight = "300px"
    }
};

动态修改颜色方法 #

private void SetThemeColor(string colorConfName, string colorValue)
{
    switch (colorConfName)
    {
        case "mudtheme.palette.primary":
            CustomTheme.Palette.Primary = colorValue;
            break;
        case "mudtheme.palette.secondary":
            CustomTheme.Palette.Secondary = colorValue;
            break;
        case "mudtheme.palette.error":
            CustomTheme.Palette.Error = colorValue;
            break;
        case "mudtheme.palette.success":
            CustomTheme.Palette.Success = colorValue;
            break;
        case "mudtheme.palette.warning":
            CustomTheme.Palette.Warning = colorValue;
            break;
        case "mudtheme.palette.info":
            CustomTheme.Palette.Info = colorValue;
            break;
    }
}

问题描述 #

我已通过上述代码自定义MudTheme的Palette颜色，基础颜色设置生效，但当鼠标悬停在按钮上时，仍显示默认主题的深色变体。请问是否需要手动设置所有颜色变体，还是MudBlazor支持自动派生交互所需的深浅色版本？

解答 #

MudBlazor不会自动从你设置的基础颜色派生交互状态的颜色变体（比如悬停、激活状态的深浅色版本）。出现默认变体是因为仅设置了Primary这类基础色，对应的PrimaryDarken、PrimaryLighten等变体属性仍使用主题默认值。

要解决这个问题，有两种可行方案：

• 手动设置变体属性：在Palette中显式指定PrimaryDarken、PrimaryLighten等交互状态的颜色值，保持和基础色的色调一致性。
• 生成配套调色板：如果是创建全新主题，可以基于MudBlazor默认调色板修改，或者用本地的颜色生成工具自动生成配套的颜色变体，再将这些变体值填入自定义Palette中。

另外，你当前的SetThemeColor方法只修改了基础颜色，未同步更新对应的变体属性，这也是悬停时显示默认颜色的原因。若要动态修改颜色并同步变体，需要在修改基础色的同时，手动计算或设置对应的变体值。

内容的提问来源于stack exchange，提问作者user27378175