Fix: make game app button and typing app button smaller

This commit is contained in:
2018-09-01 15:11:59 +09:00
parent 5ff260f05f
commit 29539e9ce7
8 changed files with 100 additions and 78 deletions
+17 -2
View File
@@ -53,6 +53,21 @@ class GameAppButton extends RoundRectButton {
break;
}
setting.fontStyle = {
font: "24px Arial",
boundsAlignH: "center", // left, center. right
boundsAlignV: "middle", // top, middle, bottom
fill: "#fff"
};
let textCount = buttonText.length;
if(textCount > 7)
setting.fontStyle.font = "18px Arial";
else if(textCount > 5)
setting.fontStyle.font = "22px Arial";
else
setting.fontStyle.font = "24px Arial";
super(setting, iconName, buttonText, clickEvent);
}
@@ -62,8 +77,8 @@ GameAppButton.TYPE_MOUSE_APP = 0;
GameAppButton.TYPE_TYPING_PRACTICE = 1;
GameAppButton.TYPE_TYPING_APP = 2;
GameAppButton.BUTTON_WIDTH = 150;
GameAppButton.BUTTON_HEIGHT = 150;
GameAppButton.BUTTON_WIDTH = 120;
GameAppButton.BUTTON_HEIGHT = 120;
GameAppButton.BUTTON_GAP = 20;
GameAppButton.MARGIN_VERTICAL = 100;
+54
View File
@@ -0,0 +1,54 @@
class TypingAppButton extends RoundRectButton {
constructor(x, y, iconName, buttonText, clickEvent) {
let setting = new RoundRectButtonSetting(x, y, TypingAppButton.BUTTON_WIDTH, TypingAppButton.BUTTON_HEIGHT);
setting.fontStyle.boundsAlignH = "center"; // left, center. right
setting.fontStyle.boundsAlignV = "middle"; // top, middle, bottom
setting.strokeWidthPx = 5;
setting.setStrokeColor(
0x444488,
0x6666aa,
0x6666aa,
0x333333
);
setting.setButtonColor(
0xaaaadd,
0xddddff,
0xddddff,
0x666666
);
setting.setTextColor(
"#844",
"#a66",
"#a66",
"#333"
);
setting.fontStyle = {
font: "22px Arial",
boundsAlignH: "center", // left, center. right
boundsAlignV: "middle", // top, middle, bottom
fill: "#fff"
};
super(setting, iconName, buttonText, clickEvent);
if(iconName.length > 0) {
let iconImage = game.add.sprite(0, 0, iconName);
iconImage.width = 80;
iconImage.height = 80;
this.button.setIcon(iconImage);
}
}
}
TypingAppButton.BUTTON_WIDTH = 160;
TypingAppButton.BUTTON_HEIGHT = 80;
TypingAppButton.BUTTON_GAP = 10;
TypingAppButton.MARGIN_VERTICAL = 100;
TypingAppButton.BUTTON_UPPER_POS_Y = 200;
TypingAppButton.BUTTON_LOWER_POS_Y = 480;
@@ -1,48 +0,0 @@
class TypingPracticeButton extends RoundRectButton {
constructor(x, y, iconName, buttonText, clickEvent) {
let setting = new RoundRectButtonSetting(x, y, TypingPracticeButton.BUTTON_WIDTH, TypingPracticeButton.BUTTON_HEIGHT);
setting.fontStyle.boundsAlignH = "center"; // left, center. right
setting.fontStyle.boundsAlignV = "middle"; // top, middle, bottom
setting.strokeWidthPx = 5;
setting.setStrokeColor(
0x444488,
0x6666aa,
0x6666aa,
0x333333
);
setting.setButtonColor(
0xaaaadd,
0xddddff,
0xddddff,
0x666666
);
setting.setTextColor(
"#844",
"#a66",
"#a66",
"#333"
);
super(setting, iconName, buttonText, clickEvent);
if(iconName.length > 0) {
let icon_fullscreen = game.add.sprite(0, 0, iconName);
icon_fullscreen.width = 80;
icon_fullscreen.height = 80;
this.button.setIcon(icon_fullscreen);
}
}
}
TypingPracticeButton.BUTTON_WIDTH = 200;
TypingPracticeButton.BUTTON_HEIGHT = 100;
TypingPracticeButton.BUTTON_GAP = 10;
TypingPracticeButton.MARGIN_VERTICAL = 100;
TypingPracticeButton.BUTTON_UPPER_POS_Y = 200;
TypingPracticeButton.BUTTON_LOWER_POS_Y = 480;