Programmation Flex/Liste des composants

Un livre de Wikilivres.
Sauter à la navigation Sauter à la recherche
Programmation_Flex
Liste des composants
Sommaire
Controles
Layout
Navigator
Adobe Air
Charts
Liens
Modifier ce modèle

Composantes[modifier | modifier le wikicode]

[ SCRIPT ] ActionScripts


<mx:Script>
	<![CDATA[
		import mx.controls.Alert;
	]]>
</mx:Script>


[ CONTROLES ]


  • AdvancedDataGrid
<mx:AdvancedDataGrid id="adg1" designViewDataType="tree">
	<mx:columns>
		<mx:AdvancedDataGridColumn headerText="Column 1" dataField="col1"/>
		<mx:AdvancedDataGridColumn headerText="Column 2" dataField="col2"/>
		<mx:AdvancedDataGridColumn headerText="Column 3" dataField="col3"/>
	</mx:columns>
</mx:AdvancedDataGrid>
  • Button
<mx:Button label="Button"/>
  • CheckBox
<mx:CheckBox label="Checkbox"/>
  • ColorPicker

</source>

<mx:ColorPicker/>
  • ComboBox
<mx:ComboBox></mx:ComboBox>
  • DataGrid
<mx:DataGrid>
  <mx:dataProvider>
      <mx:Object Artist="Pavement" Price="11.99"
        Album="Slanted and Enchanted"/>
      <mx:Object Artist="Pavement"
        Album="Brighten the Corners" Price="11.99"/>
  </mx:dataProvider>
  <mx:columns>
    <mx:DataGridColumn dataField="Album"/>
    <mx:DataGridColumn dataField="Price"/>
  </mx:columns>
</mx:DataGrid>
  • DateChooser

</source>

<mx:DateChooser id="dateChooser2" yearNavigationEnabled="true" disabledRanges="{[ {rangeEnd: new Date(2006, 5, 1)} ]}"/>
  • DateField
<mx:DateField id="dateField2" yearNavigationEnabled="true" disabledRanges="{[ {rangeEnd: new Date(2006, 5, 1)} ]}" />
  • HSlider
<mx:HSlider x="117" y="158" />
  • HorizontalList
<mx:HorizontalList x="73" y="154"></mx:HorizontalList>
  • Image
<mx:Image x="70" y="156"/>
  • Label
<mx:Label x="58" y="180" text="Label"/>
  • LinkButton
<mx:LinkButton x="78" y="212" label="LinkButton"/>
  • List
<mx:List x="40" y="203"></mx:List>
  • NumericStepper
<mx:NumericStepper x="95" y="171"/>
  • OLAPDataGrid
<mx:OLAPDataGrid x="50" y="177"/>
  • PopUpButton
<mx:PopUpButton x="79" y="190" label="PopUpButton"/>
  • PopUpMenuButton
<mx:PopUpMenuButton x="52" y="206" label="PopUpMenuButton"/>
  • ProgressBar
<mx:ProgressBar x="77" y="227"/>
  • RadioButton
<mx:RadioButton x="71" y="148" label="Button 1" groupName="radiogroup1"/>
<mx:RadioButton x="71" y="174" label="Button 2" groupName="radiogroup1"/>
  • RadioButtonGroup
<mx:RadioButtonGroup id="radiogroup1"/>
  • RichTextEditor
<mx:RichTextEditor x="107" y="287" title="Title"></mx:RichTextEditor>
  • SWFLoader
<mx:SWFLoader x="32" y="230"/>
  • Text
<mx:Text x="180" y="197" text="Text"/>
  • TextArea
<mx:TextArea x="151" y="235"/>
  • TextInput
<mx:TextInput x="272" y="108"/>
  • TileList
<mx:TileList x="218" y="174"></mx:TileList>
  • Tree
<mx:Tree x="22" y="287"></mx:Tree>
  • VSLider
<mx:VSlider x="10" y="287"/>
  • VideoDisplay
<mx:VideoDisplay x="32" y="120"/>


[ LAYOUT ]


  • ApplicationControlBar
