Flex 4 - 自定义进度条不更新percentComplete

时间:2012-03-05 13:28:34

标签: actionscript-3 flex4 progress-bar tween

我正在尝试创建一个自定义进度条,它具有通用功能,如缠绕和设置总值等。

似乎每件事情都有效,但出于某种原因, percentComplete 始终为0而不是增加值,即使我调用 setProgress()

UPDATE1:

此外,tweener不会调用onUpdate函数(旧代码)

UPDATE2:

如果我像这样修改了onUpdate函数,则调用onComplete,但只调用onUpdateProgress

   onUpdate:this.onUpdateProgress(getTimer()),

旧代码(从匿名函数内部调用函数)

   onUpdate:function():void{this.onUpdateProgress(getTimer());}

这是我自定义的Progressbar mxml:

<?xml version="1.0" encoding="utf-8"?>
<mx:ProgressBar xmlns:fx="http://ns.adobe.com/mxml/2009" 
                xmlns:s="library://ns.adobe.com/flex/spark" 
                xmlns:mx="library://ns.adobe.com/flex/mx"
                indeterminate="false" labelPlacement="center" fontWeight="bold" textDecoration="none" fontStyle="normal" textAlign="center"
                chromeColor="0xFFFFFF" mode="manual"
                >
    <fx:Script>
        <![CDATA[
            import caurina.transitions.Tweener;

            import flash.utils.getTimer;
            public var cancel:Boolean = false;

            public const MESSAGE_TYPE_DELETE:String = "Delete";
            public const MESSAGE_TYPE_REMOVE:String = "Remove";
            public const MESSAGE_TYPE_COLLECT:String = "Collect";
            public const MESSAGE_TYPE_MAINTAIN:String = "Maintain";
            public const MESSAGE_TYPE_BUILD:String = "Build";
            public const MESSAGE_TYPE_CONSTRUCT:String = "Construct";

            private var _orgMessage:String;
            private var _newMessage:String;
            private var _completeMessage:String;

            private var _lastValue:uint;
            private var _tweenCompleted:Boolean;


            private function onUpdateProgress(value:Number):void{

                var txt:String;

                if (!cancel){

UPDATE3: 以下是我设置进度的地方

                    this.setProgress(value,_lastValue);

                    if (value == _lastValue){
                        txt = _completeMessage;
                        _tweenCompleted = true;
                    }else{
                        txt = _newMessage;
                    }                   

                    label = txt + ":" + int(this.percentComplete).toString() + "%";
                    trace(value,_lastValue,this.percentComplete);
                }
            }
            private function onComplete():void{
                _tweenCompleted = true;
                label = _completeMessage + ": 100%";
                trace("completed");
            } 
            public function startProgress(message:String,duration:int = 2):void{

                _tweenCompleted = false;
                _lastValue = getTimer() + duration * 1000;
                _newMessage = ((message.charAt(message.length - 1) == "e")?message.substr(0,message.length - 1):message) + "ing";
                _completeMessage = "Completed";

                Tweener.addTween(this,
                        {
                            time:duration,
                            onUpdate:function():void{this.onUpdateProgress(getTimer());},
                            onComplete:this.onComplete(),
                            transition:"liner"
                        }
                    );
            }
        ]]>
    </fx:Script>
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
</mx:ProgressBar>

主要mxml

        protected function startProgress(event:MouseEvent):void
        {
            this.removeAllElements();
            pb = null;

            pb = new FGProgressBar();
            this.addElement(pb);
            pb.startProgress("Remove",5);

        }

我在onUpdateProgress()

中有跟踪命令
  trace(value,_lastValue,this.percentComplete);
  • value是当前进度值,我正在传递getTimer()
  • _lastValue是进度条的总值,这是在初始化中设置的(getTimer()+ duration * 1000)
  • percentComplete是进度状态,应在setProgress()
  • 之后增加

它的推荐是这样的

.
.
.
.
.

5162 8130 0
5210 8130 0
5244 8130 0
5754 8130 0
6262 8130 0
6771 8130 0
7279 8130 0
7787 8130 0
8295 8130 0

如果您注意到跟踪,则值会递增,但percentComplete为0

有人可以告诉我我错过了什么吗?

2 个答案:

答案 0 :(得分:1)

我使用过Flex SDK 4.6.0,代码适用于我:

FGProgressBar.mxml

 <?xml version="1.0" encoding="utf-8"?>
 <mx:ProgressBar xmlns:fx="http://ns.adobe.com/mxml/2009" 
            xmlns:s="library://ns.adobe.com/flex/spark" 
            xmlns:mx="library://ns.adobe.com/flex/mx"
            indeterminate="false" labelPlacement="center" fontWeight="bold" textDecoration="none" fontStyle="normal" textAlign="center"
            chromeColor="0xFFFFFF" mode="manual"
            >
<fx:Script>
    <![CDATA[
        import caurina.transitions.Tweener;

        import flash.utils.getTimer;
        public var cancel:Boolean = false;

        public const MESSAGE_TYPE_DELETE:String = "Delete";
        public const MESSAGE_TYPE_REMOVE:String = "Remove";
        public const MESSAGE_TYPE_COLLECT:String = "Collect";
        public const MESSAGE_TYPE_MAINTAIN:String = "Maintain";
        public const MESSAGE_TYPE_BUILD:String = "Build";
        public const MESSAGE_TYPE_CONSTRUCT:String = "Construct";

        private var _orgMessage:String;
        private var _newMessage:String;
        private var _completeMessage:String;

        private var _lastValue:uint;
        private var _tweenCompleted:Boolean;


        private function onUpdateProgress(value:Number):void{

            var txt:String;

            if (!cancel){
                this.setProgress(value,_lastValue);

                if (value == _lastValue){
                    txt = _completeMessage;
                    _tweenCompleted = true;
                }else{
                    txt = _newMessage;
                }                   

                label = txt + ":" + int(this.percentComplete).toString() + "%";
                trace(value,_lastValue,this.percentComplete);
            }
        }
        private function onComplete():void{
            _tweenCompleted = true;
            label = _completeMessage + ": 100%";
            trace("completed");
        } 
        public function startProgress(message:String,duration:int = 2):void{

            _tweenCompleted = false;
            _lastValue = getTimer() + duration * 1000;
            _newMessage = ((message.charAt(message.length - 1) == "e")?message.substr(0,message.length - 1):message) + "ing";
            _completeMessage = "Completed";

            Tweener.addTween(this,
                {
                    time:duration,
                    onUpdate:function():void{this.onUpdateProgress(getTimer());},
                    onComplete:this.onComplete(),
                    transition:"liner"
                }
            );
        }
    ]]>
</fx:Script>
<fx:Declarations>
    <!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
</mx:ProgressBar>

Main.mxml

 <?xml version="1.0"?>
 <s:Application 
xmlns:fx="http://ns.adobe.com/mxml/2009" 
xmlns:mx="library://ns.adobe.com/flex/mx" 
xmlns:s="library://ns.adobe.com/flex/spark" 
height="600">
<fx:Script><![CDATA[

    protected function startProgress(event:MouseEvent):void
    {
        this.removeAllElements();
        var pb:FGProgressBar = null;

        pb = new FGProgressBar();
        this.addElement(pb);
        pb.startProgress("Remove",5);           
    }

]]></fx:Script>

<s:Button click="startProgress(event)"/>
</s:Application>

答案 1 :(得分:0)

尝试设置mode =“manual”

<mx:ProgressBar 
    id              = "idPercent"
    labelPlacement  = "center"
    mode            = "manual"/>