Arcgis api for flex advanced topic (2) Development of Custom Controls

Arcgis api for flex advanced topic (2) Development of Custom Controls
Arcgis api for flex only provides two controls: Navigation and ScaleBar.
Describe in detail how to develop custom controls (or, maybe, I did not find them ),
The following describes my methods. To control the dynamic display of the current mouse longitude and latitude on the map
.
1. Define the control class and integrate UIComponent to implement the IMapAware interface.
2. Reload the createChildren function.
3. Implement the public function set map (map: Map): void function.
4. add your own function Code
Package com. esri
{
Import com. esri. ags .*;
Import com. esri. ags. events .*;
Import com. esri. ags. geometry. MapPoint;
Import com. esri. ags. utils .*;
Import flash. display .*;
Import flash. events. MouseEvent;
Import flash. filters .*;
Import flash. text .*;
Import flash. geom. Point;
Import mx. core .*;
Import mx. events .*;
Public class ESRIStatusBar extends UIComponent implements
IMapAware
{
Private var m_map: Map;
Private var m_stateLabel: TextField;
Public function ESRIStatusBar ()
{
M_stateLabel = new TextField ();
M_stateLabel.width = 152;
}
Override protected function updateDisplayList (log: Number,
Pow: Number): void
{
Super. updateDisplayList (log, pow );
Return;
} // End function
Override protected function createChildren (): void
{
Super. createChildren ();

Var pnt: Point = new Point;
If (m_map.loaded)
{
Var mapPnt: MapPoint = new MapPoint
(M_map.extent.xmax, m_map.extent.ymin );
Pnt = m_map.toScreen (mapPnt );
M_stateLabel.x = pnt. x-150;
M_stateLabel.y = pnt. y-16;
}

AddChild (m_stateLabel );
Return;
} // End function
Private function mouseMoveHandler
(Event: MouseEvent): void
{
If (m_map)
{
If (m_map.loaded)
{
Var mapPoint: MapPoint =
M_map.toMapFromStage (event. stageX, event. stageY );
M_stateLabel.text =
"X =" + mapPoint. x. toString () + ", y =" + mapPoint. y. toString ();
}
}
}
Private function extentChangeHandler
(Event: ExtentEvent): void
{
Var pnt: Point = new Point;
Var mapPnt: MapPoint = new MapPoint
(M_map.extent.xmax, m_map.extent.ymin );
Pnt = m_map.toScreen (mapPnt );

M_stateLabel.x = pnt. x-150;
M_stateLabel.y = pnt. y-16;
}
Public function set map (map: Map): void
{
M_map = map;
M_map.addEventListener
(MouseEvent. MOUSE_MOVE, mouseMoveHandler );
M_map.addEventListener (ExtentEvent. EXTENT_CHANGE,
ExtentChangeHandler );
} // End function
}
}

Add this control to map
Var statusBar: ESRIStatusBar = new ESRIStatusBar ();
IMapAware (statusBar). map = EsriMap;
EsriMap. addChild (statusBar );
Put code

 

Code
<? Xml version = "1.0" encoding = "UTF-8"?>
<Mx: Application
Xmlns: mx = "http://www.adobe.com/2006/mxml"
Xmlns: esri = "http://www.esri.com/2008/ags"
StyleName = "plain">
<Mx: Script>
<! [CDATA [
Import com. esri .*;
Import com. esri. ags .*;
Private function EsriMapCreateComplete (): void
{
Var statusBar: ESRIStatusBar = new
ESRIStatusBar ();
IMapAware (statusBar). map = EsriMap;
EsriMap. addChild (statusBar );
}
]>
</Mx: Script>
<Esri: Map crosshairVisible = "true" id = "EsriMap"
CreationComplete = "EsriMapCreateComplete ()">
<Esri: ArcGISTiledMapServiceLayer

Url = "http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap
_ World_2D/MapServer "/>
</Esri: Map>
</Mx: Application>