<mx:ApplicationControlBar x="66" y="139"></mx:ApplicationControlBar>
  • Canvas
<mx:Canvas x="66" y="206" width="200" height="200"></mx:Canvas>
  • ControlBar
<mx:ControlBar x="10" y="166"></mx:ControlBar>
  • Form
<mx:Form x="10" y="259"></mx:Form>
  • FormHeading
<mx:FormHeading x="10" y="318" label="Heading"/>
  • Grid
<mx:Grid x="10" y="152">
	<mx:GridRow width="100%" height="100%">
		<mx:GridItem width="100%" height="100%">
		</mx:GridItem>
		<mx:GridItem width="100%" height="100%">
		</mx:GridItem>
		<mx:GridItem width="100%" height="100%">
		</mx:GridItem>
	</mx:GridRow>
	<mx:GridRow width="100%" height="100%">
		<mx:GridItem width="100%" height="100%">
		</mx:GridItem>
		<mx:GridItem width="100%" height="100%">
		</mx:GridItem>
		<mx:GridItem width="100%" height="100%">
		</mx:GridItem>
	</mx:GridRow>
	<mx:GridRow width="100%" height="100%">
		<mx:GridItem width="100%" height="100%">
		</mx:GridItem>
		<mx:GridItem width="100%" height="100%">
		</mx:GridItem>
		<mx:GridItem width="100%" height="100%">
		</mx:GridItem>
	</mx:GridRow>
</mx:Grid>
  • HBox
<mx:HBox x="66" y="111" width="100%"></mx:HBox>
  • HDivideBox
<mx:HDividedBox x="66" y="32" width="100%"></mx:HDividedBox>
  • HRule
<mx:HRule x="16" y="60"/>
  • ModuleLoader
<mx:ModuleLoader x="22" y="82"></mx:ModuleLoader>
  • Panel
<mx:Panel x="10" y="299" width="250" height="200" layout="absolute"></mx:Panel>
  • Spacer
<mx:Spacer x="53" y="30"/>
  • Tile
<mx:Tile x="33" y="92"></mx:Tile>
  • TitleWindow
<mx:TitleWindow x="33" y="159" width="250" height="200" layout="absolute"></mx:TitleWindow>
  • VBox
<mx:VBox x="10" y="120" height="100%"></mx:VBox>
  • VDividedBox
<mx:VDividedBox x="53" y="38" height="100%"></mx:VDividedBox>
  • VRule
<mx:VRule x="153" y="38"/>


[ NAVIGATORS ]


  • Accordion
<mx:Accordion x="81" y="88" width="200" height="200">
	<mx:Canvas label="Accordion Pane 1" width="100%" height="100%">
	</mx:Canvas>
</mx:Accordion>
  • ButtonBar
<mx:ButtonBar x="29" y="73"></mx:ButtonBar>
  • LinkBar
<mx:LinkBar x="29" y="174"></mx:LinkBar>
  • MenuBar
<mx:MenuBar x="10" y="239"></mx:MenuBar>
  • TabBar
<mx:TabBar x="10" y="301"></mx:TabBar>
  • TabNavigator
<mx:TabNavigator x="30" y="339" width="200" height="200">
	<mx:Canvas label="Tab 1" width="100%" height="100%">
	</mx:Canvas>
</mx:TabNavigator>
  • ToggleButtonBar
<mx:ToggleButtonBar x="106" y="301"></mx:ToggleButtonBar>
  • ViewStack
<mx:ViewStack x="188" y="311" id="viewstack1" width="200" height="200">
	<mx:Canvas label="View 1" width="100%" height="100%">
	</mx:Canvas>
</mx:ViewStack>


[ CHARTS ]


  • AreaChart
<mx:AreaChart x="52" y="69" id="areachart1">
	<mx:series>
		<mx:AreaSeries displayName="Series 1" yField=""/>
	</mx:series>
</mx:AreaChart>
<mx:Legend dataProvider="{areachart1}"/>
  • BarChart
