如何检测SpinnerList控件中间的单击?有测试用例和截图

时间:2012-12-03 14:42:31

标签: actionscript-3 flex spinner flex4.6 flex-mobile

如何检测SpinnerList控件中

项下的点击次数?

即。典型的情况 - 当用户滚动SpinnerList时,直到所需的项目位于中间且之后点击它?

当我只添加一个click事件处理程序时,我也错误地检测到了这种情况,当用户只是点击某个项目使其显示在中间时,如此屏幕截图所示:

enter image description here

以下是我的测试用例代码。

有什么建议吗?我还尝试使用自定义SpinnerListItemRenderer并在其中添加点击处理程序,但它不会改变上述问题。

Main.mxml:

<?xml version="1.0" encoding="utf-8"?>
<s:ViewNavigatorApplication 
    xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:s="library://ns.adobe.com/flex/spark" 
    firstView="views.MainHomeView">
</s:ViewNavigatorApplication>

视图/ MainHomeView.mxml:

<?xml version="1.0" encoding="utf-8"?>
<s:View xmlns:fx="http://ns.adobe.com/mxml/2009" 
        xmlns:s="library://ns.adobe.com/flex/spark" 
        title="How to detect a click?">

    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayList;

            private function handleClick(event:Event):void {
                trace('selectedItem: ' + _list.selectedItem);
            }
        ]]>
    </fx:Script>

    <s:SpinnerListContainer>
        <s:SpinnerList id="_list" 
                       click="handleClick(event)"
                       typicalItem="45" 
                       dataProvider="{new ArrayList([1,5,6,10,15,30])}"
                       wrapElements="false"/>
    </s:SpinnerListContainer>
</s:View> 

1 个答案:

答案 0 :(得分:1)

使用自定义itemRenderer -

解决了这个问题

<强> RedBlack.as:

package {
    import flash.events.MouseEvent;
    import spark.components.List;
    import spark.components.SpinnerList;
    import spark.components.SpinnerListItemRenderer;

    public class RedBlack extends SpinnerListItemRenderer {
        public function RedBlack() {
            super();
            cacheAsBitmap = true;
            minHeight = 50;
            setStyle('textAlign', 'center');
            addEventListener(MouseEvent.CLICK, handleClick, false, 0, true);
        }

        override public function set data(value:Object):void {
            super.data = value;
            setStyle('color', int(value) % 2 ? 'red' : 'black');
        }

        private function handleClick(e:MouseEvent):void {
            var list:SpinnerList = owner as SpinnerList;
            var value:int = int(data);

            if (list && value == list.selectedItem) {
                trace('clicked in the middle: ' + value);
            }
        }   
    }
}