1 /****************************************************************************
  2  Copyright (c) 2011-2012 cocos2d-x.org
  3  Copyright (c) 2013-2014 Chukong Technologies Inc.
  4 
  5  http://www.cocos2d-x.org
  6 
  7  Permission is hereby granted, free of charge, to any person obtaining a copy
  8  of this software and associated documentation files (the "Software"), to deal
  9  in the Software without restriction, including without limitation the rights
 10  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 11  copies of the Software, and to permit persons to whom the Software is
 12  furnished to do so, subject to the following conditions:
 13 
 14  The above copyright notice and this permission notice shall be included in
 15  all copies or substantial portions of the Software.
 16 
 17  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 18  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 19  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 20  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 21  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 22  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 23  THE SOFTWARE.
 24  ****************************************************************************/
 25 
 26 /**
 27  * The Slider control of Cocos UI.
 28  * @class
 29  * @extends ccui.Widget
 30  *
 31  * @property {Number}   percent     - The current progress of loadingbar
 32  */
 33 ccui.Slider = ccui.Widget.extend(/** @lends ccui.Slider# */{
 34     _barRenderer: null,
 35     _progressBarRenderer: null,
 36     _progressBarTextureSize: null,
 37     _slidBallNormalRenderer: null,
 38     _slidBallPressedRenderer: null,
 39     _slidBallDisabledRenderer: null,
 40     _slidBallRenderer: null,
 41     _barLength: 0,
 42     _percent: 0,
 43     _scale9Enabled: false,
 44     _prevIgnoreSize: true,
 45     _textureFile: "",
 46     _progressBarTextureFile: "",
 47     _slidBallNormalTextureFile: "",
 48     _slidBallPressedTextureFile: "",
 49     _slidBallDisabledTextureFile: "",
 50     _capInsetsBarRenderer: null,
 51     _capInsetsProgressBarRenderer: null,
 52     _sliderEventListener: null,
 53     _sliderEventSelector: null,
 54     _barTexType: ccui.Widget.LOCAL_TEXTURE,
 55     _progressBarTexType: ccui.Widget.LOCAL_TEXTURE,
 56     _ballNTexType: ccui.Widget.LOCAL_TEXTURE,
 57     _ballPTexType: ccui.Widget.LOCAL_TEXTURE,
 58     _ballDTexType: ccui.Widget.LOCAL_TEXTURE,
 59     _isTextureLoaded: false,
 60     _className: "Slider",
 61     _barRendererAdaptDirty: true,
 62     _progressBarRendererDirty: true,
 63 
 64     /**
 65      * allocates and initializes a UISlider.
 66      * Constructor of ccui.Slider. override it to extend the construction behavior, remember to call "this._super()" in the extended "ctor" function.
 67      * @example
 68      * // example
 69      * var uiSlider = new ccui.Slider();
 70      */
 71     ctor: function () {
 72         this._progressBarTextureSize = cc.size(0, 0);
 73         this._capInsetsBarRenderer = cc.rect(0, 0, 0, 0);
 74         this._capInsetsProgressBarRenderer = cc.rect(0, 0, 0, 0);
 75         ccui.Widget.prototype.ctor.call(this);
 76     },
 77 
 78     /**
 79      * Initializes a ccui.Slider. Please do not call this function by yourself, you should pass the parameters to constructor to initialize it.
 80      * @returns {boolean}
 81      * @override
 82      */
 83     init: function () {
 84         return ccui.Widget.prototype.init.call(this);
 85     },
 86 
 87     _initRenderer: function () {
 88         this._barRenderer = cc.Sprite.create();
 89         this._progressBarRenderer = cc.Sprite.create();
 90         this._progressBarRenderer.setAnchorPoint(0.0, 0.5);
 91         this.addProtectedChild(this._barRenderer, ccui.Slider.BASEBAR_RENDERER_ZORDER, -1);
 92         this.addProtectedChild(this._progressBarRenderer, ccui.Slider.PROGRESSBAR_RENDERER_ZORDER, -1);
 93         this._slidBallNormalRenderer = cc.Sprite.create();
 94         this._slidBallPressedRenderer = cc.Sprite.create();
 95         this._slidBallPressedRenderer.setVisible(false);
 96         this._slidBallDisabledRenderer = cc.Sprite.create();
 97         this._slidBallDisabledRenderer.setVisible(false);
 98         this._slidBallRenderer = new cc.Node();
 99         this._slidBallRenderer.addChild(this._slidBallNormalRenderer);
100         this._slidBallRenderer.addChild(this._slidBallPressedRenderer);
101         this._slidBallRenderer.addChild(this._slidBallDisabledRenderer);
102         this.addProtectedChild(this._slidBallRenderer, ccui.Slider.BALL_RENDERER_ZORDER, -1);
103     },
104 
105     /**
106      * Loads texture for slider bar.
107      * @param {String} fileName
108      * @param {ccui.Widget.LOCAL_TEXTURE|ccui.Widget.PLIST_TEXTURE} texType
109      */
110     loadBarTexture: function (fileName, texType) {
111         if (!fileName) {
112             return;
113         }
114         texType = texType || ccui.Widget.LOCAL_TEXTURE;
115         this._textureFile = fileName;
116         this._barTexType = texType;
117         var barRenderer = this._barRenderer;
118 
119         var self = this;
120         if(!barRenderer.texture || !barRenderer.texture.isLoaded()){
121             barRenderer.addLoadedEventListener(function(){
122                 self._findLayout();
123                 self._updateChildrenDisplayedRGBA();
124 
125                 self._barRendererAdaptDirty = true;
126                 self._progressBarRendererDirty = true;
127                 self._updateContentSizeWithTextureSize(self._barRenderer.getContentSize());
128             });
129         }
130 
131         switch (this._barTexType) {
132             case ccui.Widget.LOCAL_TEXTURE:
133                 //SetTexture cannot load resource
134                 barRenderer.initWithFile(fileName);
135                 break;
136             case ccui.Widget.PLIST_TEXTURE:
137                 //SetTexture cannot load resource
138                 barRenderer.initWithSpriteFrameName(fileName);
139                 break;
140             default:
141                 break;
142         }
143         this._updateChildrenDisplayedRGBA();
144 
145         this._barRendererAdaptDirty = true;
146         this._progressBarRendererDirty = true;
147         this._updateContentSizeWithTextureSize(this._barRenderer.getContentSize());
148     },
149 
150     /**
151      * Loads dark state texture for slider progress bar.
152      * @param {String} fileName
153      * @param {ccui.Widget.LOCAL_TEXTURE|ccui.Widget.PLIST_TEXTURE} texType
154      */
155     loadProgressBarTexture: function (fileName, texType) {
156         if (!fileName) {
157             return;
158         }
159         texType = texType || ccui.Widget.LOCAL_TEXTURE;
160         this._progressBarTextureFile = fileName;
161         this._progressBarTexType = texType;
162         var progressBarRenderer = this._progressBarRenderer;
163 
164         var self = this;
165         if(!progressBarRenderer.texture || !progressBarRenderer.texture.isLoaded()){
166             progressBarRenderer.addLoadedEventListener(function(){
167                 self._findLayout();
168                 self._updateChildrenDisplayedRGBA();
169 
170                 self._progressBarRenderer.setAnchorPoint(cc.p(0, 0.5));
171                 var tz = self._progressBarRenderer.getContentSize();
172                 self._progressBarTextureSize = {width: tz.width, height: tz.height};
173                 self._progressBarRendererDirty = true;
174             });
175         }
176 
177         switch (this._progressBarTexType) {
178             case ccui.Widget.LOCAL_TEXTURE:
179                 //SetTexture cannot load resource
180                 progressBarRenderer.initWithFile(fileName);
181                 break;
182             case ccui.Widget.PLIST_TEXTURE:
183                 //SetTexture cannot load resource
184                 progressBarRenderer.initWithSpriteFrameName(fileName);
185                 break;
186             default:
187                 break;
188         }
189         this._updateChildrenDisplayedRGBA();
190 
191         this._progressBarRenderer.setAnchorPoint(cc.p(0, 0.5));
192         var tz = this._progressBarRenderer.getContentSize();
193         this._progressBarTextureSize = {width: tz.width, height: tz.height};
194         this._progressBarRendererDirty = true;
195     },
196 
197     /**
198      * Sets if slider is using scale9 renderer.
199      * @param {Boolean} able
200      */
201     setScale9Enabled: function (able) {
202         if (this._scale9Enabled == able)
203             return;
204 
205         this._scale9Enabled = able;
206         this.removeProtectedChild(this._barRenderer, true);
207         this.removeProtectedChild(this._progressBarRenderer, true);
208         this._barRenderer = null;
209         this._progressBarRenderer = null;
210         if (this._scale9Enabled) {
211             this._barRenderer = new ccui.Scale9Sprite();
212             this._progressBarRenderer = new ccui.Scale9Sprite();
213         } else {
214             this._barRenderer = cc.Sprite.create();
215             this._progressBarRenderer = cc.Sprite.create();
216         }
217         this.loadBarTexture(this._textureFile, this._barTexType);
218         this.loadProgressBarTexture(this._progressBarTextureFile, this._progressBarTexType);
219         this.addProtectedChild(this._barRenderer, ccui.Slider.BASEBAR_RENDERER_ZORDER, -1);
220         this.addProtectedChild(this._progressBarRenderer, ccui.Slider.PROGRESSBAR_RENDERER_ZORDER, -1);
221         if (this._scale9Enabled) {
222             var ignoreBefore = this._ignoreSize;
223             this.ignoreContentAdaptWithSize(false);
224             this._prevIgnoreSize = ignoreBefore;
225         } else {
226             this.ignoreContentAdaptWithSize(this._prevIgnoreSize);
227         }
228         this.setCapInsetsBarRenderer(this._capInsetsBarRenderer);
229         this.setCapInsetProgressBarRenderer(this._capInsetsProgressBarRenderer);
230     },
231 
232     /**
233      * Returns slider is using scale9 renderer or not.
234      * @returns {Boolean}
235      */
236     isScale9Enabled: function () {
237         return this._scale9Enabled;
238     },
239 
240     /**
241      * override "ignoreContentAdaptWithSize" method of widget.
242      * @param {Boolean} ignore
243      */
244     ignoreContentAdaptWithSize: function (ignore) {
245         if (!this._scale9Enabled || (this._scale9Enabled && !ignore)) {
246             ccui.Widget.prototype.ignoreContentAdaptWithSize.call(this, ignore);
247             this._prevIgnoreSize = ignore;
248         }
249     },
250 
251     /**
252      * Sets capinsets for slider, if slider is using scale9 renderer.
253      * @param {cc.Rect} capInsets
254      */
255     setCapInsets: function (capInsets) {
256         this.setCapInsetsBarRenderer(capInsets);
257         this.setCapInsetProgressBarRenderer(capInsets);
258     },
259 
260     /**
261      * Sets capinsets for slider's renderer, if slider is using scale9 renderer.
262      * @param {cc.Rect} capInsets
263      */
264     setCapInsetsBarRenderer: function (capInsets) {
265         if(!capInsets)
266             return;
267         var locInsets = this._capInsetsBarRenderer;
268         locInsets.x = capInsets.x;
269         locInsets.y = capInsets.y;
270         locInsets.width = capInsets.width;
271         locInsets.height = capInsets.height;
272         if (!this._scale9Enabled)
273             return;
274         this._barRenderer.setCapInsets(capInsets);
275     },
276 
277     /**
278      * Returns cap insets for slider.
279      * @returns {cc.Rect}
280      */
281     getCapInsetsBarRenderer: function () {
282         return cc.rect(this._capInsetsBarRenderer);
283     },
284 
285     /**
286      * Sets capinsets of ProgressBar for slider, if slider is using scale9 renderer.
287      * @param {cc.Rect} capInsets
288      */
289     setCapInsetProgressBarRenderer: function (capInsets) {
290         if(!capInsets)
291             return;
292         var locInsets = this._capInsetsProgressBarRenderer;
293         locInsets.x = capInsets.x;
294         locInsets.y = capInsets.y;
295         locInsets.width = capInsets.width;
296         locInsets.height = capInsets.height;
297         if (!this._scale9Enabled)
298             return;
299         this._progressBarRenderer.setCapInsets(capInsets);
300     },
301 
302     /**
303      * Returns cap insets of ProgressBar for slider.
304      * @returns {cc.Rect}
305      */
306     getCapInsetsProgressBarRenderer: function () {
307         return cc.rect(this._capInsetsProgressBarRenderer);
308     },
309 
310     /**
311      * Loads textures for slider ball.
312      * @param {String} normal
313      * @param {String} pressed
314      * @param {String} disabled
315      * @param {ccui.Widget.LOCAL_TEXTURE|ccui.Widget.PLIST_TEXTURE} texType
316      */
317     loadSlidBallTextures: function (normal, pressed, disabled, texType) {
318         this.loadSlidBallTextureNormal(normal, texType);
319         this.loadSlidBallTexturePressed(pressed, texType);
320         this.loadSlidBallTextureDisabled(disabled, texType);
321     },
322 
323     /**
324      * Loads normal state texture for slider ball.
325      * @param {String} normal
326      * @param {ccui.Widget.LOCAL_TEXTURE|ccui.Widget.PLIST_TEXTURE} texType
327      */
328     loadSlidBallTextureNormal: function (normal, texType) {
329         if (!normal) {
330             return;
331         }
332         texType = texType || ccui.Widget.LOCAL_TEXTURE;
333         this._slidBallNormalTextureFile = normal;
334         this._ballNTexType = texType;
335 
336         var self = this;
337         if(!this._slidBallNormalRenderer.texture || !this._slidBallNormalRenderer.texture.isLoaded()){
338             this._slidBallNormalRenderer.addLoadedEventListener(function(){
339                 self._updateChildrenDisplayedRGBA();
340             });
341         }
342 
343         switch (this._ballNTexType) {
344             case ccui.Widget.LOCAL_TEXTURE:
345                 //SetTexture cannot load resource
346                 this._slidBallNormalRenderer.initWithFile(normal);
347                 break;
348             case ccui.Widget.PLIST_TEXTURE:
349                 //SetTexture cannot load resource
350                 this._slidBallNormalRenderer.initWithSpriteFrameName(normal);
351                 break;
352             default:
353                 break;
354         }
355         this._updateChildrenDisplayedRGBA();
356     },
357 
358     /**
359      * Loads selected state texture for slider ball.
360      * @param {String} pressed
361      * @param {ccui.Widget.LOCAL_TEXTURE|ccui.Widget.PLIST_TEXTURE} texType
362      */
363     loadSlidBallTexturePressed: function (pressed, texType) {
364         if (!pressed) {
365             return;
366         }
367         texType = texType || ccui.Widget.LOCAL_TEXTURE;
368         this._slidBallPressedTextureFile = pressed;
369         this._ballPTexType = texType;
370 
371         var self = this;
372         if(!this._slidBallPressedRenderer.texture || !this._slidBallPressedRenderer.texture.isLoaded()){
373             this._slidBallPressedRenderer.addLoadedEventListener(function(){
374 
375                 self._updateChildrenDisplayedRGBA();
376             });
377         }
378 
379         switch (this._ballPTexType) {
380             case ccui.Widget.LOCAL_TEXTURE:
381                 //SetTexture cannot load resource
382                 this._slidBallPressedRenderer.initWithFile(pressed);
383                 break;
384             case ccui.Widget.PLIST_TEXTURE:
385                 //SetTexture cannot load resource
386                 this._slidBallPressedRenderer.initWithSpriteFrameName(pressed);
387                 break;
388             default:
389                 break;
390         }
391         this._updateChildrenDisplayedRGBA();
392     },
393 
394     /**
395      * Load dark state texture for slider ball.
396      * @param {String} disabled
397      * @param {ccui.Widget.LOCAL_TEXTURE|ccui.Widget.PLIST_TEXTURE} texType
398      */
399     loadSlidBallTextureDisabled: function (disabled, texType) {
400         if (!disabled) {
401             return;
402         }
403         texType = texType || ccui.Widget.LOCAL_TEXTURE;
404         this._slidBallDisabledTextureFile = disabled;
405         this._ballDTexType = texType;
406 
407         var self = this;
408         if(!this._slidBallDisabledRenderer.texture || !this._slidBallDisabledRenderer.texture.isLoaded()){
409             this._slidBallDisabledRenderer.addLoadedEventListener(function(){
410 
411                 self._updateChildrenDisplayedRGBA();
412             });
413         }
414 
415         switch (this._ballDTexType) {
416             case ccui.Widget.LOCAL_TEXTURE:
417                 //SetTexture cannot load resource
418                 this._slidBallDisabledRenderer.initWithFile(disabled);
419                 break;
420             case ccui.Widget.PLIST_TEXTURE:
421                 //SetTexture cannot load resource
422                 this._slidBallDisabledRenderer.initWithSpriteFrameName(disabled);
423                 break;
424             default:
425                 break;
426         }
427         this._updateChildrenDisplayedRGBA();
428     },
429 
430     /**
431      * Changes the progress direction of slider.
432      * @param {number} percent
433      */
434     setPercent: function (percent) {
435         if (percent > 100)
436             percent = 100;
437         if (percent < 0)
438             percent = 0;
439         this._percent = percent;
440         var res = percent / 100.0;
441         var dis = this._barLength * res;
442         this._slidBallRenderer.setPosition(cc.p(dis, this._contentSize.height / 2));
443         if (this._scale9Enabled)
444             this._progressBarRenderer.setPreferredSize(cc.size(dis, this._progressBarTextureSize.height));
445         else {
446             var spriteRenderer = this._progressBarRenderer;
447             var rect = spriteRenderer.getTextureRect();
448             spriteRenderer.setTextureRect(
449                 cc.rect(rect.x, rect.y, dis, rect.height),
450                 spriteRenderer.isTextureRectRotated()
451             );
452         }
453     },
454 
455     /**
456      * test the point whether location in loadingBar's bounding box.
457      * @override
458      * @param {cc.Point} pt
459      * @returns {boolean}
460      */
461     hitTest: function(pt){
462         var nsp = this._slidBallNormalRenderer.convertToNodeSpace(pt);
463         var ballSize = this._slidBallNormalRenderer.getContentSize();
464         var ballRect = cc.rect(0,0, ballSize.width, ballSize.height);
465 //        if (ballRect.containsPoint(nsp)) {
466         return (nsp.x >= ballRect.x &&
467             nsp.x <= (ballRect.x + ballRect.width) &&
468             nsp.y >= ballRect.y &&
469             nsp.y <= (ballRect.y +ballRect.height));
470     },
471 
472     onTouchBegan: function (touch, event) {
473         var pass = ccui.Widget.prototype.onTouchBegan.call(this, touch, event);
474         if (this._hit) {
475             var nsp = this.convertToNodeSpace(this._touchBeganPosition);
476             this.setPercent(this._getPercentWithBallPos(nsp.x));
477             this._percentChangedEvent();
478         }
479         return pass;
480     },
481 
482     onTouchMoved: function (touch, event) {
483         var touchPoint = touch.getLocation();
484         var nsp = this.convertToNodeSpace(touchPoint);
485         this.setPercent(this._getPercentWithBallPos(nsp.x));
486         this._percentChangedEvent();
487     },
488 
489     onTouchEnded: function (touch, event) {
490         ccui.Widget.prototype.onTouchEnded.call(this, touch, event);
491     },
492 
493     onTouchCancelled: function (touch, event) {
494         ccui.Widget.prototype.onTouchCancelled.call(this, touch, event);
495     },
496 
497     /**
498      * Returns percent with ball's position.
499      * @param {cc.Point} px
500      * @returns {number}
501      */
502     _getPercentWithBallPos: function (px) {
503         return ((px/this._barLength)*100);
504     },
505 
506     /**
507      * add event listener
508      * @param {Function} selector
509      * @param {Object} [target=]
510      * @deprecated since v3.0, please use addEventListener instead.
511      */
512     addEventListenerSlider: function (selector, target) {
513         this.addEventListener(selector, target);
514     },
515 
516     /**
517      * Adds a callback
518      * @param {Function} selector
519      * @param {Object} [target=]
520      */
521     addEventListener: function(selector, target){
522         this._sliderEventSelector = selector;
523         this._sliderEventListener = target;
524     },
525 
526     _percentChangedEvent: function () {
527         if(this._sliderEventSelector){
528             if (this._sliderEventListener)
529                 this._sliderEventSelector.call(this._sliderEventListener, this, ccui.Slider.EVENT_PERCENT_CHANGED);
530             else
531                 this._sliderEventSelector(this, ccui.Slider.EVENT_PERCENT_CHANGED);
532         }
533     },
534 
535     /**
536      * Gets the progress direction of slider.
537      * @returns {number}
538      */
539     getPercent: function () {
540         return this._percent;
541     },
542 
543     _onSizeChanged: function () {
544         ccui.Widget.prototype._onSizeChanged.call(this);
545         this._barRendererAdaptDirty = true;
546         this._progressBarRendererDirty = true;
547     },
548 
549     _adaptRenderers: function(){
550         if (this._barRendererAdaptDirty)
551         {
552             this._barRendererScaleChangedWithSize();
553             this._barRendererAdaptDirty = false;
554         }
555         if (this._progressBarRendererDirty)
556         {
557             this._progressBarRendererScaleChangedWithSize();
558             this._progressBarRendererDirty = false;
559         }
560     },
561 
562     /**
563      * Returns the content size of bar renderer.
564      * @returns {cc.Size}
565      */
566     getVirtualRendererSize: function(){
567         return this._barRenderer.getContentSize();
568     },
569 
570     /**
571      * Returns the bar renderer.
572      * @returns {cc.Node}
573      */
574     getVirtualRenderer: function () {
575         return this._barRenderer;
576     },
577 
578     _barRendererScaleChangedWithSize: function () {
579         if (this._ignoreSize) {
580             this._barRenderer.setScale(1.0);
581             this._barLength = this._contentSize.width;
582         }
583         else {
584             this._barLength = this._contentSize.width;
585             if (this._scale9Enabled) {
586                 this._barRenderer.setPreferredSize(this._contentSize);
587             }
588             else {
589                 var btextureSize = this._barRenderer.getContentSize();
590                 if (btextureSize.width <= 0.0 || btextureSize.height <= 0.0) {
591                     this._barRenderer.setScale(1.0);
592                     return;
593                 }
594                 var bscaleX = this._contentSize.width / btextureSize.width;
595                 var bscaleY = this._contentSize.height / btextureSize.height;
596                 this._barRenderer.setScaleX(bscaleX);
597                 this._barRenderer.setScaleY(bscaleY);
598             }
599         }
600         this._barRenderer.setPosition(this._contentSize.width / 2.0, this._contentSize.height / 2.0);
601         this.setPercent(this._percent);
602     },
603 
604     _progressBarRendererScaleChangedWithSize: function () {
605         if (this._ignoreSize) {
606             if (!this._scale9Enabled) {
607                 var ptextureSize = this._progressBarTextureSize;
608                 var pscaleX = this._contentSize.width / ptextureSize.width;
609                 var pscaleY = this._contentSize.height / ptextureSize.height;
610                 this._progressBarRenderer.setScaleX(pscaleX);
611                 this._progressBarRenderer.setScaleY(pscaleY);
612             }
613         }
614         else {
615             if (this._scale9Enabled) {
616                 this._progressBarRenderer.setPreferredSize(this._contentSize);
617                 this._progressBarTextureSize = this._progressBarRenderer.getContentSize();
618             }
619             else {
620                 var ptextureSize = this._progressBarTextureSize;
621                 if (ptextureSize.width <= 0.0 || ptextureSize.height <= 0.0) {
622                     this._progressBarRenderer.setScale(1.0);
623                     return;
624                 }
625                 var pscaleX = this._contentSize.width / ptextureSize.width;
626                 var pscaleY = this._contentSize.height / ptextureSize.height;
627                 this._progressBarRenderer.setScaleX(pscaleX);
628                 this._progressBarRenderer.setScaleY(pscaleY);
629             }
630         }
631         this._progressBarRenderer.setPosition(0.0, this._contentSize.height / 2.0);
632         this.setPercent(this._percent);
633     },
634 
635     _onPressStateChangedToNormal: function () {
636         this._slidBallNormalRenderer.setVisible(true);
637         this._slidBallPressedRenderer.setVisible(false);
638         this._slidBallDisabledRenderer.setVisible(false);
639     },
640 
641     _onPressStateChangedToPressed: function () {
642         this._slidBallNormalRenderer.setVisible(false);
643         this._slidBallPressedRenderer.setVisible(true);
644         this._slidBallDisabledRenderer.setVisible(false);
645     },
646 
647     _onPressStateChangedToDisabled: function () {
648         this._slidBallNormalRenderer.setVisible(false);
649         this._slidBallPressedRenderer.setVisible(false);
650         this._slidBallDisabledRenderer.setVisible(true);
651     },
652 
653     /**
654      * Returns the "class name" of ccui.LoadingBar.
655      * @returns {string}
656      */
657     getDescription: function () {
658         return "Slider";
659     },
660 
661     _createCloneInstance: function () {
662         return ccui.Slider.create();
663     },
664 
665     _copySpecialProperties: function (slider) {
666         this._prevIgnoreSize = slider._prevIgnoreSize;
667         this.setScale9Enabled(slider._scale9Enabled);
668         this.loadBarTexture(slider._textureFile, slider._barTexType);
669         this.loadProgressBarTexture(slider._progressBarTextureFile, slider._progressBarTexType);
670         this.loadSlidBallTextureNormal(slider._slidBallNormalTextureFile, slider._ballNTexType);
671         this.loadSlidBallTexturePressed(slider._slidBallPressedTextureFile, slider._ballPTexType);
672         this.loadSlidBallTextureDisabled(slider._slidBallDisabledTextureFile, slider._ballDTexType);
673         this.setPercent(slider.getPercent());
674         this._sliderEventListener = slider._sliderEventListener;
675         this._sliderEventSelector = slider._sliderEventSelector;
676 
677     }
678 });
679 
680 var _p = ccui.Slider.prototype;
681 
682 // Extended properties
683 /** @expose */
684 _p.percent;
685 cc.defineGetterSetter(_p, "percent", _p.getPercent, _p.setPercent);
686 
687 _p = null;
688 
689 /**
690  * allocates and initializes a UISlider.
691  * @deprecated since v3.0, please use new ccui.Slider() instead.
692  * @return {ccui.Slider}
693  * @example
694  * // example
695  * var uiSlider = ccui.Slider.create();
696  */
697 ccui.Slider.create = function () {
698     return new ccui.Slider();
699 };
700 
701 // Constant
702 //Slider event type
703 /**
704  * The percent change event flag of ccui.Slider.
705  * @constant
706  * @type {number}
707  */
708 ccui.Slider.EVENT_PERCENT_CHANGED = 0;
709 
710 //Render zorder
711 /**
712  * The zOrder value of ccui.Slider's base bar renderer.
713  * @constant
714  * @type {number}
715  */
716 ccui.Slider.BASEBAR_RENDERER_ZORDER = -3;
717 /**
718  * The zOrder value of ccui.Slider's progress bar renderer.
719  * @constant
720  * @type {number}
721  */
722 ccui.Slider.PROGRESSBAR_RENDERER_ZORDER = -2;
723 /**
724  * The zOrder value of ccui.Slider's ball renderer.
725  * @constant
726  * @type {number}
727  */
728 ccui.Slider.BALL_RENDERER_ZORDER = -1;