Add: RoundRectButton

2018-05-01 19:14:06 +09:00
parent 581efd0777
commit eb4eafd7b5
9 changed files with 202 additions and 37 deletions
@@ -1,3 +1,71 @@
+class RectSetting {
+
+
+
+  constructor(width, height, buttonColors) {
+    this.width = width;
+    this.height = height;
+
+    this.DEFAULT_BUTTON_COLORS = {
+      over: "#fff",  // over
+      out: "#aaf",  // out
+      down: "#faa",  // down
+      disabled: "#333"   // disabled
+    };
+
+    this.DEFAULT_TEXT_COLORS = {
+      over: "#000",  // over
+      out: "#000",  // out
+      down: "#000",  // down
+      disabled: "#999"   // disabled
+    };
+
+    if(buttonColors != null)
+      this.buttonColors = buttonColors;
+    else
+      this.buttonColors = RectSetting.DEFAULT_BUTTON_COLORS;
+  }
+}
+
+RectSetting.DEFAULT_BUTTON_COLORS = {
+  over: "#fff",  // over
+  out: "#aaf",  // out
+  down: "#faa",  // down
+  disabled: "#333"   // disabled
+};
+
+RectSetting.DEFAULT_TEXT_COLORS = {
+  over: "#000",  // over
+  out: "#000",  // out
+  down: "#000",  // down
+  disabled: "#999"   // disabled
+};
+
+
+class RoundRectButton {
+  constructor(roundRectSetting) {
+    var outSprite = this.makeSprite(
+      roundRectSetting.width, roundRectSetting.height,
+      roundRectSetting.buttonColors.out
+    );
+
+    outSprite.x = 100;
+    outSprite.y = 100;
+  }
+
+  makeSprite(width, height, color) {
+    // create a new bitmap data object
+    var bmd = game.add.bitmapData(width, height);
+    bmd.ctx.beginPath();
+    bmd.ctx.rect(0, 0, width, height);
+    bmd.ctx.fillStyle = RectSetting.DEFAULT_BUTTON_COLORS.out;
+    bmd.ctx.fill();
+
+    return game.add.sprite(-1000, -1000, bmd);
+  }
+}
+
+/*
 var DEFAULT_BUTTON_COLORS = [
  "#fff",  // over
  "#aaf",  // out
@@ -38,21 +106,19 @@ function RoundRectButton(roundRectSetting) {

 // use the bitmap data as the texture for the sprite

-  /*
-  var newTextStyle = $.extend( {}, textStyleBasic);
-  newTextStyle.font = "bold 28px Arial";
+  // var newTextStyle = $.extend( {}, textStyleBasic);
+  // newTextStyle.font = "bold 28px Arial";

-  this.buttonText = game.add.text(0, 0, text, newTextStyle);
-  this.buttonText.addColor("#a0d", 0)
-  this.buttonText.anchor.setTo(0.5, 0.4);
+  // this.buttonText = game.add.text(0, 0, text, newTextStyle);
+  // this.buttonText.addColor("#a0d", 0)
+  // this.buttonText.anchor.setTo(0.5, 0.4);

-  this.startButton = game.add.button(x, y, 'button', callback, this, 2, 1, 0);
-  this.startButton.anchor.set(0.5);
-  this.startButton.inputEnabled = true;
-  this.startButton.input.priorityId = 1;
-  this.startButton.input.useHandCursor = true;
-  this.startButton.addChild(this.buttonText);
-  */
+  // this.startButton = game.add.button(x, y, 'button', callback, this, 2, 1, 0);
+  // this.startButton.anchor.set(0.5);
+  // this.startButton.inputEnabled = true;
+  // this.startButton.input.priorityId = 1;
+  // this.startButton.input.useHandCursor = true;
+  // this.startButton.addChild(this.buttonText);

  var overSprite = this.makeSprite(roundRectSetting.width, roundRectSetting.height, roundRectSetting.color[0]);
  var outSprite = this.makeSprite(roundRectSetting.width, roundRectSetting.height, roundRectSetting.color[1]);
@@ -84,3 +150,4 @@ RoundRectButton.prototype.makeSprite = function(width, height, color) {

  return game.add.sprite(300, 300, bmd);
 }
+*/