ASP.NET MenuItem 个人样式

问题描述

我希望使用 ASP.NET 菜单控件来浏览我的网站.但是，我要求每个 MenuItem 必须具有不同的样式(不同的颜色，静态和 onHover).如果不创建将从 MenuItem 继承的自定义类，这可能吗?

I'm hoping to use an ASP.NET Menu Control for navigation through my site. However, I've got a requirement that each MenuItem must be styled differently (different colors, both static, and onHover). Without creating a custom class that would inherit from MenuItem, is this possible?

有更好的解决方案吗?

推荐答案

缺少覆盖菜单上的 RenderContents，您的选择非常有限.您需要的大部分内容都是私密且密封的，您将无处可去.

Short of overriding RenderContents on Menu, your options are very limited. Most of what you'd need is private and sealed and you won't get anywhere there.

我的解决方案是使用模板.您可以使用 MenuItem.Value 或 Depth and ItemIndex 来标识每个项目并提供必要的属性.

My solution would be to use templates. You could use MenuItem.Value or Depth and and ItemIndex to identify each item and provide necessary attributes.

在页面中:

<asp:Menu ID="menu" runat="server" DynamicHorizontalOffset="2" StaticSubMenuIndent="10px">
    <Items>
        <asp:MenuItem Text="Item 1" Value="value 1">
            <asp:MenuItem Text="Item 2" Value="value 2">
                <asp:MenuItem Text="Item 3" Value="value 3"></asp:MenuItem>
            </asp:MenuItem>
            <asp:MenuItem Text="Item 4" Value="value 4">
                <asp:MenuItem Text="Item 5" Value="value 5"></asp:MenuItem>
            </asp:MenuItem>
            <asp:MenuItem Text="Item 6" Value="value 6"></asp:MenuItem>
        </asp:MenuItem>
        <asp:MenuItem Text="Item 7" Value="value 7"></asp:MenuItem>
        <asp:MenuItem Text="Item 8" Value="value 8"></asp:MenuItem>
    </Items>
    <StaticItemTemplate>
        <asp:Panel runat="server" ForeColor='<%# GetItemColor(Container) %>'>
            <%# Eval("Text") %> - <%# Eval("Value") %>
        </asp:Panel>
    </StaticItemTemplate>
    <DynamicItemTemplate>
        <asp:Panel ID="Panel1" runat="server" ForeColor='<%# GetItemColor(Container) %>'>
            <%# Eval("Text") %> - <%# Eval("Value") %>
        </asp:Panel>
    </DynamicItemTemplate>
</asp:Menu>

在代码中(不要介意这段代码的愚蠢，只是为了演示原理):

In Code (never mind silliness of this code, it is just to demonstrate the principle):

public Color GetItemColor(MenuItemTemplateContainer container)
{
    MenuItem item = (MenuItem)container.DataItem;

    //identify based value
    if (item.Value == "value 2")
        return Color.Brown;

    //identify based on depth and index
    if (item.Depth == 0)
        switch (container.ItemIndex)
        {
            case 0: return Color.Red;
            case 1: return Color.Blue;
            case 2: return Color.DarkGreen;
            default:
                return Color.Black;
        }
    else
        switch (container.ItemIndex)
        {
            case 0: return Color.Purple;
            case 1: return Color.Aqua;
            case 2: return Color.DarkOrange;
            default:
                return Color.Black;
        }
}

这篇关于ASP.NET MenuItem 个人样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持html5模板网！