最近在做Flex的一些学习,需要对Flex组件重写,当然可以两种选择MXML和ActionScript3.0重写,当然MXML的可视化的操作为重写提供了方便,但是要是更改组件的默认属性和添加一些框架属性ActionScript是必须的。我的经历重写一个可以最大化,最小化,关闭的Panel,这是改变Flex中Panel的本质属性的,只用通过ActionScript3.0来完成了。
网上有个SuperPanel和Flexlib写的相当成熟和不错,我选择的是SuperPanel(个人觉得代码写的相当漂亮)。
写好以后,就是MXML中应用了由于继承了Panel,所以可以直接在<mx:></mx>中显示,但是这里会出现一个问题,我个人觉得是编辑工具应该改进的或者说是Bug,组件继承Panel自定义为SuperPanel,在要应用的MXML应用程序中里的容器里添加使用,OK,一切都可以通过,但是
<mx:Canvas
id="panelContainer"
width="100%" height="100%"
>
<containers:SuperPanel
id="myPanel"
title="My Panel"
x="20" y="20"
width="300" height="200"
minWidth="200" minHeight="100"
horizontalAlign="center"
verticalAlign="middle"
allowDrag="true"
allowResize="true"
allowClose="true"
allowMaximize="true"
allowMinimize="true"
sizeRatio="{useSizeConstraintCheck.selected ? '4:3' : null}"
resizeEffect="Resize"
moveEffect="Move"
close="panelContainer.removeChild(myPanel);"
>
<mx:Label
text="SuperPanel"
fontSize="24"
fontWeight="bold"
>
<mx:filters>
<mx:DropShadowFilter alpha="0.5"/>
</mx:filters>
</mx:Label>
<mx:Label
text="By: Brandon Meyer"
/>
</containers:SuperPanel>
</mx:Canvas>
当你想在Reperter中这样使用的话,就会报错,看代码:
<mx:Canvas id="panelShow" width="100%" height="100%" > <mx:ToggleButtonBar id="ToggleBtn" dataProvider="{myChaters}" /> <mx:ViewStack id="myChaters" width="100%" height="100%" x="4" y="19"> <mx:Repeater id="chatWindow" dataProvider="{allChatPaneWindow}"> <containers:SuperPanel id="myPanel" title="{chatWindow.currentItem.label}" x="20" y="20" width="300" height="200" minWidth="200" minHeight="100" horizontalAlign="center" verticalAlign="middle" allowDrag="true" allowResize="true" allowClose="true" allowMaximize="true" allowMinimize="true" sizeRatio="{true ? '4:3' : null}" resizeEffect="Resize" moveEffect="Move" close="this.parent.removeChild(myPanel);" > </containers:SuperPanel> </mx:Repeater> </mx:ViewStack> </mx:Canvas>
这里就会报错,1067: Array 类型值的隐式强制指令的目标是非相关类型 flash.display:DisplayObject ,我就不能理解,为什么是继承Panel来的,但这里就成为非DisplatObject了,不可理解,上面的测试明显是DisplayObject,而且经过编译可以知道SuperPanel就是Panel的加强版!这里编辑器应该可以获得信息,无奈Google+Baidu
最后还是没有解决,去了Adobe官网。
<mx:Repeater id="chatWindow" dataProvider="{allChatPaneWindow}"> 需要把Array转化为mx.contrains里面包含的组件,才能传递信息,所以出现这个错误,
所以改一下就OK了:
<containers:Panel id="myPanel" title="{chatWindow.currentItem.label}" x="20" y="20" width="300" height="200" minWidth="200" minHeight="100" horizontalAlign="center" verticalAlign="middle" allowDrag="true" allowResize="true" allowClose="true" allowMaximize="true" allowMinimize="true" sizeRatio="{true ? '4:3' : null}" resizeEffect="Resize" moveEffect="Move" close="this.parent.removeChild(myPanel);" > </containers:Panel>
错误得到解决,花了几个小时的时间,最后总是解决了。但是不太明白的是,为什么编辑器不能直接识别出SuperPanel????????
希望这些对学习Flex遇到相似问题的有所帮助!!!!!