Add: key color

This commit is contained in:
2018-06-12 18:40:27 +09:00
parent 7907ae34cf
commit dc957debe9
3 changed files with 204 additions and 91 deletions
+91 -6
View File
@@ -1,23 +1,94 @@
class KeyButton {
constructor(x, y, width, height, normalText, shiftText, alignType) {
constructor(x, y, width, height, normalText, shiftText, handSide, fingerType, alignType) {
this.normalText = normalText;
this.shiftText = shiftText;
this.handSide = handSide;
this.fingerType = fingerType;
this.alignType = alignType;
this.setting = new RoundRectButtonSetting(x, y, width, height, KeyButton.DEFALUT_ROUND_AMOUNT_PX);
this.setting.strokeWidthPx = 2;
this.button = this.makeButtonSprite(this.setting);
this.button.inputEnabled = true;
this.buttonSolid = this.makeButtonSolidSprite(this.setting);
if(handSide == KeyButton.LEFT_HAND)
this.setNormalColor();
else
this.setPressedColor();
this.buttonStroke = this.makeButtonStrokeSprite(this.setting);
this.buttonText = this.makeText(this.setting, this.normalText);
if(this.normalText.length > 0) {
this.button.addChild(this.buttonText);
this.buttonStroke.addChild(this.buttonText);
}
}
makeButtonSprite(setting) {
setNormalColor() {
switch(this.fingerType) {
case KeyButton.THUMB:
this.buttonSolid.tint = 0x604d4d;
break;
case KeyButton.INDEX_FINGER:
this.buttonSolid.tint = 0x4d604d;
break;
case KeyButton.MIDDLE_FINGER:
this.buttonSolid.tint = 0x4d4d60;
break;
case KeyButton.RING_FINGER:
this.buttonSolid.tint = 0x60604d;
break;
case KeyButton.LITTLE_FINGER:
this.buttonSolid.tint = 0x4d6060;
break;
}
}
setPressedColor() {
switch(this.fingerType) {
case KeyButton.THUMB:
this.buttonSolid.tint = 0xff8080;
break;
case KeyButton.INDEX_FINGER:
this.buttonSolid.tint = 0x80ff80;
break;
case KeyButton.MIDDLE_FINGER:
this.buttonSolid.tint = 0x8080ff;
break;
case KeyButton.RING_FINGER:
this.buttonSolid.tint = 0xffff80;
break;
case KeyButton.LITTLE_FINGER:
this.buttonSolid.tint = 0x80ffff;
break;
}
}
makeButtonSolidSprite(setting) {
let btnTexture = new Phaser.Graphics()
.beginFill(0xffffff, 0.5)
// .lineStyle(setting.strokeWidthPx, 0xFFffff, 1)
.drawRoundedRect(0, 0, setting.width, setting.height, setting.roundAmount)
.endFill()
.generateTexture();
return game.add.sprite(
setting.x, // - setting.width / 2,
setting.y, // - setting.height / 2,
btnTexture
);
}
makeButtonStrokeSprite(setting) {
let btnTexture = new Phaser.Graphics()
.lineStyle(setting.strokeWidthPx, 0xFFffff, 1)
.drawRoundedRect(0, 0, setting.width, setting.height, setting.roundAmount)
@@ -76,6 +147,8 @@ class KeyButton {
this.buttonText.text = this.normalText;
}
mouseOut() {
this.text.fill = this.setting.textColors.out;
this.buttonStroke.tint = this.setting.strokeColors.out;
@@ -123,4 +196,16 @@ KeyButton.NORMAL_KEY = "normal_key";
KeyButton.NORMAL_FUNCTION_KEY = "normal_function_key";
KeyButton.LEFT_FUNCTION_KEY = "left_function_key";
KeyButton.CENTER_FUNCTION_KEY = "center_function_key";
KeyButton.RIGHT_FUNCTION_KEY = "right_function_key";
KeyButton.RIGHT_FUNCTION_KEY = "right_function_key";
KeyButton.NONE_HAND = 0;
KeyButton.LEFT_HAND = 1;
KeyButton.RIGHT_HAND = 2;
KeyButton.BOTH_HAND = 3;
KeyButton.THUMB = 0;
KeyButton.INDEX_FINGER = 1;
KeyButton.MIDDLE_FINGER = 2;
KeyButton.RING_FINGER = 3;
KeyButton.LITTLE_FINGER = 4;