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