如何重新设置Adobe Flex Accordion的样式以在每个画布标题中包含一个按钮?
时间:2020-03-05 18:39:44 来源:igfitidea点击:
这是我的手风琴的示例代码:
<mx:Accordion x="15" y="15" width="230" height="599" styleName="myAccordion"> <mx:Canvas id="pnlSpotlight" label="SPOTLIGHT" height="100%" width="100%" horizontalScrollPolicy="off"> <mx:VBox width="100%" height="80%" paddingTop="2" paddingBottom="1" verticalGap="1"> <mx:Repeater id="rptrSpotlight" dataProvider="{aSpotlight}"> <sm:SmallCourseListItem viewClick="PlayFile(event.currentTarget.getRepeaterItem().fileID);" Description="{rptrSpotlight.currentItem.fileDescription}" FileID = "{rptrSpotlight.currentItem.fileID}" detailsClick="{detailsView.SetFile(event.currentTarget.getRepeaterItem().fileID,this)}" Title="{rptrSpotlight.currentItem.fileTitle}" FileIcon="{iconLibrary.getIcon(rptrSpotlight.currentItem.fileExtension)}" /> </mx:Repeater> </mx:VBox> </mx:Canvas> </mx:Accordion>
我想在每个标题中包含一个按钮,如下所示:
如意" onclick =" alert('xss')http://www.kevinx.net/tf2/uploads/helpme.jpg
解决方案
回答
我们将必须创建一个自定义标题渲染器,向其添加一个按钮,然后手动放置它。尝试这样的事情:
<mx:Accordion> <mx:headerRenderer> <mx:Component> <AccordionHeader xmlns="mx.containers.accordionClasses.*"> <mx:Script> <![CDATA[ import mx.controls.Button; private var extraButton : Button; override protected function createChildren( ) : void { super.createChildren(); if ( extraButton == null ) { extraButton = new Button(); addChild(extraButton); } } override protected function updateDisplayList( unscaledWidth : Number, unscaledHeight : Number ) : void { super.updateDisplayList(unscaledWidth, unscaledHeight); extraButton.setActualSize(unscaledHeight - 6, unscaledHeight - 6); extraButton.move(unscaledWidth - extraButton.width - 3, (unscaledHeight - extraButton.height)/2); } ]]> </mx:Script> </AccordionHeader> </mx:Component> </mx:headerRenderer> <mx:HBox label="1"><Label text="Text 1"/></HBox> <mx:HBox label="1"><Label text="Text 2"/></HBox> <mx:HBox label="1"><Label text="Text 3"/></HBox> </mx:Accordion>
回答
谢谢,我使用FlexLib的CanvasButtonAccordionHeader使它正常工作。