<?xml version="1.0" encoding="utf-8"?>
<s:Module xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:flexContextMenu="ardisia.components.flexContextMenu.*"
xmlns:containers="containers.*"
xmlns:data="containers.data.*"
xmlns:separators="ardisia.components.separators.*"
xmlns:colorPicker="ardisia.components.colorPicker.*"
frameRate="60"
width="100%" height="100%"
removedFromStage="removedFromStageHandler(event)">
<fx:Script>
<![CDATA[
public function creationComplete():void
{
cm.setContextMenu(dg);
systemManager.addEventListener(MouseEvent.RIGHT_CLICK, nullHandler);
}
protected function nullHandler(event:Event):void
{
}
protected function removedFromStageHandler(event:Event):void
{
systemManager.removeEventListener(MouseEvent.RIGHT_CLICK, nullHandler);
}
]]>
</fx:Script>
<fx:Declarations>
<fx:Object id="copyIcon" icon="@Embed(source='icons/cross-red.png')" />
<fx:Object id="pasteIcon" icon="@Embed(source='icons/open-iconic-master/home-2x.png')" />
<fx:Object id="deleteIcon" icon="@Embed(source='icons/open-iconic-master/paperclip-2x.png')" />
<flexContextMenu:FlexContextMenu id="cm"
labelField="label" iconField="icon"
minWidth="{menuMinWidthSelect.value}"
variableRowHeight="{menuVariableRowHeightSelect.selected}"
subMenuHorizontalOffset="{subMenuHorizontalOffsetSelect.value}"
subMenuVerticalOffset="{subMenuVerticalOffsetSelect.value}"
textIndent="{textIndentSelect.value}"
rollOverColor="{rollOverColor.selectedColor}"
selectionColor="{selectionColor.selectedColor}"
paddingTop="{menuPaddingTop.value}"
paddingRight="{menuPaddingRight.value}"
paddingBottom="{menuPaddingBottom.value}"
paddingLeft="{menuPaddingLeft.value}"
horizontalGap="{hGapSelect.value}"
dataProvider="{[{label: 'New', children: [
{label: 'File', enabled: false},
{label: 'Folder'},
{label: 'Project'},
{type: 'separator'},
{label: 'Other'},
]},
{label: 'Go Into', enabled: false},
{type: 'separator'},
{label: 'Nested Menu Top', children: [
{label: 'Nested Menu Item A', enabled: false},
{label: 'Nested Menu Item B'},
{label: 'Nested Menu Item C', children: [
{label: 'Sub Nested Menu Item A'},
{label: 'Sub Nested Menu Item B'},
{label: 'Sub Nested Menu Item C'},
{label: 'Sub Nested Menu Item D'}
]},
{type: 'separator'},
{label: 'Nested Menu Item D'}
]},
{type: 'separator'},
{label: 'Copy', icon: copyIcon.icon},
{label: 'Paste', icon: pasteIcon.icon},
{label: 'Delete', icon: deleteIcon.icon},
{label: 'Move'},
{label: 'Rename'},
{type: 'separator'},
{label: 'Import', type: 'radio', groupName: 'g1', toggled: true},
{label: 'Export', type: 'radio', groupName: 'g1'},
{type: 'separator'},
{label: 'Refresh', type: 'check', toggled: true},
{type: 'separator'},
{label: 'Properties', enabled: false}
]}">
</flexContextMenu:FlexContextMenu>
</fx:Declarations>
<s:states>
<s:State name="stockholm" />
<s:State name="london" />
<s:State name="spark" />
</s:states>
<containers:DemoApplicationWrapper id="demoAppWrapper"
width="100%" height="100%"
westRegionTitle="FlexContextMenu Description"
description="ContextMenu that can be applied via right-click to any UIComponent or across the entire application. Designed to be customizable and easy to implement. Simply supply a reference to the ContextMenu to the 'flexContextMenu' property of any visual element that extends UIComponent. Although the Flex SDK has a ContextMenu class, it has serious limitations: no nested menus, no icons, max 15 items, 100 chars or less, and many reserved words. The FlexContextMenu solves those problems and makes customization much easier, including extra flexibility regarding implementation, checkmarks, radio buttons, icons, sub-menus, and more."
currentState.stockholm="stockholm" currentState.london="london" currentState.spark="spark">
<containers:expandingContainerContent>
<!--- expanding container #1 -->
<data:ExpandingContainerData>
<data:label>Shared Styling</data:label>
<data:content>
<s:FormItem label="Min Width:">
<s:HSlider id="menuMinWidthSelect"
value="190" minimum="0" maximum="400"/>
<s:helpContent>
<s:Image source="@Embed(source='icons/question.png')"
toolTip="The min width of the context menu. Does not apply to sub menus."/>
</s:helpContent>
</s:FormItem>
<s:FormItem label="Variable Height:">
<s:CheckBox id="menuVariableRowHeightSelect"
selected="true"/>
<s:helpContent>
<s:Image source="@Embed(source='icons/question.png')"
toolTip="Set whether menu row height is variable or fixed."/>
</s:helpContent>
</s:FormItem>
<s:FormItem label="Sub V Offset:">
<s:HSlider id="subMenuVerticalOffsetSelect"
value="-5"
minimum="-10" maximum="100"/>
<s:helpContent>
<s:Image source="@Embed(source='icons/question.png')"
toolTip="Vertical offset to apply to the sub menus' default positions when displayed."/>
</s:helpContent>
</s:FormItem>
<s:FormItem label="Sub H Offset:">
<s:HSlider id="subMenuHorizontalOffsetSelect"
value="2"
minimum="-10" maximum="100"/>
<s:helpContent>
<s:Image source="@Embed(source='icons/question.png')"
toolTip="Horizontal offset to apply to the sub menus' default positions when displayed."/>
</s:helpContent>
</s:FormItem>
<s:FormItem label="Text Indent:">
<s:HSlider id="textIndentSelect"
minimum="-10" maximum="20" value="0"/>
</s:FormItem>
<s:FormItem label="Roll Over Color:">
<colorPicker:ColorPicker id="rollOverColor"
selectedColor="{getStyle('rollOverColor')}"/>
</s:FormItem>
<s:FormItem label="Selection Color:">
<colorPicker:ColorPicker id="selectionColor"
selectedColor="{getStyle('selectionColor')}"/>
</s:FormItem>
<separators:HSeparator width="100%"
paddingTop="5" paddingBottom="5"/>
<s:FormHeading label="Menu Item Padding"/>
<s:FormItem label="Top:">
<s:HSlider id="menuPaddingTop"
value="2" minimum="-10" maximum="30"/>
<s:helpContent>
<s:Image source="@Embed(source='icons/question.png')"
toolTip="Top padding for the drop down menu items."/>
</s:helpContent>
</s:FormItem>
<s:FormItem label="Right:">
<s:HSlider id="menuPaddingRight"
value="5" minimum="-10" maximum="30"/>
<s:helpContent>
<s:Image source="@Embed(source='icons/question.png')"
toolTip="Right padding for the drop down menu items."/>
</s:helpContent>
</s:FormItem>
<s:FormItem label="Bottom:">
<s:HSlider id="menuPaddingBottom"
value="2" minimum="-10" maximum="30"/>
<s:helpContent>
<s:Image source="@Embed(source='icons/question.png')"
toolTip="Bottom padding for the drop down menu items."/>
</s:helpContent>
</s:FormItem>
<s:FormItem label="Left:">
<s:HSlider id="menuPaddingLeft"
value="5" minimum="-10" maximum="30"/>
<s:helpContent>
<s:Image source="@Embed(source='icons/question.png')"
toolTip="Left padding for the drop down menu items."/>
</s:helpContent>
</s:FormItem>
<separators:HSeparator width="100%"
paddingTop="5" paddingBottom="5"/>
<s:FormHeading label="Icons"/>
<s:FormItem label="Horizontal Gap">
<s:HSlider id="hGapSelect"
minimum="0" maximum="20" value="6"/>
<s:helpContent>
<s:Image source="@Embed(source='icons/question.png')"
toolTip="Gap between icons/UI controls and text."/>
</s:helpContent>
</s:FormItem>
</data:content>
</data:ExpandingContainerData>
</containers:expandingContainerContent>
<containers:centerContent>
<!--- example #1 -->
<data:PrimaryContentData>
<data:tabLabel>Data Binding Example</data:tabLabel>
<data:exampleDescription>Flex Context Menu set in MXML via data binding.</data:exampleDescription>
<data:primaryContent>
<s:VGroup horizontalCenter="0" verticalCenter="0"
gap="20">
<s:Label text="Right click the Tree below to display a ContextMenu set via data binding." />
<s:HGroup gap="20">
<mx:Tree width="160" height="300"
flexContextMenu="{cm}"
labelField="@label"
showRoot="true">
<mx:XMLListCollection>
<fx:XMLList>
<folder label="Folder A">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder B">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder C">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder D">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder E">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder F">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder G">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder H">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder I">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder J">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder K">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder L">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder M">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder N">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder O">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder P">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder Q">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder R">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder S">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder T">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder U">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder V">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder W">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder X">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder Y">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
<folder label="Folder Z">
<folder label="File 1" />
<folder label="File 2" />
<folder label="File 3" />
<folder label="File 4" />
</folder>
</fx:XMLList>
</mx:XMLListCollection>
</mx:Tree>
<s:RichText>
<s:content>
<s:p fontWeight="bold">Implementation MXML Code:</s:p>
<s:p paddingTop="11"><sampleApp:FlexContextMenu id="cm" /><s:br/><s:Tree flexContextMenu=\{cm\} /><s:br/>
</s:p>
</s:content>
</s:RichText>
</s:HGroup>
</s:VGroup>
</data:primaryContent>
</data:PrimaryContentData>
<!--- example #2 -->
<data:PrimaryContentData>
<data:tabLabel>Inline Example</data:tabLabel>
<data:exampleDescription>Flex ContextMenu set inline via MXML.</data:exampleDescription>
<data:primaryContent>
<s:VGroup horizontalCenter="0" verticalCenter="0"
gap="20">
<s:Label text="Right click the Image below to display a ContextMenu set inline in MXML." />
<s:HGroup gap="20">
<s:Image source="@Embed(source='images/laika-grass.jpg')">
<s:flexContextMenu>
<flexContextMenu:FlexContextMenu minWidth="{menuMinWidthSelect.value}"
variableRowHeight="{menuVariableRowHeightSelect.selected}"
subMenuHorizontalOffset="{subMenuHorizontalOffsetSelect.value}"
subMenuVerticalOffset="{subMenuVerticalOffsetSelect.value}"
textIndent="{textIndentSelect.value}"
rollOverColor="{rollOverColor.selectedColor}"
selectionColor="{selectionColor.selectedColor}"
paddingTop="{menuPaddingTop.value}"
paddingRight="{menuPaddingRight.value}"
paddingBottom="{menuPaddingBottom.value}"
paddingLeft="{menuPaddingLeft.value}"
horizontalGap="{hGapSelect.value}">
<flexContextMenu:dataProvider>
<s:ArrayCollection>
<fx:Object label="New"/>
<fx:Object type="separator"/>
<fx:Object label="Copy"/>
<fx:Object label="Paste"/>
<fx:Object label="Delete" enabled="false"/>
<fx:Object type="separator"/>
<fx:Object type="radio" label="Radio A" toggled="true"/>
<fx:Object type="radio" label="Radio B"/>
<fx:Object type="separator"/>
<fx:Object type="check" label="Check" toggled="true"/>
</s:ArrayCollection>
</flexContextMenu:dataProvider>
</flexContextMenu:FlexContextMenu>
</s:flexContextMenu>
</s:Image>
<s:RichText tabStops="20 40 60 80 100">
<s:content>
<s:p fontWeight="bold">Implementation MXML Code:</s:p>
<s:p paddingTop="11"><s:Image source="@Embed(source='images/laika-grass.jpg')"></s:p>
<s:p><s:tab/><s:flexContextMenu></s:p>
<s:p><s:tab/><s:tab/><flexContextMenu:FlexContextMenu></s:p>
<s:p><s:tab/><s:tab/><s:tab/><flexContextMenu:dataProvider></s:p>
<s:p><s:tab/><s:tab/><s:tab/><s:tab/><s:ArrayCollection></s:p>
<s:p><s:tab/><s:tab/><s:tab/><s:tab/><s:tab/><fx:Object label="New"/></s:p>
<s:p><s:tab/><s:tab/><s:tab/><s:tab/><s:tab/><fx:Object type="separator"/></s:p>
<s:p><s:tab/><s:tab/><s:tab/><s:tab/><s:tab/><fx:Object label="Copy"/></s:p>
<s:p><s:tab/><s:tab/><s:tab/><s:tab/><s:tab/><fx:Object label="Delete" enabled="false"/></s:p>
<s:p><s:tab/><s:tab/><s:tab/><s:tab/><s:tab/><fx:Object type="separator"/></s:p>
<s:p><s:tab/><s:tab/><s:tab/><s:tab/><s:tab/><fx:Object type="radio" label="Radio A" toggled="true"/></s:p>
<s:p><s:tab/><s:tab/><s:tab/><s:tab/><s:tab/><fx:Object type="radio" label="Radio B"/></s:p>
<s:p><s:tab/><s:tab/><s:tab/><s:tab/><s:tab/><fx:Object type="separator"/></s:p>
<s:p><s:tab/><s:tab/><s:tab/><s:tab/><s:tab/><fx:Object type="radio" label="Check" toggled="true"/></s:p>
<s:p><s:tab/><s:tab/><s:tab/><s:tab/></s:ArrayCollection></s:p>
<s:p><s:tab/><s:tab/><s:tab/></flexContextMenu:dataProvider></s:p>
<s:p><s:tab/><s:tab/></flexContextMenu:FlexContextMenu></s:p>
<s:p><s:tab/></s:flexContextMenu></s:p>
<s:p></s:Image></s:p>
</s:content>
</s:RichText>
</s:HGroup>
</s:VGroup>
</data:primaryContent>
</data:PrimaryContentData>
<!--- example #3 -->
<data:PrimaryContentData>
<data:tabLabel>Actionscript Example</data:tabLabel>
<data:exampleDescription>Flex ContextMenu set via Actionscript.</data:exampleDescription>
<data:primaryContent>
<s:VGroup horizontalCenter="0" verticalCenter="0"
gap="20">
<s:Label text="Right click the Grid below to display a ContextMenu set via Actionscript." />
<s:HGroup gap="20">
<s:DataGrid id="dg"
width="300"
variableRowHeight="true"
editable="true" >
<s:columns>
<s:ArrayList>
<s:GridColumn dataField="product"
headerText="Product"/>
<s:GridColumn dataField="revenue"
headerText="Revenue"/>
<s:GridColumn dataField="cost"
headerText="Cost"/>
</s:ArrayList>
</s:columns >
<s:dataProvider>
<s:ArrayCollection>
<fx:Object product="Gumballs" revenue="100" cost="200"/>
<fx:Object product="Suckers" revenue="200" cost="300"/>
<fx:Object product="Candy Bars" revenue="10" cost="2900"/>
<fx:Object product="Cookies" revenue="5000" cost="2100"/>
</s:ArrayCollection>
</s:dataProvider>
</s:DataGrid>
<s:RichText tabStops="20 40 60 80 100">
<s:content>
<s:p fontWeight="bold">Implementation MXML Code:</s:p>
<s:p paddingTop="11">private function createCompleteHandler(event:FlexEvent):</s:p>
<s:p>{</s:p>
<s:p><s:tab/>contextMenu.setContextMenu(dg);</s:p>
<s:p>}</s:p>
</s:content>
</s:RichText>
</s:HGroup>
</s:VGroup>
</data:primaryContent>
</data:PrimaryContentData>
<!--- example #4 -->
<data:PrimaryContentData>
<data:tabLabel>Multiple ContextMenus Example</data:tabLabel>
<data:exampleDescription>Illustrates implementation of multiple context menus in a single application view. Each visual element below has a different context menu applied to it.</data:exampleDescription>
<data:primaryContent>
<s:VGroup horizontalCenter="0" verticalCenter="0"
gap="20">
<s:Label text="Right click the elements below to see that each has a different context menu applied to it." />
<s:TileGroup requestedColumnCount="2"
verticalGap="20" horizontalGap="20"
verticalAlign="middle" horizontalAlign="center">
<mx:Tree id="treeA"
width="160"
labelField="@label"
showRoot="true">
<mx:XMLListCollection>
<fx:XMLList>
<folder label="Item 1"/>
<folder label="Item 2"/>
<folder label="Item 3"/>
<folder label="Item 4"/>
<folder label="Item 5"/>
<folder label="Item 6"/>
<folder label="Item 7"/>
<folder label="Item 8"/>
<folder label="Item 9"/>
<folder label="Item 10"/>
</fx:XMLList>
</mx:XMLListCollection>
<mx:flexContextMenu>
<flexContextMenu:FlexContextMenu minWidth="{menuMinWidthSelect.value}"
variableRowHeight="{menuVariableRowHeightSelect.selected}"
subMenuHorizontalOffset="{subMenuHorizontalOffsetSelect.value}"
subMenuVerticalOffset="{subMenuVerticalOffsetSelect.value}"
textIndent="{textIndentSelect.value}"
rollOverColor="{rollOverColor.selectedColor}"
selectionColor="{selectionColor.selectedColor}"
paddingTop="{menuPaddingTop.value}"
paddingRight="{menuPaddingRight.value}"
paddingBottom="{menuPaddingBottom.value}"
paddingLeft="{menuPaddingLeft.value}"
horizontalGap="{hGapSelect.value}">
<flexContextMenu:dataProvider>
<s:ArrayCollection>
<fx:Object label="Example A"/>
<fx:Object type="separator"/>
<fx:Object label="Example A"/>
</s:ArrayCollection>
</flexContextMenu:dataProvider>
</flexContextMenu:FlexContextMenu>
</mx:flexContextMenu>
</mx:Tree>
<s:Image source="@Embed(source='images/laika-grass.jpg')">
<s:flexContextMenu>
<flexContextMenu:FlexContextMenu minWidth="{menuMinWidthSelect.value}"
variableRowHeight="{menuVariableRowHeightSelect.selected}"
subMenuHorizontalOffset="{subMenuHorizontalOffsetSelect.value}"
subMenuVerticalOffset="{subMenuVerticalOffsetSelect.value}"
textIndent="{textIndentSelect.value}"
rollOverColor="{rollOverColor.selectedColor}"
selectionColor="{selectionColor.selectedColor}"
paddingTop="{menuPaddingTop.value}"
paddingRight="{menuPaddingRight.value}"
paddingBottom="{menuPaddingBottom.value}"
paddingLeft="{menuPaddingLeft.value}"
horizontalGap="{hGapSelect.value}">
<flexContextMenu:dataProvider>
<s:ArrayCollection>
<fx:Object label="Example B"/>
<fx:Object type="separator"/>
<fx:Object label="Example B"/>
<fx:Object label="Example B"/>
</s:ArrayCollection>
</flexContextMenu:dataProvider>
</flexContextMenu:FlexContextMenu>
</s:flexContextMenu>
</s:Image>
<s:Image id="imageC"
source="@Embed(source='images/laika-begging.jpg')">
<s:flexContextMenu>
<flexContextMenu:FlexContextMenu minWidth="{menuMinWidthSelect.value}"
variableRowHeight="{menuVariableRowHeightSelect.selected}"
subMenuHorizontalOffset="{subMenuHorizontalOffsetSelect.value}"
subMenuVerticalOffset="{subMenuVerticalOffsetSelect.value}"
textIndent="{textIndentSelect.value}"
rollOverColor="{rollOverColor.selectedColor}"
selectionColor="{selectionColor.selectedColor}"
paddingTop="{menuPaddingTop.value}"
paddingRight="{menuPaddingRight.value}"
paddingBottom="{menuPaddingBottom.value}"
paddingLeft="{menuPaddingLeft.value}"
horizontalGap="{hGapSelect.value}">
<flexContextMenu:dataProvider>
<s:ArrayCollection>
<fx:Object label="Example C"/>
<fx:Object type="separator"/>
<fx:Object label="Example C"/>
<fx:Object label="Example C"/>
<fx:Object type="separator"/>
<fx:Object label="Example C"/>
</s:ArrayCollection>
</flexContextMenu:dataProvider>
</flexContextMenu:FlexContextMenu>
</s:flexContextMenu>
</s:Image>
<s:DataGrid width="250"
variableRowHeight="true"
editable="true" >
<s:columns>
<s:ArrayList>
<s:GridColumn dataField="product"
headerText="Product"/>
<s:GridColumn dataField="revenue"
headerText="Revenue"/>
<s:GridColumn dataField="cost"
headerText="Cost"/>
</s:ArrayList>
</s:columns >
<s:dataProvider>
<s:ArrayCollection>
<fx:Object product="Gumballs" revenue="100" cost="200"/>
<fx:Object product="Suckers" revenue="200" cost="300"/>
<fx:Object product="Candy Bars" revenue="10" cost="2900"/>
<fx:Object product="Cookies" revenue="5000" cost="2100"/>
</s:ArrayCollection>
</s:dataProvider>
<s:flexContextMenu>
<flexContextMenu:FlexContextMenu minWidth="{menuMinWidthSelect.value}"
variableRowHeight="{menuVariableRowHeightSelect.selected}"
subMenuHorizontalOffset="{subMenuHorizontalOffsetSelect.value}"
subMenuVerticalOffset="{subMenuVerticalOffsetSelect.value}"
textIndent="{textIndentSelect.value}"
rollOverColor="{rollOverColor.selectedColor}"
selectionColor="{selectionColor.selectedColor}"
paddingTop="{menuPaddingTop.value}"
paddingRight="{menuPaddingRight.value}"
paddingBottom="{menuPaddingBottom.value}"
paddingLeft="{menuPaddingLeft.value}"
horizontalGap="{hGapSelect.value}">
<flexContextMenu:dataProvider>
<s:ArrayCollection>
<fx:Object label="Example D"/>
<fx:Object type="separator"/>
<fx:Object label="Example D"/>
<fx:Object label="Example D"/>
<fx:Object type="separator"/>
<fx:Object label="Example D"/>
<fx:Object label="Example D"/>
<fx:Object label="Example D"/>
</s:ArrayCollection>
</flexContextMenu:dataProvider>
</flexContextMenu:FlexContextMenu>
</s:flexContextMenu>
</s:DataGrid>
</s:TileGroup>
</s:VGroup>
</data:primaryContent>
</data:PrimaryContentData>
</containers:centerContent>
</containers:DemoApplicationWrapper>
</s:Module>