需求: 在监控中心页面点击“添加监控项”弹出一个相应的添加页面, 在添加页面添加好监控项之后点击确定返回监控中心页面,并且在此页面上动态呈现出所选择监控指标对应的监控图。
1、 参考相关版
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
<s:layout>
<s:VerticalLayout/>
</s:layout>
<fx:Declarations>
<!-- 将非可视元素(例如服务、值对象)放在此处 -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.containers.VBox;
import spark.core.SpriteVisualElement;
private var sprve:SpriteVisualElement;
private function addAccordionChild2():void{
sprve = new SpriteVisualElement;
sprve.graphics.beginFill(0xFFFFFF);
sprve.graphics.drawCircle(100, 100, 100);
sprve.graphics.endFill();
accordion.addElement(sprve);
}
private function addAccordionChild():void {
// var vbox:VBox = new VBox();
// vbox.label = "child " + accordion.numChildren;
// vbox.percentWidth = 100;
// vbox.percentHeight = 100;
// var randColor:uint = Math.random() * 0xFFFFFF;
// vbox.setStyle("backgroundColor", randColor);
// accordion.addChild(vbox);
var circle:SpriteVisualElement=new SpriteVisualElement();
circle.graphics.beginFill(0x0000ff);
circle.graphics.drawEllipse(100,100,50,50);
circle.graphics.endFill();
accordion.addElement(circle);
}
private function removeAccordionChild():void {
//if (accordion.selectedChild) {
//accordion.removeChild(accordion.selectedChild as DisplayObject);
//}
}
]]>
</fx:Script>
<mx:ApplicationControlBar dock="true">
<s:Button label="Add child"
click="addAccordionChild();"/>
<s:Button label="Remove Child"
click="removeAccordionChild();"/>
</mx:ApplicationControlBar>
<!--<mx:Accordion id="accordion" width="250" height="100%"/>-->
<s:Scroller width="100%" height="100%">
<s:Group width="100%" height="100%" id="accordion2">
<s:TileGroup id="accordion" rowHeight="200" columnWidth="100" horizontalAlign="center"
verticalAlign="middle" horizontalGap="30" >
</s:TileGroup>
</s:Group>
</s:Scroller>
</s:Application>
addElement接受的参数,必须是实现了IVisualElement接口的4个类及其子类
1、 参考相关版
[/code]<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
<s:layout>
<s:VerticalLayout/>
</s:layout>
<fx:Declarations>
<!-- 将非可视元素(例如服务、值对象)放在此处 -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.containers.VBox;
private function addAccordionChild():void {
var vbox:VBox = new VBox();
vbox.label = "child " + accordion.numChildren;
vbox.percentWidth = 100;
vbox.percentHeight = 100;
var randColor:uint = Math.random() * 0xFFFFFF;
vbox.setStyle("backgroundColor", randColor);
accordion.addChild(vbox);
}
private function removeAccordionChild():void {
if (accordion.selectedChild) {
accordion.removeChild(accordion.selectedChild as DisplayObject);
}
}
]]>
</fx:Script>
<mx:ApplicationControlBar dock="true">
<s:Button label="Add child"
click="addAccordionChild();"/>
<s:Button label="Remove Child"
click="removeAccordionChild();"/>
</mx:ApplicationControlBar>
<mx:Accordion id="accordion" width="250" height="100%"/>
</s:Application>
2、 改进版
[code="java"]
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
<s:layout>
<s:VerticalLayout/>
</s:layout>
<fx:Declarations>
<!-- 将非可视元素(例如服务、值对象)放在此处 -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.containers.VBox;
import spark.core.SpriteVisualElement;
private var sprve:SpriteVisualElement;
private function addAccordionChild2():void{
sprve = new SpriteVisualElement;
sprve.graphics.beginFill(0xFFFFFF);
sprve.graphics.drawCircle(100, 100, 100);
sprve.graphics.endFill();
accordion.addElement(sprve);
}
private function addAccordionChild():void {
// var vbox:VBox = new VBox();
// vbox.label = "child " + accordion.numChildren;
// vbox.percentWidth = 100;
// vbox.percentHeight = 100;
// var randColor:uint = Math.random() * 0xFFFFFF;
// vbox.setStyle("backgroundColor", randColor);
// accordion.addChild(vbox);
var circle:SpriteVisualElement=new SpriteVisualElement();
circle.graphics.beginFill(0x0000ff);
circle.graphics.drawEllipse(100,100,50,50);
circle.graphics.endFill();
accordion.addElement(circle);
}
private function removeAccordionChild():void {
//if (accordion.selectedChild) {
//accordion.removeChild(accordion.selectedChild as DisplayObject);
//}
}
]]>
</fx:Script>
<mx:ApplicationControlBar dock="true">
<s:Button label="Add child"
click="addAccordionChild();"/>
<s:Button label="Remove Child"
click="removeAccordionChild();"/>
</mx:ApplicationControlBar>
<!--<mx:Accordion id="accordion" width="250" height="100%"/>-->
<s:Scroller width="100%" height="100%">
<s:Group width="100%" height="100%" id="accordion2">
<s:TileGroup id="accordion" rowHeight="200" columnWidth="100" horizontalAlign="center"
verticalAlign="middle" horizontalGap="30" >
</s:TileGroup>
</s:Group>
</s:Scroller>
</s:Application>
addElement接受的参数,必须是实现了IVisualElement接口的4个类及其子类