From f0317eaf14353a1fde8c16237fd5cb1fd1b9e1d0 Mon Sep 17 00:00:00 2001 From: Vick Scarlet Date: Wed, 1 Dec 2021 16:07:03 +0800 Subject: [PATCH] add message popup --- laya/pages/view/MessagePopup.ui | 50 ++++++++++++++++++++++++++++ src/app.js | 5 +++ src/i18n/en-us.js | 6 ++++ src/i18n/zh-cn.js | 6 ++++ src/ui/layaUI.max.all.js | 22 ++++++++++++ src/ui/themes/cyber/achievement.js | 1 + src/ui/themes/cyber/property.js | 5 +-- src/ui/themes/cyber/talent.js | 12 ++++++- src/ui/themes/default/achievement.js | 1 + src/ui/themes/default/property.js | 5 +-- src/ui/themes/default/talent.js | 12 ++++++- src/ui/themes/message.js | 18 ++++++++++ src/ui/themes/views.js | 4 +++ 13 files changed, 141 insertions(+), 6 deletions(-) create mode 100644 laya/pages/view/MessagePopup.ui create mode 100644 src/ui/themes/message.js diff --git a/laya/pages/view/MessagePopup.ui b/laya/pages/view/MessagePopup.ui new file mode 100644 index 0000000..593deeb --- /dev/null +++ b/laya/pages/view/MessagePopup.ui @@ -0,0 +1,50 @@ +{ + "x":0, + "type":"View", + "selectedBox":1, + "selecteID":1, + "props":{"width":1100,"sceneColor":"#000000","mouseThrough":true,"mouseEnabled":false,"height":150}, + "nodeParent":-1, + "label":"View", + "isOpen":true, + "isDirectory":true, + "isAniNode":true, + "hasChild":true, + "compId":1, + "child":[ + { + "x":15, + "type":"Box", + "props":{"var":"boxBg","top":10,"runtime":"Laya.runtime.ColorfulBox","right":10,"name":"boxBg","left":10,"bottom":10,"alpha":0.75}, + "nodeParent":1, + "label":"Box(boxBg)", + "isDirectory":false, + "isAniNode":true, + "hasChild":false, + "compId":3, + "child":[ + ] + }, + { + "x":15, + "type":"Label", + "props":{"var":"message","text":"消息","right":50,"name":"message","left":50,"fontSize":60,"font":"SimHei","color":"#ffffff","centerY":0,"align":"center"}, + "nodeParent":1, + "label":"Label(message)", + "isDirectory":false, + "isAniNode":true, + "hasChild":false, + "compId":2, + "child":[ + ] + }], + "animations":[ + { + "nodes":[ + ], + "name":"ani1", + "id":1, + "frameRate":24, + "action":0 + }] +} \ No newline at end of file diff --git a/src/app.js b/src/app.js index f91bee7..887cad1 100644 --- a/src/app.js +++ b/src/app.js @@ -119,6 +119,11 @@ class App{ $$on('achievement', achievement => { $ui.popup(UI.popups.ACHIEVEMENT, {achievement}); }) + $$on('message', ([message, ...args]) => { + $ui.popup(UI.popups.MESSAGE, {message: $_.format( + $lang[message], ...args + ) }); + }) } async start({ diff --git a/src/i18n/en-us.js b/src/i18n/en-us.js index e8e0547..1130091 100644 --- a/src/i18n/en-us.js +++ b/src/i18n/en-us.js @@ -119,7 +119,13 @@ export default ({ UI_Support_Programmer: 'Programmer', UI_Support_Designer: 'Designer', + M_NoRank: 'There is no rank', + F_RemakeTimes: 'Remake {0} Times', F_AchievementCount: 'Achievement {0}', F_TalentSelection: '{name} ({description})', + F_TalentConflict: 'Conflict with talent ({0})', + F_TalentSelectLimit: 'Talent select limit {0}', + F_TalentSelectNotComplect: 'Please select {0} talent', + F_PropertyPointLeft: 'You have left {0} property point' }); \ No newline at end of file diff --git a/src/i18n/zh-cn.js b/src/i18n/zh-cn.js index 3878d58..975ab9b 100644 --- a/src/i18n/zh-cn.js +++ b/src/i18n/zh-cn.js @@ -119,7 +119,13 @@ export default ({ UI_Support_Programmer: '打赏程序(顿顿饭)', UI_Support_Designer: '打赏策划(爱发电)', + M_NoRank: '别卷了，没有排行榜', + F_RemakeTimes: '已重开{0}次', F_AchievementCount: '成就达成{0}个', F_TalentSelection: '{name}（{description}）', + F_TalentConflict: '与已选的「{0}」天赋冲突', + F_TalentSelectLimit: '只能选 {0} 个天赋', + F_TalentSelectNotComplect: '要选满{0}个天赋', + F_PropertyPointLeft: '你还有 {0} 属性点没有分配完' }); \ No newline at end of file diff --git a/src/ui/layaUI.max.all.js b/src/ui/layaUI.max.all.js index 8b388b0..fb5a254 100644 --- a/src/ui/layaUI.max.all.js +++ b/src/ui/layaUI.max.all.js @@ -514,4 +514,26 @@ var LoadingUI=(function(_super){ LoadingUI.uiView={"type":"View","props":{"width":1125,"runtime":"Laya.runtime.ViewBase","height":2436},"child":[{"type":"Sprite","props":{"y":0,"x":0,"alpha":0.3},"child":[{"type":"Rect","props":{"width":2000,"lineWidth":1,"height":3000,"fillColor":"#000000"}}]},{"type":"Box","props":{"width":200,"scaleY":2,"scaleX":2,"height":200,"centerY":0,"centerX":0},"child":[{"type":"Animation","props":{"y":100,"x":100,"source":"view/CyberTheme/animation/circleFlash.ani","autoPlay":true}},{"type":"Image","props":{"skin":"images/resource/circle.png","renderType":"mask"}}]},{"type":"Label","props":{"text":"UI_Loading","fontSize":80,"font":"Impact","color":"#ffffff","centerY":400,"centerX":0}}]}; return LoadingUI; + })(View); +var MessagePopupUI=(function(_super){ + function MessagePopupUI(){ + + this.boxBg=null; + this.message=null; + + MessagePopupUI.__super.call(this); + } + + CLASS$(MessagePopupUI,'ui.view.MessagePopupUI',_super); + var __proto__=MessagePopupUI.prototype; + __proto__.createChildren=function(){ + View.regComponent("Laya.runtime.ColorfulBox",Laya.runtime.ColorfulBox); + + laya.ui.Component.prototype.createChildren.call(this); + this.createView(MessagePopupUI.uiView); + + } + + MessagePopupUI.uiView={"type":"View","props":{"width":1100,"mouseThrough":true,"mouseEnabled":false,"height":150},"child":[{"type":"Box","props":{"var":"boxBg","top":10,"runtime":"Laya.runtime.ColorfulBox","right":10,"name":"boxBg","left":10,"bottom":10,"alpha":0.75}},{"type":"Label","props":{"var":"message","text":"消息","right":50,"name":"message","left":50,"fontSize":60,"font":"SimHei","color":"#ffffff","centerY":0,"align":"center"}}]}; + return MessagePopupUI; })(View); \ No newline at end of file diff --git a/src/ui/themes/cyber/achievement.js b/src/ui/themes/cyber/achievement.js index 0c74866..1ba8854 100644 --- a/src/ui/themes/cyber/achievement.js +++ b/src/ui/themes/cyber/achievement.js @@ -7,6 +7,7 @@ export default class CyberAchievement extends ui.view.CyberTheme.CyberAchievemen this.#state = {min, max}; this.btnStatistics.on(Laya.Event.CLICK, this, ()=>this.switch('statistics')); this.btnAchievement.on(Laya.Event.CLICK, this, ()=>this.switch('achievement')); + this.btnRank.on(Laya.Event.CLICK, this, $$event, ['message', ['M_NoRank']]); this.listAchievements.renderHandler = new Laya.Handler(this, this.onRenderAchievement); this.listAchievements.scrollBar.elasticDistance = 150; diff --git a/src/ui/themes/cyber/property.js b/src/ui/themes/cyber/property.js index b20e205..dc6f783 100644 --- a/src/ui/themes/cyber/property.js +++ b/src/ui/themes/cyber/property.js @@ -57,8 +57,9 @@ export default class CyberProperty extends ui.view.CyberTheme.CyberPropertyUI { } next() { - if (this.total < this.#propertyPoints) { - return; + const left = this.#propertyPoints - this.total; + if (left > 0) { + return $$event('message', ['F_PropertyPointLeft', left]); } $ui.switchView( UI.pages.TRAJECTORY, diff --git a/src/ui/themes/cyber/talent.js b/src/ui/themes/cyber/talent.js index e914630..5f7da29 100644 --- a/src/ui/themes/cyber/talent.js +++ b/src/ui/themes/cyber/talent.js @@ -36,7 +36,7 @@ export default class CyberTalent extends ui.view.CyberTheme.CyberTalentUI { onClickNext() { if(this.#selected.size < core.talentSelectLimit) { - return; + return $$event('message', ['F_TalentSelectNotComplect', core.talentSelectLimit]); } const talents = [...this.#selected].map(index => this.listTalents.array[index]); @@ -97,6 +97,16 @@ export default class CyberTalent extends ui.view.CyberTheme.CyberTalentUI { this.#selected.delete(index); } else { if(this.#selected.size >= core.talentSelectLimit) { + return $$event('message', ['F_TalentSelectLimit', core.talentSelectLimit]); + } + const exclusive = core.exclusive( + [...this.#selected].map(index => this.listTalents.array[index].id), + this.listTalents.array[index].id + ); + if(exclusive != null) { + for(const {name, id} of this.listTalents.array) + if(exclusive == id) + return $$event('message', ['F_TalentConflict', name]); return; } this.#selected.add(index); diff --git a/src/ui/themes/default/achievement.js b/src/ui/themes/default/achievement.js index 6a5f6d6..f8ca2c7 100644 --- a/src/ui/themes/default/achievement.js +++ b/src/ui/themes/default/achievement.js @@ -2,6 +2,7 @@ export default class Achievement extends ui.view.DefaultTheme.AchievementUI { constructor() { super(); this.btnBack.on(Laya.Event.CLICK, this, () => $ui.switchView(UI.pages.MAIN)); + this.btnRank.on(Laya.Event.CLICK, this, $$event, ['message', ['M_NoRank']]); this.listAchievements.renderHandler = new Laya.Handler(this, this.onRenderAchievement); this.listAchievements.scrollBar.elasticDistance = 150; } diff --git a/src/ui/themes/default/property.js b/src/ui/themes/default/property.js index 812e311..41fe4ac 100644 --- a/src/ui/themes/default/property.js +++ b/src/ui/themes/default/property.js @@ -57,8 +57,9 @@ export default class Property extends ui.view.DefaultTheme.PropertyUI { } next() { - if (this.total < this.#propertyPoints) { - return; + const left = this.#propertyPoints - this.total; + if (left > 0) { + return $$event('message', ['F_PropertyPointLeft', left]); } $ui.switchView( UI.pages.TRAJECTORY, diff --git a/src/ui/themes/default/talent.js b/src/ui/themes/default/talent.js index 9ab841d..048cd25 100644 --- a/src/ui/themes/default/talent.js +++ b/src/ui/themes/default/talent.js @@ -26,7 +26,7 @@ export default class Talent extends ui.view.DefaultTheme.TalentUI { onClickNext() { if(this.#selected.size < core.talentSelectLimit) { - return; + return $$event('message', ['F_TalentSelectNotComplect', core.talentSelectLimit]); } const talents = [...this.#selected].map(index => this.listTalents.array[index]); @@ -53,6 +53,16 @@ export default class Talent extends ui.view.DefaultTheme.TalentUI { this.#selected.delete(index); } else { if(this.#selected.size >= core.talentSelectLimit) { + return $$event('message', ['F_TalentSelectLimit', core.talentSelectLimit]); + } + const exclusive = core.exclusive( + [...this.#selected].map(index => this.listTalents.array[index].id), + this.listTalents.array[index].id + ); + if(exclusive != null) { + for(const {name, id} of this.listTalents.array) + if(exclusive == id) + return $$event('message', ['F_TalentConflict', name]); return; } this.#selected.add(index); diff --git a/src/ui/themes/message.js b/src/ui/themes/message.js new file mode 100644 index 0000000..dd42d0b --- /dev/null +++ b/src/ui/themes/message.js @@ -0,0 +1,18 @@ +export default class MessagePopup extends ui.view.MessagePopupUI { + constructor() { + super(); + this.left = this.right = 0; + this.boxBg.defaultColor = "#000000"; + this.boxBg.hoverColor = "#000000"; + this.boxBg.radius = 20; + } + + async popup({message}, parent) { + Laya.Tween.clearAll(this); + this.alpha = 0; + this.y = - 2 * this.height; + this.message.text = message; + await Laya.promises.Tween.to(this, { y: 0, alpha: 1 }, 300, Laya.Ease.backOut), + await Laya.promises.Tween.to(this, { alpha: 0}, 300, Laya.Ease.strongIn, 3000); + } +} \ No newline at end of file diff --git a/src/ui/themes/views.js b/src/ui/themes/views.js index 5fe1eb7..0b61046 100644 --- a/src/ui/themes/views.js +++ b/src/ui/themes/views.js @@ -11,6 +11,7 @@ const pages = { const popups = { ACHIEVEMENT: 'POPUP_ACHIEVEMENT', + MESSAGE: 'POPUP_MESSAGE', }; const cyber = { @@ -26,6 +27,7 @@ const cyber = { }, popups: { [popups.ACHIEVEMENT]: "cyber/popup/achievementPopup", + [popups.MESSAGE]: "message", }, configs: { bgColor: '#04131f', @@ -100,6 +102,7 @@ const dark = { }, popups: { [popups.ACHIEVEMENT]: "default/popup/achievementPopup", + [popups.MESSAGE]: "message", }, configs: { bgColor: '#222831', @@ -475,6 +478,7 @@ const light = { }, popups: { [popups.ACHIEVEMENT]: "default/popup/achievementPopup", + [popups.MESSAGE]: "message", }, configs: { bgColor: '#ffffff',