document.write('
Data hosted with ♥ by Pastebin.com - Download Raw - See Original
  1. var HelloWorldScene = cc.Scene.extend({
  2.     onEnter:function () {
  3.         this._super();
  4.         var layer = new ButtonLayer();
  5.         this.addChild(layer);
  6.     }
  7. });
  8.  
  9. var ButtonLayer = cc.Layer.extend({
  10.  
  11.     /**
  12.      * Width in pixels
  13.      */
  14.     maxWidth: 0,
  15.    
  16.     /**
  17.      * Height in pixels
  18.      */
  19.     maxHeight: 0,
  20.    
  21.     /**
  22.      * Small Button
  23.      */
  24.     button: null,
  25.    
  26.     /**
  27.      * Medium Button
  28.      */
  29.     buttonSmall: null,
  30.    
  31.     /**
  32.      * Large Button
  33.      */
  34.     buttonLarge: null,
  35.    
  36.     /**
  37.      * Constructor
  38.      */
  39.     ctor: function () {
  40.         this._super();
  41.         this.init();
  42.     },
  43.  
  44.     /**
  45.      * Init
  46.      */
  47.     init: function () {
  48.         this.maxWidth = cc.director.getWinSizeInPixels().width;
  49.         this.maxHeight = cc.director.getWinSizeInPixels().height;
  50.         this.scheduleUpdate();
  51.     },
  52.    
  53.     /**
  54.      * Update function
  55.      */
  56.     update: function () {
  57.        
  58.         if (this.button == null || this.buttonSmall == null || this.buttonLarge == null) {
  59.             // create buttons
  60.             this.button = this.createButton();
  61.             this.buttonSmall = this.createButton();
  62.             this.buttonLarge = this.createButton();
  63.            
  64.             // draw a button at location 10%,10% of the screen that\'s 10% of the screen wide and 10% of the screen high
  65.             this.drawButton(this.buttonSmall, this.getWidthPercent(10), this.getHeightPercent(10), this.getWidthPercent(10), this.getHeightPercent(10));
  66.            
  67.             // draw a button at location 10%,30% of the screen that\'s 30% of the screen wide and 20% of the screen high
  68.             this.drawButton(this.button, this.getWidthPercent(10), this.getHeightPercent(30), this.getWidthPercent(30), this.getHeightPercent(20));
  69.            
  70.             // draw a button at location 10%,60% of the screen that\'s 80% of the screen wide and 30% of the screen high
  71.             this.drawButton(this.buttonLarge, this.getWidthPercent(10), this.getHeightPercent(60), this.getWidthPercent(80), this.getHeightPercent(30));   
  72.         }
  73.  
  74.     },
  75.    
  76.     /**
  77.      * Draw a button
  78.      */
  79.     drawButton : function (button, x, y, scaleX, scaleY) {
  80.         button.setAnchorPoint(0,0);
  81.         button.setContentSize(scaleX, scaleY);
  82.         button.setPositionX(x);
  83.         button.setPositionY(y);
  84.         this.addChild(button);
  85.     },
  86.    
  87.     /**
  88.      * Create button
  89.      */
  90.     createButton: function () {
  91.         var rect = new cc.rect(2, 2, 44, 47); // hardcoded "magic numbers" don\'t do this in production
  92.         var capInsets = new cc.rect(8, 7, 32, 36); // hardcoded "magic numbers" don\'t do this in production
  93.         var button = cc.Scale9Sprite.create(res.BtnRedMatte9_png, rect, capInsets);
  94.         return button;
  95.     },
  96.    
  97.     getWidthPercent: function (percent) {
  98.         return percent / 100 * this.maxWidth;
  99.     },
  100.    
  101.     getHeightPercent: function (percent) {
  102.         return percent / 100 * this.maxHeight;
  103.     }
  104.    
  105. });
');