<mx:BarChart x="10" y="183" id="µ">
	<mx:series>
		<mx:BarSeries displayName="Series 1" xField=""/>
	</mx:series>
</mx:BarChart>
<mx:Legend dataProvider="{µ}"/>
  • BubbleChart
<mx:BubbleChart x="10" y="127" id="bubblechart1">
	<mx:series>
		<mx:BubbleSeries displayName="Series 1" yField="" radiusField=""/>
	</mx:series>
</mx:BubbleChart>
<mx:Legend dataProvider="{bubblechart1}"/>
  • CandlestickChart
<mx:CandlestickChart x="0" y="169" id="candlestickchart1">
	<mx:series>
		<mx:CandlestickSeries displayName="Series 1" openField="" closeField="" highField="" lowField=""/>
	</mx:series>
</mx:CandlestickChart>
<mx:Legend dataProvider="{candlestickchart1}"/>
  • ColumnChart
<mx:ColumnChart x="19" y="92" id="columnchart1">
	<mx:series>
		<mx:ColumnSeries displayName="Series 1" yField=""/>
	</mx:series>
</mx:ColumnChart>
<mx:Legend dataProvider="{columnchart1}"/>
  • HLOCChart
<mx:HLOCChart x="10" y="92" id="hlocchart1">
	<mx:series>
		<mx:HLOCSeries displayName="Series 1" openField="" closeField="" highField="" lowField=""/>
	</mx:series>
</mx:HLOCChart>
<mx:Legend dataProvider="{hlocchart1}"/>
  • Legend
<mx:Legend x="34" y="69" dataProvider="{legend}"/>
  • LineChart
<mx:LineChart x="0" y="146" id="linechart1">
	<mx:series>
		<mx:LineSeries displayName="Series 1" yField=""/>
	</mx:series>
</mx:LineChart>
<mx:Legend dataProvider="{linechart1}"/>
  • PieChart
<mx:PieChart x="153" y="103" id="piechart1">
	<mx:series>
		<mx:PieSeries displayName="Series 1" field=""/>
	</mx:series>
</mx:PieChart>
<mx:Legend dataProvider="{piechart1}"/>
  • PlotChart
<mx:PlotChart x="137" y="69" id="plotchart1">
	<mx:series>
		<mx:PlotSeries displayName="Series 1" yField=""/>
	</mx:series>
</mx:PlotChart>
<mx:Legend dataProvider="{plotchart1}"/>

Propriétés[modifier | modifier le wikicode]

Les balises ont pour attributs:


  • [ communs ]


accessibilityProperties
alpha automationDelegate
automationName
autoRepeat
blendMode
buttonMode
buttonMode
cacheAsBitmap
cachePolicy
contextMenu
currentState
doubleClickEnabled
emphasized
enabled
errorString
errorString
filters
flexContextMenu
focusEnabled
focusRect
fontContext
height
hitArea
id
includeInLayout
label
labelPlacement
mask
maxHeight
maxWidth
minHeight
minWidth
mouseChildren
mouseEnabled
mouseFocusEnabled


  • [ actions ]


activate
add
added
addedToStage
buttonDown
change
click
creationComplete
currentStateChange
currentStateChanging
dataChange
deactivate
doubleClick
dragComplete
dragDrop
dragEnter
dragExit
dragOver
dragStart
effectEnd
effectStart
enterFrame
enterState
exitState
focusIn
focusOut
hide
initialize
invalid
keyDown
keyFocusChange
keyUp
mouseDown
mouseDownOutside
mouseFocusChange
mouseMove
mouseOut
mouseOver
mouseUp
mouseWheel
mouseWheelOutside
move


  • [ comportements ]


baseline
borderColor
bottom
color
cornerRadius
disabledColor
disabledIcon
disabledSkin
downIcon
downSkin
errorColor
fillAlphas
fillColors
focusAlpha
focusBlendMode
focusRoundedCorners
focusSkin
focusThickness
fontWeight


  • [ effets ]


addedEffect
creationCompleteEffect
focusInEffect
focusOutEffect
hideEffect
mouseDownEffect
mouseUpEffect
moveEffect