ASPxMenuBase.SubMenuItemStyle Property

Gets the style settings for all submenu items within the current menu control.

Namespace: DevExpress.Web

Assembly: DevExpress.Web.v19.2.dll

Declaration

C#

public virtual MenuItemStyle SubMenuItemStyle { get; }

VB.NET

Public Overridable ReadOnly Property SubMenuItemStyle As MenuItemStyle

Property Value

Type	Description
MenuItemStyle	A MenuItemStyle object that contains the style settings for the menu’s submenu items.

Remarks

The SubMenuItemStyle property provides access to the style settings which define the appearance style of all submenu items within the current menu control.

A specific item style can be applied to a particular menu item’s subitems by using the item’s MenuItem.SubMenuItemStyle property.

The appearance of the client regions of all submenus within the menu control can be customized via the ASPxMenuBase.SubMenuStyle property.

Example

This part of the Tabbed Menu demo illustrates how to customize the ASPxMenu control as a hierachical menu (with popped out submenus) which looks like a set of tabs.

Gradient borders for the menu’s root items (tabs) are drawn by using the RootItemTextTemplate property. The control’s style settings are defined via the ASPxMenuBase.ItemStyle property, ASPxMenuBase.SubMenuStyle property,etc.

ASPX

...
<dxm:ASPxMenu EnableTheming="False" ID="ASPxMenu1" CssClass="TabbedMenu" 
runat="server" AppearAfter="0" DataSourceID="XmlDataSource1" ItemSpacing="0px" 
SeparatorHeight="28px" SeparatorWidth="1px" ShowSubMenuShadow="False" 
BorderBetweenItemAndSubMenu="HideRootOnly" Font-Names="Tahoma" Font-Size="8pt" 
Font-Underline="False" ForeColor="Black" AutoPostBack="True" SyncSelectionMode="None" 
ClientInstanceName="tabbedMenu" AllowSelectItem="True" SelectParentItem="True">
     <ItemStyle CssClass="rootItem" Wrap="False">
         <BackgroundImage ImageUrl="~/Menu/Images/TabbedMenu/RootItemSeparator.gif" 
         Repeat="NoRepeat" HorizontalPosition="right" />
         <Paddings Padding="0px" />
         <HoverStyle CssClass="rootItemHover">
         </HoverStyle>
         <SelectedStyle CssClass="rootItemSelected">
         </SelectedStyle>
     </ItemStyle>
     <Paddings Padding="0px" />
     <Border BorderStyle="None" />
     <RootItemSubMenuOffset X="-1" Y="-2" FirstItemX="-1" FirstItemY="-2" LastItemX="-1"
         LastItemY="-2" />
     <SubMenuStyle GutterWidth="0px" ItemSpacing="0px" BackColor="White" CssClass="menu">
         <Paddings Padding="1px" />
         <Border BorderColor="#919191" BorderStyle="Solid" BorderWidth="1px" />
     </SubMenuStyle>
     <SubMenuItemStyle Wrap="False">
         <HoverStyle BackColor="#EDEDED">
             <Border BorderWidth="0px" />
         </HoverStyle>
         <Paddings Padding="5px" PaddingLeft="7px" PaddingRight="7px" />
     </SubMenuItemStyle>
     <VerticalPopOutImage Height="5px" Url="~/Menu/Images/TabbedMenu/ItemArrow.gif" 
     Width="4px" />
     <ItemSubMenuOffset X="-1" Y="-2" FirstItemY="-3" LastItemY="-2" />
     <LinkStyle Color="Black">
         <Font Underline="False"></Font>
     </LinkStyle>
     <RootItemTextTemplate>
         <div><table cellpadding="0" cellspacing="0" border="0"><tr>
         <th class="WhiteBorderRight">
         <dxe:ASPxLabel ID="lblText" runat="server" EnableTheming="False" Text='<%# Eval("Text") %>' />
         </th></tr></table></div>
     </RootItemTextTemplate>
 </dxm:ASPxMenu>
...