jisangs/chocomae
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix: apply RoundRectButton

Browse Source
This commit is contained in:
Jisang Park
2018-05-06 13:48:45 +09:00
parent 0acec6ee1a
commit 8236002b7c
5 changed files with 1528 additions and 1572 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/game/lib/input_type_text.js
+1375 -1406
View File
File diff suppressed because it is too large Load Diff
src/game/lib/round_rect_button.js
+101 -101
View File
@@ -1,41 +1,41 @@
class RoundRectButtonSetting {
constructor(width, height, roundAmount) {
this.width = width;
this.height = height;
this.roundAmount = 0;
if(typeof roundAmount === "undefined") {
let shorterSide = width > height ? height : width;
this.roundAmount = shorterSide * 0.1;
} else {
this.roundAmount = roundAmount;
}
constructor(width, height, roundAmount) {
this.width = width;
this.height = height;
this.roundAmount = 0;
if(typeof roundAmount === "undefined") {
let shorterSide = width > height ? height : width;
this.roundAmount = shorterSide * 0.1;
} else {
this.roundAmount = roundAmount;
}
this.buttonColors = RoundRectButtonSetting.DEFAULT_BUTTON_COLORS;
this.textColors = RoundRectButtonSetting.DEFAULT_TEXT_COLORS;
this.fontStyle = RoundRectButtonSetting.DEFAULT_TEXT_FONT;
};
this.buttonColors = RoundRectButtonSetting.DEFAULT_BUTTON_COLORS;
this.textColors = RoundRectButtonSetting.DEFAULT_TEXT_COLORS;
this.fontStyle = RoundRectButtonSetting.DEFAULT_TEXT_FONT;
};
}
RoundRectButtonSetting.DEFAULT_BUTTON_COLORS = {
out: 0xffffff,
over: 0xddffdd,
down: 0xaaffaa,
disabled: 0x333333
out: 0xffffff,
over: 0xddffdd,
down: 0xaaffaa,
disabled: 0x333333
};
RoundRectButtonSetting.DEFAULT_TEXT_COLORS = {
out: "#000",
over: "#333",
down: "#666",
disabled: "#999"
out: "#000",
over: "#333",
down: "#666",
disabled: "#999"
};
RoundRectButtonSetting.DEFAULT_TEXT_FONT = {
font: "30px Arial",
align: "center",
fill: "#fff"
font: "30px Arial",
align: "center",
fill: "#fff"
};
RoundRectButtonSetting.DEFAULT_LINE_SPACING = -10; // pixels
@@ -44,106 +44,106 @@ RoundRectButtonSetting.WHITE = 0xffffff;
class RoundRectButton {
constructor(roundRectSetting, buttonText, clickEvent) {
this.setting = roundRectSetting;
this.clickEvent = clickEvent;
constructor(roundRectSetting, buttonText, clickEvent) {
this.setting = roundRectSetting;
this.clickEvent = clickEvent;
this.button = this.makeSprite();
this.text = this.makeText(buttonText);
this.button = this.makeSprite();
this.text = this.makeText(buttonText);
this.button.addChild(this.text);
this.button.anchor.setTo(0.5, 0.5);
this.button.addChild(this.text);
this.button.anchor.setTo(0.5, 0.5);
this.inputEnabled = true;
this.setEventMethod();
this.inputEnabled = true;
this.setEventMethod();
this.mouseOut();
}
this.mouseOut();
}
setEventMethod() {
this.button.events.onInputOver.add(function() {
this.mouseOver();
}, this);
setEventMethod() {
this.button.events.onInputOver.add(function() {
this.mouseOver();
}, this);
this.button.events.onInputOut.add(function() {
this.mouseOut();
}, this);
this.button.events.onInputOut.add(function() {
this.mouseOut();
}, this);
this.button.events.onInputDown.add(function() {
this.mouseDown();
this.button.events.onInputDown.add(function() {
this.mouseDown();
if(this.clickEvent) {
this.clickEvent();
}
}, this);
if(this.clickEvent) {
this.clickEvent();
}
}, this);
this.button.events.onInputUp.add(function() {
this.mouseOver();
}, this);
}
this.button.events.onInputUp.add(function() {
this.mouseOver();
}, this);
}
makeSprite() {
let btnTexture = new Phaser.Graphics()
.beginFill(RoundRectButtonSetting.WHITE)
.drawRoundedRect(0, 0, this.setting.width, this.setting.height, this.setting.roundAmount)
.endFill()
.generateTexture();
makeSprite() {
let btnTexture = new Phaser.Graphics()
.beginFill(RoundRectButtonSetting.WHITE)
.drawRoundedRect(0, 0, this.setting.width, this.setting.height, this.setting.roundAmount)
.endFill()
.generateTexture();
return game.add.sprite(0, 0, btnTexture);
}
return game.add.sprite(0, 0, btnTexture);
}
makeText(textContent) {
let btnText = game.add.text(0, 0, textContent, this.setting.fontStyle);
btnText.anchor.setTo(0.5);
btnText.lineSpacing = RoundRectButtonSetting.DEFAULT_LINE_SPACING;
makeText(textContent) {
let btnText = game.add.text(0, 0, textContent, this.setting.fontStyle);
btnText.anchor.setTo(0.5);
btnText.lineSpacing = RoundRectButtonSetting.DEFAULT_LINE_SPACING;
return btnText;
}
return btnText;
}
mouseOut() {
this.button.tint = this.setting.buttonColors.out;
this.text.fill = this.setting.textColors.out;
}
mouseOut() {
this.button.tint = this.setting.buttonColors.out;
this.text.fill = this.setting.textColors.out;
}
mouseOver() {
this.button.tint = this.setting.buttonColors.over;
this.text.fill = this.setting.textColors.over;
}
mouseOver() {
this.button.tint = this.setting.buttonColors.over;
this.text.fill = this.setting.textColors.over;
}
mouseDown() {
this.button.tint = this.setting.buttonColors.down;
this.text.fill = this.setting.textColors.down;
}
mouseDown() {
this.button.tint = this.setting.buttonColors.down;
this.text.fill = this.setting.textColors.down;
}
buttonDisabled() {
this.button.tint = this.setting.buttonColors.disabled;
this.text.fill = this.setting.textColors.disabled;
}
buttonDisabled() {
this.button.tint = this.setting.buttonColors.disabled;
this.text.fill = this.setting.textColors.disabled;
}
move(x, y) {
this.button.x = x;
this.button.y = y;
}
move(x, y) {
this.button.x = x;
this.button.y = y;
}
get inputEnabled() {
return this.button.inputEnabled;
}
get inputEnabled() {
return this.button.inputEnabled;
}
set inputEnabled(isEnabled) {
this.button.inputEnabled = isEnabled;
set inputEnabled(isEnabled) {
this.button.inputEnabled = isEnabled;
if(isEnabled === true) {
this.mouseOut();
} else {
this.buttonDisabled();
}
}
if(isEnabled === true) {
this.mouseOut();
} else {
this.buttonDisabled();
}
}
set lineSpacing(spacingInPixels) {
this.text.lineSpacing = spacingInPixels;
}
set lineSpacing(spacingInPixels) {
this.text.lineSpacing = spacingInPixels;
}
}