`

Flex combox测试

阅读更多
<?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" creationComplete="init()">

<fx:Declarations>
<!-- 将非可视元素(例如服务、值对象)放在此处 -->
</fx:Declarations>

<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.collections.IList;
import mx.collections.XMLListCollection;
import mx.controls.Alert;
[Bindable]
private var monitorItemData:XML=<root>
<node label="负载均衡器" type="0">
<item label="apache" value="1"/>
<item label="loadbalance" value="2"/>
                   </node>
<node label="应用服务器" type="0">
<item label="apusic" value="1"/>
<item label="tomcat" value="2"/>
<item label="weblogic" value="3"/>
</node>
<node label="数据库" type="0">
<item label="mysql" value="1"/>
<item label="db2" value="2"/>
<item label="oracle" value="3"/>
</node>

</root>;

var data:ArrayCollection = new ArrayCollection();
var provider:ArrayCollection;
var xmlListCollection:XMLListCollection = new XMLListCollection();
var selectedVm:String;
var selectedSpecifyItem:String;
var obj:Object;//用于测试获取comboBox选中值

private function init():void{//将XML转换为ArrayCollection类型的数据
xmlListCollection = new XMLListCollection(monitorItemData.children());
    data.source = xmlListCollection.toArray();
//第二种方式(失效?)
// var xmlList:XMLList = new XMLList();
// xmlList = monitorItemData.elements("node");
// xmlListCollection.source = xmlList;
// var myData:ArrayCollection = new ArrayCollection(xmlListCollection.toArray());

             }

private function vmChangeHandler(e:Event):void{
var xmlListCollection:XMLListCollection = new XMLListCollection();
xmlListCollection.source = e.target.selectedItem.item;//将XMLList转换为XMLListCollection

provider = new ArrayCollection(xmlListCollection.toArray());
specifyItem.dataProvider = provider;
//specifyItem.selectedIndex=0;第二个comboBox的首项不实时更新
selectedVm = e.target.selectedItem.@label;
specifyItem.selectedIndex = -1;
         }

private function specifyItemChangeHandler(e2:Event):void{
selectedSpecifyItem = specifyItem.selectedItem.@label;
yourSelect.text=selectedVm+selectedSpecifyItem;

}
]]>
</fx:Script>
   
<s:Group width="30%" height="45%" x="153" y="33">
<s:Panel title="添加监控项" width="482" height="100%">
<s:layout>
<s:VerticalLayout/>
</s:layout>
<s:Group width="100%" height="20%">
<s:Label text="虚拟设备:" id="vm" x="33" y="6"/>
<s:ComboBox x="109" y="1" width="124" id="vmCombox"  labelField="@label" dataProvider="{data}" change="vmChangeHandler(event)"/>
<s:Label x="250" y="6" text="监控指标:" id="monitorItem"/>
<s:ComboBox x="311" y="1" width="124" id="specifyItem" labelField="@label" change="specifyItemChangeHandler(event)" />

</s:Group>
<s:Line width="100%" height="2">
<s:stroke>
<s:SolidColorStroke color="0x000000" weight="2"/>
</s:stroke>
</s:Line>
<s:Group width="100%" height="66%" id="drop">
<s:Label text="选择的监控项:" id="selectedItems" x="10" y="0"/>
<s:List height="153" width="161" x="105" y="0">
</s:List>

<s:Button label="删除" x="278" y="34"/>

<s:Button x="277" y="83" label="删除所有" id="dropAll"/>
           </s:Group>
<s:Line width="100%" height="2">
<s:stroke>
<s:SolidColorStroke color="0x000000" weight="2"/>
</s:stroke>
</s:Line>
<s:Group width="100%" height="14%">
<s:Button label="确定" x="308" y="-4" id="submit"/>
<s:Button x="400" y="-4" label="取消" id="cancel"/>
<s:Label x="38" y="-1" text="你选中的为:"/>
<s:Label x="128" y="0" id="yourSelect"/>
</s:Group>
</s:Panel>
</s:Group>
</s:Application>

——————————————————————补充————————————
疑问:
1、 为什么init()方法中的第二种方式失效?
2、 vmChangeHandler方法中的specifyItem.selectedIndex=0所导致的奇怪问题
3、 扩展之comboBox中嵌套tree

——————————————实验——————————————
<?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"
   creationComplete="init()">
<s:layout>
<s:BasicLayout/>
</s:layout>
<fx:Declarations>
<!-- 将非可视元素(例如服务、值对象)放在此处 -->
<fx:XML id="xmlPC_linked" source="PC_linked.xml"/>
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.collections.XMLListCollection;

var xmlListCollection:XMLListCollection = new XMLListCollection();
var data:ArrayCollection;// = new ArrayCollection();
var xmlList:XMLList = new XMLList();

public function init():void{
//xmlListCollection = new XMLListCollection(xmlPC_linked.children());
//data.source = xmlListCollection.toArray();
    xmlList = xmlPC_linked.elements("node");
xmlListCollection.source = xmlList;
data = new ArrayCollection(xmlListCollection.toArray());
}

public function changeHandler(e:Event):void
{  
//showSelectedItem.text = ComboBox(e.target).selectedItem.node.label;

city.dataProvider=e.target.selectedItem.item;
city.selectedIndex=0;              
}
]]>
</fx:Script>
<s:Panel  x="262" y="144" width="296" height="200">
<s:ComboBox id="pro" dataProvider="{data}" labelField="@label" change="changeHandler(event)"/>
        <s:ComboBox id="city" labelField="@label"/>
</s:Panel>
</s:Application>
这个mxml所采用的xml是来自于外部, 在这种情况下方式一与方式二都失效。然而我将此mxml放在flex3下编译运行则正确无误...  ...

  搞什么东东呀...  ... 
分享到:
评论

相关推荐

    Flex combox

    在Flex中,Combox组件是一种常用的控件,它结合了输入框和下拉列表的功能,提供了丰富的用户体验。在本场景中,我们讨论的是一个特殊的Combox实现,即"带复选框的树状下拉框"。 这个Flex Combox的特点在于,其下拉...

    Flex ComBox 下拉树功能

    Flex ComBox是一款基于Adobe Flex的UI组件,它提供了一种灵活的方式来展示下拉选项,而下拉树功能则是其中一种增强型的交互设计。在Flex应用中,这种组件允许用户从一个可折叠的树结构中选择值,适用于数据层级关系...

    flex combox和checkbox总结

    ### Flex ComboBox 和 CheckBox 的使用详解 #### 一、Flex ComboBox 的使用 在 Flex 开发中,`ComboBox` 控件是一个非常实用的控件,它结合了文本框与下拉列表的功能,用户可以在文本框中输入内容,也可以通过下拉...

    重绘ComBox控件实现换行 当文本达到一定长度时实现换行

    在Windows编程中,ComBox(ComboBox)控件是一种常见的用户界面元素,用于提供下拉列表让用户选择。在某些情况下,当ComBox中的选项文本较长时,可能会超出控件的宽度,导致显示不全,影响用户体验。为了解决这个...

    flex DataGrid 嵌入Combobox列拖动下拉条数据混乱

    6. **错误处理和调试**:在开发过程中,要对可能出现的问题进行充分的测试和调试,例如拖动列的边界情况、多列Combobox的同步问题等。 在提供的压缩包文件"DataGridCombobox"中,可能包含了示例代码或资源,通过...

    Flex 写的一个combox多选控件

    在Flex编程领域,Combox(组合框)是一种常用的UI组件,它结合了下拉列表和文本输入框的功能,用户可以在下拉列表中选择一个或多个选项。本篇将详细讲解如何在Flex中创建一个支持多选功能的Combox控件,并基于提供的...

    combox

    combox的栏数如何生成?

    WPF_MVVM中DataGrid列中使用ComBox绑定

    在WPF(Windows Presentation Foundation)开发中,MVVM(Model-View-ViewModel)设计模式被广泛应用,它将用户界面(View)、数据模型(Model)和业务逻辑(ViewModel)分离,提高了代码的可测试性和可维护性。...

    c#Winform Combox控件重绘

    步骤5:运行与测试 编译并运行项目,查看自定义Combox控件是否按照预期显示。可以尝试更改选择项,检查重绘是否正常工作。 总结,通过VS2017和C#,我们可以对.Net 2.0的Combox控件进行自定义重绘,实现独特的视觉...

    测试C#的combobox控件

    这个测试项目专注于如何利用txt文件动态地设置ComboBox的选项,实现对ComboBox内容的控制,以及保存添加的选项,使其与程序逻辑相独立。下面我们将深入探讨相关知识点。 1. **读取txt文件**: - 在C#中,可以使用`...

    delphi控件ComboxGrid

    ComboxGrid是一款在Delphi开发环境中使用的自定义控件,它是Combobox(下拉框)和Grid(表格)功能的结合体,为用户提供更丰富的数据选择和显示方式。在Delphi编程中,ComboxGrid控件可以极大地提高用户体验,因为它...

    combox 列表嵌套checkbox

    标题“combox 列表嵌套checkbox”指的是在下拉组合框(ComboBox)中集成复选框(Checkbox)功能,使得用户可以在下拉列表中进行多项选择。这种设计通常用于提供一种灵活的多选方式,特别是在选项众多且需要用户快速...

    combox 实现搜寻功能

    ### combox实现搜寻功能详解 在Java编程中,`JComboBox`是Swing库中的一个组件,用于创建下拉列表或组合框。它能够显示一个可编辑的文本字段和一个下拉列表,用户可以在其中选择一个选项或者手动输入文本。`...

    Winform中的ComBox控件实现换行 当文本长度达到最大时实现换行

    在Windows Forms(Winform)开发中,ComBox控件是一种常用的下拉选择组件,它提供了用户友好的交互界面。然而,默认情况下,ComBox控件的显示文本是单行的,当文本长度超过一定限制时,超出的部分会被截断,显示为...

    Combox下拉多值

    在IT行业中,`Combox`(也常写作ComboBox或下拉框)是一种常见的用户界面元素,用于提供用户从预定义的选项中选择一个或多个值。在本案例中,"Combox下拉多值"指的是支持用户选择多个值的ComboBox控件。这种控件在...

    VBCombox实现下拉

    至于"Combox 搜索"这个压缩包文件名,可能包含了实现自动下拉功能的源代码,或者是用于演示的示例项目。通常,这样的项目文件可能包含一个VB工程,里面包含了Form窗口、ComboBox控件以及其他相关组件,以及上述的...

    js 实现combox 树选择

    在JavaScript编程中,"js 实现combox 树选择"是指使用JS来创建一个具有下拉树形结构的组合框(ComboBox)。ComboBox通常用于提供一个输入框和一个下拉列表,用户可以在输入框中直接键入,或者从下拉列表中选择一个值...

    含有checkbox的combox控件类

    本话题主要涉及的是"含有checkbox的combox控件类",这是一个将复选框(Checkbox)功能集成到组合框(Combobox)中的特殊控件。这种控件在Windows编程中常见,尤其是在开发桌面应用时,它允许用户在列表中选择一个或...

    ComBoxGrid(Combox增强网格下拉框控件(支持鼠标滚轮))

    frmTestDGC.frm和frmTestDGC.frx是测试用例的窗体文件,用于验证ComBoxGrid的功能和性能;DGridCombo.log可能是编译或运行过程的日志文件,有助于开发者诊断问题;DGridCombo.oca可能是编译后的对象文件,用于在...

    DataGrid中嵌入comBox

    本文将详细讲解如何在DataGrid中实现这一功能,并结合MVVM(Model-View-ViewModel)设计模式来增强可维护性和可测试性。 首先,了解MVVM模式。它是WPF和XAML应用中常用的设计模式,分离了用户界面(View)、业务...

Global site tag (gtag.js) - Google Analytics