change popup message ui

laya/pages/view/CyberTheme/CyberMain.ui

@@ -2,7 +2,7 @@
     "x":0,
     "type":"View",
     "selectedBox":1,
-    "selecteID":83,
+    "selecteID":90,
     "props":{"y":1218,"x":562,"width":1125,"sceneColor":"#000000","sceneBg":"laya/views/view/CyberTheme/CyberMain.png","runtime":"Laya.runtime.ViewBase","height":2436,"anchorY":0.5,"anchorX":0.5},
     "nodeParent":-1,
     "label":"View",
@@ -18,14 +18,13 @@
             "props":{"var":"imgBg","skin":"images/background/background_1@3x.png","name":"imgBg","centerY":0,"centerX":0},
             "nodeParent":1,
             "label":"Image(imgBg)",
-            "isOpen":true,
+            "isOpen":false,
             "isDirectory":true,
             "isAniNode":true,
             "hasChild":true,
             "compId":67,
             "child":[
                 {
-                    "x":30,
                     "type":"Animation",
                     "props":{"y":0,"x":0,"width":1125,"source":"view/CyberTheme/animation/jumpBackground.ani","interval":80,"height":2436,"blendMode":"lighter","autoPlay":true,"alpha":0.3},
                     "nodeParent":67,
@@ -474,14 +473,13 @@
             "props":{"y":0,"x":1100,"width":1,"top":0,"right":0,"height":1},
             "nodeParent":1,
             "label":"Box",
-            "isOpen":true,
+            "isOpen":false,
             "isDirectory":true,
             "isAniNode":true,
             "hasChild":true,
             "compId":84,
             "child":[
                 {
-                    "x":30,
                     "type":"Box",
                     "props":{"y":200,"x":-200,"width":225,"var":"btnAchievement","runtime":"Laya.runtime.ScaleButton","name":"btnAchievement","height":90,"anchorY":0.5,"anchorX":0.5},
                     "nodeParent":84,
@@ -606,6 +604,96 @@
                                 ]
                         }]
                 }]
+        },
+        {
+            "x":15,
+            "type":"Box",
+            "props":{"right":0,"bottom":0},
+            "nodeParent":1,
+            "label":"Box",
+            "isOpen":true,
+            "isDirectory":true,
+            "isAniNode":true,
+            "hasChild":true,
+            "compId":88,
+            "child":[
+                {
+                    "x":30,
+                    "type":"Box",
+                    "props":{"y":-300,"x":-100,"width":110,"runtime":"Laya.runtime.ScaleButton","height":110,"anchorY":0.5,"anchorX":0.5},
+                    "nodeParent":88,
+                    "label":"Box",
+                    "isOpen":true,
+                    "isDirectory":true,
+                    "isAniNode":true,
+                    "hasChild":true,
+                    "compId":90,
+                    "child":[
+                        {
+                            "x":45,
+                            "type":"Box",
+                            "props":{"width":110,"var":"btnSaveLoad","runtime":"Laya.runtime.ColorfulBox","name":"btnSmall","height":110,"centerY":0,"centerX":0,"anchorY":0.5,"anchorX":0.5},
+                            "nodeParent":90,
+                            "label":"Box(btnSaveLoad)",
+                            "isOpen":true,
+                            "isDirectory":true,
+                            "isAniNode":true,
+                            "hasChild":true,
+                            "compId":91,
+                            "child":[
+                                {
+                                    "x":60,
+                                    "type":"Image",
+                                    "props":{"width":80,"skin":"images/icons/icon_save.png","height":80,"centerY":0,"centerX":0},
+                                    "nodeParent":91,
+                                    "label":"Image",
+                                    "isDirectory":false,
+                                    "isAniNode":true,
+                                    "hasChild":false,
+                                    "compId":92,
+                                    "child":[
+                                        ]
+                                }]
+                        }]
+                },
+                {
+                    "x":30,
+                    "type":"Box",
+                    "props":{"y":-175,"x":-100,"width":110,"runtime":"Laya.runtime.ScaleButton","height":110,"anchorY":0.5,"anchorX":0.5},
+                    "nodeParent":88,
+                    "label":"Box",
+                    "isOpen":true,
+                    "isDirectory":true,
+                    "isAniNode":true,
+                    "hasChild":true,
+                    "compId":89,
+                    "child":[
+                        {
+                            "x":45,
+                            "type":"Box",
+                            "props":{"width":110,"var":"btnThemes","runtime":"Laya.runtime.ColorfulBox","name":"btnThemes","height":110,"centerY":0,"centerX":0,"anchorY":0.5,"anchorX":0.5},
+                            "nodeParent":89,
+                            "label":"Box(btnThemes)",
+                            "isOpen":false,
+                            "isDirectory":true,
+                            "isAniNode":true,
+                            "hasChild":true,
+                            "compId":86,
+                            "child":[
+                                {
+                                    "type":"Image",
+                                    "props":{"width":90,"skin":"images/icons/icon_themes.png","height":90,"centerY":0,"centerX":0},
+                                    "nodeParent":86,
+                                    "label":"Image",
+                                    "isDirectory":false,
+                                    "isAniNode":true,
+                                    "hasChild":false,
+                                    "compId":87,
+                                    "child":[
+                                        ]
+                                }]
+                        }]
+                }]
         }],
     "animations":[
         {

laya/pages/view/DefaultTheme/Main.ui

@@ -1,8 +1,8 @@
 {
     "x":0,
     "type":"View",
-    "selectedBox":1,
+    "selectedBox":99,
-    "selecteID":83,
+    "selecteID":100,
     "props":{"y":1218,"x":562,"width":1125,"sceneColor":"#000000","runtime":"Laya.runtime.ViewBase","height":2436,"anchorY":0.5,"anchorX":0.5},
     "nodeParent":-1,
     "label":"View",
@@ -15,9 +15,9 @@
         {
             "x":15,
             "type":"Label",
-            "props":{"var":"labTitle","text":"UI_Title_Remake","name":"labTitle","fontSize":130,"font":"SimHei","color":"#ffffff","centerY":-260,"centerX":0,"bold":true,"anchorY":0.5,"anchorX":0.5},
+            "props":{"text":"UI_Title_Remake","name":"title","fontSize":130,"font":"SimHei","color":"#ffffff","centerY":-260,"centerX":0,"bold":true,"anchorY":0.5,"anchorX":0.5},
             "nodeParent":1,
-            "label":"Label(labTitle)",
+            "label":"Label(title)",
             "isDirectory":false,
             "isAniNode":true,
             "hasChild":false,
@@ -28,7 +28,7 @@
         {
             "x":15,
             "type":"Label",
-            "props":{"wordWrap":true,"var":"labSubTitle","text":"UI_Title_Subsequent","right":0,"name":"labSubTitle","left":0,"fontSize":70,"font":"SimHei","color":"#999999","centerY":-120,"anchorY":0.5,"anchorX":0.5,"align":"center"},
+            "props":{"wordWrap":true,"var":"labSubTitle","text":"UI_Title_Subsequent","right":0,"name":"title","left":0,"fontSize":70,"font":"SimHei","color":"#999999","centerY":-120,"anchorY":0.5,"anchorX":0.5,"align":"center"},
             "nodeParent":1,
             "label":"Label(labSubTitle)",
             "isDirectory":false,
@@ -195,14 +195,13 @@
             "props":{"width":160,"left":50,"height":160,"bottom":50},
             "nodeParent":1,
             "label":"Box",
-            "isOpen":true,
+            "isOpen":false,
             "isDirectory":true,
             "isAniNode":true,
             "hasChild":true,
             "compId":92,
             "child":[
                 {
-                    "x":30,
                     "type":"Box",
                     "props":{"width":160,"var":"btnDiscord","runtime":"Laya.runtime.ScaleButton","name":"btnDiscord","height":160,"centerY":0,"centerX":0,"anchorY":0.5,"anchorX":0.5},
                     "nodeParent":92,
@@ -226,6 +225,57 @@
                                 ]
                         }]
                 }]
+        },
+        {
+            "x":15,
+            "type":"Box",
+            "props":{"y":2201,"x":1020,"width":110,"var":"btnSaveLoad","runtime":"Laya.runtime.ColorfulBox","right":50,"name":"btnSmall","height":110,"bottom":180,"anchorY":0.5,"anchorX":0.5},
+            "nodeParent":1,
+            "label":"Box(btnSaveLoad)",
+            "isOpen":true,
+            "isDirectory":true,
+            "isAniNode":true,
+            "hasChild":true,
+            "compId":99,
+            "child":[
+                {
+                    "x":30,
+                    "type":"Image",
+                    "props":{"width":80,"skin":"images/icons/icon_save.png","height":80,"centerY":0,"centerX":0},
+                    "nodeParent":99,
+                    "label":"Image",
+                    "isDirectory":false,
+                    "isAniNode":true,
+                    "hasChild":false,
+                    "compId":100,
+                    "child":[
+                        ]
+                }]
+        },
+        {
+            "x":15,
+            "type":"Box",
+            "props":{"width":110,"var":"btnThemes","runtime":"Laya.runtime.ColorfulBox","right":50,"name":"btnThemes","height":110,"bottom":50,"anchorY":0.5,"anchorX":0.5},
+            "nodeParent":1,
+            "label":"Box(btnThemes)",
+            "isOpen":false,
+            "isDirectory":true,
+            "isAniNode":true,
+            "hasChild":true,
+            "compId":96,
+            "child":[
+                {
+                    "type":"Image",
+                    "props":{"width":90,"skin":"images/icons/icon_themes.png","height":90,"centerY":0,"centerX":0},
+                    "nodeParent":96,
+                    "label":"Image",
+                    "isDirectory":false,
+                    "isAniNode":true,
+                    "hasChild":false,
+                    "compId":98,
+                    "child":[
+                        ]
+                }]
         }],
     "animations":[
         {

laya/pages/view/MessagePopup.ui

@@ -2,8 +2,8 @@
     "x":0,
     "type":"View",
     "selectedBox":1,
-    "selecteID":1,
+    "selecteID":2,
-    "props":{"width":1100,"sceneColor":"#000000","mouseThrough":true,"mouseEnabled":false,"height":150},
+    "props":{"width":1100,"sceneColor":"#000000","mouseThrough":true,"mouseEnabled":false,"height":230},
     "nodeParent":-1,
     "label":"View",
     "isOpen":true,
@@ -28,7 +28,7 @@
         {
             "x":15,
             "type":"Label",
-            "props":{"var":"message","text":"消息","right":50,"name":"message","left":50,"fontSize":60,"font":"SimHei","color":"#ffffff","centerY":0,"align":"center"},
+            "props":{"wordWrap":true,"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,

laya/pages/view/SaveLoad.ui

@@ -0,0 +1,251 @@
+{
+    "x":0,
+    "type":"Dialog",
+    "selectedBox":1,
+    "selecteID":15,
+    "props":{"width":645,"sceneColor":"#000000","height":250},
+    "nodeParent":-1,
+    "label":"Dialog",
+    "isOpen":true,
+    "isDirectory":true,
+    "isAniNode":true,
+    "hasChild":true,
+    "compId":1,
+    "child":[
+        {
+            "x":15,
+            "type":"Box",
+            "props":{"top":0,"right":0,"left":0,"bottom":150},
+            "nodeParent":1,
+            "label":"Box",
+            "isOpen":true,
+            "isDirectory":true,
+            "isAniNode":true,
+            "hasChild":true,
+            "compId":15,
+            "child":[
+                {
+                    "x":30,
+                    "type":"Box",
+                    "props":{"y":0,"x":0,"width":645,"height":2},
+                    "nodeParent":15,
+                    "label":"Box",
+                    "isOpen":null,
+                    "isDirectory":true,
+                    "isAniNode":true,
+                    "hasChild":true,
+                    "compId":19,
+                    "child":[
+                        {
+                            "type":"Rect",
+                            "props":{"width":645,"lineWidth":1,"height":2,"fillColor":"#97ffe6"},
+                            "nodeParent":19,
+                            "label":"Rect",
+                            "isDirectory":false,
+                            "isAniNode":true,
+                            "hasChild":false,
+                            "compId":17,
+                            "child":[
+                                ]
+                        }]
+                },
+                {
+                    "x":30,
+                    "type":"Box",
+                    "props":{"width":645,"height":2,"centerX":0,"bottom":0},
+                    "nodeParent":15,
+                    "label":"Box",
+                    "isOpen":null,
+                    "isDirectory":true,
+                    "isAniNode":true,
+                    "hasChild":true,
+                    "compId":20,
+                    "child":[
+                        {
+                            "type":"Rect",
+                            "props":{"width":645,"lineWidth":1,"height":2,"fillColor":"#97ffe6"},
+                            "nodeParent":20,
+                            "label":"Rect",
+                            "isDirectory":false,
+                            "isAniNode":true,
+                            "hasChild":false,
+                            "compId":21,
+                            "child":[
+                                ]
+                        }]
+                },
+                {
+                    "x":30,
+                    "type":"Box",
+                    "props":{"width":645,"height":100,"centerY":0,"centerX":0,"alpha":0.2},
+                    "nodeParent":15,
+                    "label":"Box",
+                    "isOpen":true,
+                    "isDirectory":true,
+                    "isAniNode":true,
+                    "hasChild":true,
+                    "compId":22,
+                    "child":[
+                        {
+                            "x":45,
+                            "type":"Rect",
+                            "props":{"width":645,"lineWidth":1,"height":100,"fillColor":"#000000"},
+                            "nodeParent":22,
+                            "label":"Rect",
+                            "isDirectory":false,
+                            "isAniNode":true,
+                            "hasChild":false,
+                            "compId":23,
+                            "child":[
+                                ]
+                        }]
+                }]
+        },
+        {
+            "x":15,
+            "type":"TextInput",
+            "props":{"wordWrap":false,"var":"input","valign":"middle","top":0,"text":"content","right":0,"overflow":"scroll","left":0,"fontSize":35,"font":"SimHei","color":"#ffffff","bottom":150},
+            "nodeParent":1,
+            "label":"TextInput(input)",
+            "isDirectory":false,
+            "isAniNode":true,
+            "hasChild":false,
+            "compId":4,
+            "child":[
+                ]
+        },
+        {
+            "x":15,
+            "type":"Box",
+            "props":{"width":120,"var":"btnSave","runtime":"Laya.runtime.ColorfulBox","name":"btnSmall","left":5,"height":120,"bottom":5,"anchorY":0.5,"anchorX":0.5},
+            "nodeParent":1,
+            "label":"Box(btnSave)",
+            "isOpen":false,
+            "isDirectory":true,
+            "isAniNode":true,
+            "hasChild":true,
+            "compId":5,
+            "child":[
+                {
+                    "type":"Label",
+                    "props":{"text":"UI_Save","name":"label","fontSize":50,"font":"SimHei","color":"#ffffff","centerY":0,"centerX":0,"bold":true,"anchorY":0.5,"anchorX":0.5},
+                    "nodeParent":5,
+                    "label":"Label(label)",
+                    "isDirectory":false,
+                    "isAniNode":true,
+                    "hasChild":false,
+                    "compId":7,
+                    "child":[
+                        ]
+                }]
+        },
+        {
+            "x":15,
+            "type":"Box",
+            "props":{"width":120,"var":"btnLoad","runtime":"Laya.runtime.ColorfulBox","name":"btnSmall","left":130,"height":120,"bottom":5,"anchorY":0.5,"anchorX":0.5},
+            "nodeParent":1,
+            "label":"Box(btnLoad)",
+            "isOpen":false,
+            "isDirectory":true,
+            "isAniNode":true,
+            "hasChild":true,
+            "compId":6,
+            "child":[
+                {
+                    "type":"Label",
+                    "props":{"text":"UI_Load","name":"label","fontSize":50,"font":"SimHei","color":"#ffffff","centerY":0,"centerX":0,"bold":true,"anchorY":0.5,"anchorX":0.5},
+                    "nodeParent":6,
+                    "label":"Label(label)",
+                    "isDirectory":false,
+                    "isAniNode":true,
+                    "hasChild":false,
+                    "compId":8,
+                    "child":[
+                        ]
+                }]
+        },
+        {
+            "x":15,
+            "type":"Box",
+            "props":{"y":335,"width":120,"var":"btnRead","runtime":"Laya.runtime.ColorfulBox","name":"btnSmall","left":260,"height":120,"bottom":5,"anchorY":0.5,"anchorX":0.5},
+            "nodeParent":1,
+            "label":"Box(btnRead)",
+            "isOpen":false,
+            "isDirectory":true,
+            "isAniNode":true,
+            "hasChild":true,
+            "compId":13,
+            "child":[
+                {
+                    "type":"Label",
+                    "props":{"text":"UI_Read","name":"label","fontSize":50,"font":"SimHei","color":"#ffffff","centerY":0,"centerX":0,"bold":true,"anchorY":0.5,"anchorX":0.5},
+                    "nodeParent":13,
+                    "label":"Label(label)",
+                    "isDirectory":false,
+                    "isAniNode":true,
+                    "hasChild":false,
+                    "compId":14,
+                    "child":[
+                        ]
+                }]
+        },
+        {
+            "x":15,
+            "type":"Box",
+            "props":{"y":335,"width":120,"var":"btnWrite","runtime":"Laya.runtime.ColorfulBox","name":"btnSmall","left":390,"height":120,"bottom":5,"anchorY":0.5,"anchorX":0.5},
+            "nodeParent":1,
+            "label":"Box(btnWrite)",
+            "isOpen":false,
+            "isDirectory":true,
+            "isAniNode":true,
+            "hasChild":true,
+            "compId":11,
+            "child":[
+                {
+                    "type":"Label",
+                    "props":{"text":"UI_Write","name":"label","fontSize":50,"font":"SimHei","color":"#ffffff","centerY":0,"centerX":0,"bold":true,"anchorY":0.5,"anchorX":0.5},
+                    "nodeParent":11,
+                    "label":"Label(label)",
+                    "isDirectory":false,
+                    "isAniNode":true,
+                    "hasChild":false,
+                    "compId":12,
+                    "child":[
+                        ]
+                }]
+        },
+        {
+            "x":15,
+            "type":"Box",
+            "props":{"y":10,"x":10,"width":120,"var":"btnClose","runtime":"Laya.runtime.ColorfulBox","right":5,"name":"btnSmall","height":120,"bottom":5,"anchorY":0.5,"anchorX":0.5},
+            "nodeParent":1,
+            "label":"Box(btnClose)",
+            "isOpen":false,
+            "isDirectory":true,
+            "isAniNode":true,
+            "hasChild":true,
+            "compId":9,
+            "child":[
+                {
+                    "type":"Label",
+                    "props":{"text":"×","name":"label","fontSize":50,"font":"SimHei","color":"#ffffff","centerY":0,"centerX":0,"bold":true,"anchorY":0.5,"anchorX":0.5},
+                    "nodeParent":9,
+                    "label":"Label(label)",
+                    "isDirectory":false,
+                    "isAniNode":true,
+                    "hasChild":false,
+                    "compId":10,
+                    "child":[
+                        ]
+                }]
+        }],
+    "animations":[
+        {
+            "nodes":[
+                ],
+            "name":"ani1",
+            "id":1,
+            "frameRate":24,
+            "action":0
+        }]
+}

laya/pages/view/Themes.ui

@@ -0,0 +1,141 @@
+{
+    "x":0,
+    "type":"Dialog",
+    "selectedBox":1,
+    "selecteID":13,
+    "props":{"width":350,"sceneColor":"#000000","height":550},
+    "nodeParent":-1,
+    "label":"Dialog",
+    "isOpen":true,
+    "isDirectory":true,
+    "isAniNode":true,
+    "hasChild":true,
+    "compId":1,
+    "child":[
+        {
+            "x":15,
+            "type":"Box",
+            "props":{"top":20,"right":20,"left":20,"bottom":130},
+            "nodeParent":1,
+            "label":"Box",
+            "isOpen":true,
+            "isDirectory":true,
+            "isAniNode":true,
+            "hasChild":true,
+            "compId":6,
+            "child":[
+                {
+                    "x":30,
+                    "type":"RadioGroup",
+                    "props":{"var":"radioTheme","name":"radioTheme","height":380,"centerY":0,"centerX":0},
+                    "nodeParent":6,
+                    "label":"RadioGroup(radioTheme)",
+                    "isOpen":true,
+                    "isDirectory":true,
+                    "isAniNode":true,
+                    "hasChild":true,
+                    "compId":13,
+                    "child":[
+                        {
+                            "x":45,
+                            "type":"Radio",
+                            "props":{"width":300,"top":0,"skin":"images/radio/radio_cyber.png","name":"item0","height":100},
+                            "nodeParent":13,
+                            "label":"Radio(item0)",
+                            "isDirectory":false,
+                            "isAniNode":true,
+                            "hasChild":false,
+                            "compId":10,
+                            "child":[
+                                ]
+                        },
+                        {
+                            "x":45,
+                            "type":"Radio",
+                            "props":{"width":300,"skin":"images/radio/radio_dark.png","name":"item1","height":100,"centerY":0},
+                            "nodeParent":13,
+                            "label":"Radio(item1)",
+                            "isDirectory":false,
+                            "isAniNode":true,
+                            "hasChild":false,
+                            "compId":11,
+                            "child":[
+                                ]
+                        },
+                        {
+                            "x":45,
+                            "type":"Radio",
+                            "props":{"width":300,"skin":"images/radio/radio_light.png","name":"item2","height":100,"bottom":0},
+                            "nodeParent":13,
+                            "label":"Radio(item2)",
+                            "isDirectory":false,
+                            "isAniNode":true,
+                            "hasChild":false,
+                            "compId":12,
+                            "child":[
+                                ]
+                        }]
+                }]
+        },
+        {
+            "x":15,
+            "type":"Box",
+            "props":{"width":90,"var":"btnOK","runtime":"Laya.runtime.ColorfulBox","name":"btnSmall","left":20,"height":90,"bottom":20,"anchorY":0.5,"anchorX":0.5},
+            "nodeParent":1,
+            "label":"Box(btnOK)",
+            "isOpen":true,
+            "isDirectory":true,
+            "isAniNode":true,
+            "hasChild":true,
+            "compId":2,
+            "child":[
+                {
+                    "x":30,
+                    "type":"Label",
+                    "props":{"text":"√","name":"label","fontSize":50,"font":"SimHei","color":"#ffffff","centerY":0,"centerX":0,"bold":true,"anchorY":0.5,"anchorX":0.5},
+                    "nodeParent":2,
+                    "label":"Label(label)",
+                    "isDirectory":false,
+                    "isAniNode":true,
+                    "hasChild":false,
+                    "compId":3,
+                    "child":[
+                        ]
+                }]
+        },
+        {
+            "x":15,
+            "type":"Box",
+            "props":{"width":90,"var":"btnClose","runtime":"Laya.runtime.ColorfulBox","right":20,"name":"btnSmall","height":90,"bottom":20,"anchorY":0.5,"anchorX":0.5},
+            "nodeParent":1,
+            "label":"Box(btnClose)",
+            "isOpen":true,
+            "isDirectory":true,
+            "isAniNode":true,
+            "hasChild":true,
+            "compId":14,
+            "child":[
+                {
+                    "x":30,
+                    "type":"Label",
+                    "props":{"text":"×","name":"label","fontSize":50,"font":"SimHei","color":"#ffffff","centerY":0,"centerX":0,"bold":true,"anchorY":0.5,"anchorX":0.5},
+                    "nodeParent":14,
+                    "label":"Label(label)",
+                    "isDirectory":false,
+                    "isAniNode":true,
+                    "hasChild":false,
+                    "compId":15,
+                    "child":[
+                        ]
+                }]
+        }],
+    "animations":[
+        {
+            "nodes":[
+                ],
+            "name":"ani1",
+            "id":1,
+            "frameRate":24,
+            "action":0
+        }]
+}

public/images/atlas/.rec

@@ -35,9 +35,11 @@ P 3FA91C13 icon_github.png
 P AB934AEA icon_int@3x.png
 P F1A0724B icon_mny@3x.png
 P D5AADAC9 icon_rank@3x.png
+P 0806E5F3 icon_save.png
 P 2DB0325D icon_spr@3x.png
 P 2EFA541B icon_str@3x.png
 P 804842C9 icon_thanks@3x.png
+P 96DD5D94 icon_themes.png
 P 6ECB5FEC icon_up@3x.png
 D images/progress
 P E2BF0C93 progress_1@3x$bar.png
@@ -46,6 +48,10 @@ P E7F15BA7 progress_2$bar.png
 P 641A22BF progress_2.png
 P AF80A9AF progress_s$bar.png
 P 41417E8D progress_s.png
+D images/radio
+P CCF63014 radio_cyber.png
+P 040DE73C radio_dark.png
+P BA975F5A radio_light.png
 D images/resource
 P F3659301 bottombreath.png
 P 496D6FB9 circle.png

public/images/atlas/images/icons.atlas

@@ -1 +1 @@
-{"frames":{"icon_achievement@3x.png":{"frame":{"h":69,"idx":0,"w":65,"x":0,"y":385},"sourceSize":{"h":69,"w":65},"spriteSourceSize":{"x":0,"y":0}},"icon_chr@3x.png":{"frame":{"h":61,"idx":0,"w":57,"x":132,"y":448},"sourceSize":{"h":61,"w":57},"spriteSourceSize":{"x":0,"y":0}},"icon_discord.png":{"frame":{"h":384,"idx":0,"w":384,"x":0,"y":0},"sourceSize":{"h":384,"w":384},"spriteSourceSize":{"x":0,"y":0}},"icon_github.png":{"frame":{"h":384,"idx":0,"w":384,"x":385,"y":0},"sourceSize":{"h":384,"w":384},"spriteSourceSize":{"x":0,"y":0}},"icon_int@3x.png":{"frame":{"h":57,"idx":0,"w":54,"x":0,"y":455},"sourceSize":{"h":57,"w":54},"spriteSourceSize":{"x":0,"y":0}},"icon_mny@3x.png":{"frame":{"h":57,"idx":0,"w":54,"x":55,"y":455},"sourceSize":{"h":57,"w":54},"spriteSourceSize":{"x":0,"y":0}},"icon_rank@3x.png":{"frame":{"h":62,"idx":0,"w":72,"x":132,"y":385},"sourceSize":{"h":62,"w":72},"spriteSourceSize":{"x":0,"y":0}},"icon_spr@3x.png":{"frame":{"h":60,"idx":0,"w":57,"x":190,"y":448},"sourceSize":{"h":60,"w":57},"spriteSourceSize":{"x":0,"y":0}},"icon_str@3x.png":{"frame":{"h":57,"idx":0,"w":54,"x":205,"y":385},"sourceSize":{"h":57,"w":54},"spriteSourceSize":{"x":0,"y":0}},"icon_thanks@3x.png":{"frame":{"h":69,"idx":0,"w":65,"x":66,"y":385},"sourceSize":{"h":69,"w":65},"spriteSourceSize":{"x":0,"y":0}},"icon_up@3x.png":{"frame":{"h":18,"idx":0,"w":33,"x":248,"y":443},"sourceSize":{"h":18,"w":33},"spriteSourceSize":{"x":0,"y":0}}},"meta":{"image":"icons.png","prefix":"images/icons/"}}
+{"frames":{"icon_achievement@3x.png":{"frame":{"h":69,"idx":0,"w":65,"x":188,"y":385},"sourceSize":{"h":69,"w":65},"spriteSourceSize":{"x":0,"y":0}},"icon_chr@3x.png":{"frame":{"h":61,"idx":0,"w":57,"x":320,"y":448},"sourceSize":{"h":61,"w":57},"spriteSourceSize":{"x":0,"y":0}},"icon_discord.png":{"frame":{"h":384,"idx":0,"w":384,"x":0,"y":0},"sourceSize":{"h":384,"w":384},"spriteSourceSize":{"x":0,"y":0}},"icon_github.png":{"frame":{"h":384,"idx":0,"w":384,"x":385,"y":0},"sourceSize":{"h":384,"w":384},"spriteSourceSize":{"x":0,"y":0}},"icon_int@3x.png":{"frame":{"h":57,"idx":0,"w":54,"x":188,"y":455},"sourceSize":{"h":57,"w":54},"spriteSourceSize":{"x":0,"y":0}},"icon_mny@3x.png":{"frame":{"h":57,"idx":0,"w":54,"x":243,"y":455},"sourceSize":{"h":57,"w":54},"spriteSourceSize":{"x":0,"y":0}},"icon_rank@3x.png":{"frame":{"h":62,"idx":0,"w":72,"x":320,"y":385},"sourceSize":{"h":62,"w":72},"spriteSourceSize":{"x":0,"y":0}},"icon_save.png":{"frame":{"h":90,"idx":0,"w":90,"x":97,"y":385},"sourceSize":{"h":90,"w":90},"spriteSourceSize":{"x":0,"y":0}},"icon_spr@3x.png":{"frame":{"h":60,"idx":0,"w":57,"x":378,"y":448},"sourceSize":{"h":60,"w":57},"spriteSourceSize":{"x":0,"y":0}},"icon_str@3x.png":{"frame":{"h":57,"idx":0,"w":54,"x":393,"y":385},"sourceSize":{"h":57,"w":54},"spriteSourceSize":{"x":0,"y":0}},"icon_thanks@3x.png":{"frame":{"h":69,"idx":0,"w":65,"x":254,"y":385},"sourceSize":{"h":69,"w":65},"spriteSourceSize":{"x":0,"y":0}},"icon_themes.png":{"frame":{"h":96,"idx":0,"w":96,"x":0,"y":385},"sourceSize":{"h":96,"w":96},"spriteSourceSize":{"x":0,"y":0}},"icon_up@3x.png":{"frame":{"h":18,"idx":0,"w":33,"x":97,"y":476},"sourceSize":{"h":18,"w":33},"spriteSourceSize":{"x":0,"y":0}}},"meta":{"image":"icons.png","prefix":"images/icons/"}}

public/images/atlas/images/radio.atlas

@@ -0,0 +1 @@
+{"frames":{"radio_cyber.png":{"frame":{"h":300,"idx":0,"w":300,"x":0,"y":0},"sourceSize":{"h":300,"w":300},"spriteSourceSize":{"x":0,"y":0}},"radio_dark.png":{"frame":{"h":300,"idx":0,"w":300,"x":0,"y":301},"sourceSize":{"h":300,"w":300},"spriteSourceSize":{"x":0,"y":0}},"radio_light.png":{"frame":{"h":300,"idx":0,"w":300,"x":301,"y":0},"sourceSize":{"h":300,"w":300},"spriteSourceSize":{"x":0,"y":0}}},"meta":{"image":"radio.png","prefix":"images/radio/"}}

public/index.html

@@ -1 +1 @@
-<!doctype html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"><meta name="description" content="やり直すんだ。そして、次はうまくやる。"/><meta name="keywords" content="人生重开模拟器 liferestart life restart remake 人生重来"/><meta name="renderer" content="webkit"/><meta name="apple-mobile-web-app-capable" content="yes"/><meta name="full-screen" content="true"/><meta name="x5-fullscreen" content="true"/><meta name="360-fullscreen" content="true"/><meta name="theme-color" content="#157878"/><meta name="laya" screenorientation="landscape"/><meta http-equiv="expires" content="0"/><meta http-equiv="Cache-Control" content="no-siteapp"/><title>Life Restart</title><script src="libs/laya/min/laya.core.min.js"></script><script src="libs/laya/min/laya.webgl.min.js"></script><script src="libs/laya/min/laya.filter.min.js"></script><script src="libs/laya/min/laya.particle.min.js"></script><script src="libs/laya/min/laya.ui.min.js"></script><script defer="defer" src="chunk/main.883b9.js"></script></head><body style="background:black"></body></html>
+<!doctype html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"><meta name="description" content="やり直すんだ。そして、次はうまくやる。"/><meta name="keywords" content="人生重开模拟器 liferestart life restart remake 人生重来"/><meta name="renderer" content="webkit"/><meta name="apple-mobile-web-app-capable" content="yes"/><meta name="full-screen" content="true"/><meta name="x5-fullscreen" content="true"/><meta name="360-fullscreen" content="true"/><meta name="theme-color" content="#157878"/><meta name="laya" screenorientation="landscape"/><meta http-equiv="expires" content="0"/><meta http-equiv="Cache-Control" content="no-siteapp"/><title>Life Restart</title><script src="libs/laya/min/laya.core.min.js"></script><script src="libs/laya/min/laya.webgl.min.js"></script><script src="libs/laya/min/laya.filter.min.js"></script><script src="libs/laya/min/laya.particle.min.js"></script><script src="libs/laya/min/laya.ui.min.js"></script><script defer="defer" src="chunk/main.b028f.js"></script></head><body style="background:black"></body></html>

src/app.js

@@ -133,6 +133,15 @@ class App{
         this.resigterEvent();
         this.#initLaya();
         globalThis.$ui = UIManager.getInstance();
+
+        if(theme=='default') {
+            if(!localStorage.getItem('__')) {
+                localStorage.setItem('__', 1);
+                localStorage.setItem('theme', 'cyber');
+            }
+            theme = localStorage.getItem('theme');
+        }
+
         $ui.theme = theme;
         await this.#setLanguage(language);
         await $ui.setLoading(UI.pages.LOADING);

src/i18n/en-us.js

@@ -119,6 +119,22 @@ export default ({
     UI_Support_Programmer: 'Programmer',
     UI_Support_Designer: 'Designer',
 
+    UI_Save: 'Save',
+    UI_Load: 'Load',
+    UI_Read: 'Copy',
+    UI_Write: 'Paste',
+
+    UI_CopySuccess: 'Copy to clipboard success',
+    UI_CopyFaild: 'Copy to clipboard faild',
+
+    UI_PasteSuccessDecodeSuccess: 'Load Success!',
+    UI_PasteSuccessDecodeFaild: 'Paste success, but load faild!',
+    UI_PasteFaildDecodeSuccess: 'Paste faild, use input load success!',
+    UI_PasteFaildDecodeFaild: 'Paste faild, use input load faild!',
+
+    UI_LoadSuccess: 'Load Success!',
+    UI_LoadFaild: 'Load Faild!',
+
     M_NoRank: 'There is no rank',
 
     F_RemakeTimes: 'Remake {0} Times',

src/i18n/zh-cn.js

@@ -119,6 +119,22 @@ export default ({
     UI_Support_Programmer: '打赏程序(顿顿饭)',
     UI_Support_Designer: '打赏策划(爱发电)',
 
+    UI_Save: '存档',
+    UI_Load: '读档',
+    UI_Read: '复制',
+    UI_Write: '粘贴',
+
+    UI_LoadSuccess: '读档成功！',
+    UI_LoadFaild: '读档失败！',
+
+    UI_CopySuccess: '成功复制存档到剪贴板',
+    UI_CopyFaild: '复制存档到剪贴板失败，请手动复制存档内容',
+
+    UI_PasteSuccessDecodeSuccess: '读档成功！',
+    UI_PasteSuccessDecodeFaild: '粘贴剪贴板存档内容成功，但剪贴板内容读档失败',
+    UI_PasteFaildDecodeSuccess: '粘贴剪贴板存档内容失败，使用输入的内容读档成功',
+    UI_PasteFaildDecodeFaild: '粘贴剪贴板存档内容失败，使用输入的内容读档失败',
+
     M_NoRank: '别卷了，没有排行榜',
 
     F_RemakeTimes: '已重开{0}次',

src/index.js

@@ -34,6 +34,37 @@ globalThis.$$off = (tag, fn) => {
     if(listener) listener.delete(fn);
 }
 
+globalThis.$$copy = async text => {
+    const result = await navigator.permissions.query({ name: "clipboard-write" })
+    if (result.state == "granted" || result.state == "prompt") {
+        navigator.clipboard.writeText(text)
+        return true;
+    }
+    const input = document.createElement('input');
+    input.setAttribute('style', 'opacity: 0;');
+    document.body.appendChild(input);
+    input.value = text;
+    input.select();
+    const r = document.execCommand("copy");
+    document.body.removeChild(input);
+    return r;
+}
+
+globalThis.$$read = async ()=>{
+    const result = await navigator.permissions.query({ name: "clipboard-read" })
+    if (result.state == "granted" || result.state == "prompt") {
+        return await navigator.clipboard.readText();
+    }
+    const input = document.createElement('input');
+    input.setAttribute('style', 'opacity: 0;');
+    document.body.appendChild(input);
+    input.focus();
+    const r = document.execCommand("paste");
+    const text = input.value;
+    document.body.removeChild(input);
+    return r?text:r;
+};
+
 const core = new Life();
 const game = new App();
 globalThis.core = core;

src/ui/themes/cyber/main.js

@@ -6,6 +6,8 @@ export default class CyberMain extends ui.view.CyberTheme.CyberMainUI {
         this.btnThanks.on(Laya.Event.CLICK, this, ()=>$ui.switchView(UI.pages.THANKS));
         this.btnGithub.on(Laya.Event.CLICK, this, goto, ['github']);
         this.btnDiscord.on(Laya.Event.CLICK, this, goto, ['discord']);
+        this.btnThemes.on(Laya.Event.CLICK, this, ()=>$ui.showDialog(UI.pages.THEMES));
+        this.btnSaveLoad.on(Laya.Event.CLICK, this, ()=>$ui.showDialog(UI.pages.SAVELOAD));
         this.on(Laya.Event.RESIZE, this, () => {
             const scale = Math.max(
                 this.width / this.imgBg.width,

src/ui/themes/default/main.js

@@ -6,6 +6,8 @@ export default class Main extends ui.view.DefaultTheme.MainUI {
         this.btnThanks.on(Laya.Event.CLICK, this, ()=>$ui.switchView(UI.pages.THANKS));
         this.btnGithub.on(Laya.Event.CLICK, this, goto, ['github']);
         this.btnDiscord.on(Laya.Event.CLICK, this, goto, ['discord']);
+        this.btnThemes.on(Laya.Event.CLICK, this, ()=>$ui.showDialog(UI.pages.THEMES));
+        this.btnSaveLoad.on(Laya.Event.CLICK, this, ()=>$ui.showDialog(UI.pages.SAVELOAD));
     }
 
     static load() {
@@ -18,5 +20,8 @@ export default class Main extends ui.view.DefaultTheme.MainUI {
         this.btnDiscord.visible =
         this.btnAchievement.visible =
         this.btnThanks.visible = !!core.times;
+        const text = this.labSubTitle.text;
+        this.labSubTitle.text = ' ';
+        this.labSubTitle.text = text;
     }
 }

src/ui/themes/saveload.js

@@ -0,0 +1,95 @@
+export default class SaveLoad extends ui.view.SaveLoadUI {
+    constructor() {
+        super();
+        this.btnClose.on(Laya.Event.CLICK, this, async ()=>{
+            await this.close();
+            $ui.switchView(UI.pages.MAIN);
+        });
+        this.btnRead.on(Laya.Event.CLICK, this, async ()=>{
+            const result = await $$copy(this.input.text = this.data);
+            $$event('message', [result? 'UI_CopySuccess': 'UI_CopyFaild']);
+        });
+        this.btnWrite.on(Laya.Event.CLICK, this, async ()=>{
+            const text = await $$read();
+            if(text == false) {
+                this.data = [
+                    this.input.text,
+                    'UI_PasteFaildDecodeSuccess',
+                    'UI_PasteFaildDecodeFaild'
+                ];
+            } else {
+                this.input.text = text;
+                this.data = [
+                    text,
+                    'UI_PasteSuccessDecodeSuccess',
+                    'UI_PasteSuccessDecodeFaild'
+                ];
+            }
+        });
+
+        this.btnSave.on(Laya.Event.CLICK, this, ()=>{
+            let blob = new Blob([this.data], { type: 'application/json' });
+            const slice = blob.slice || blob.webkitSlice || blob.mozSlice;
+            blob = slice.call(blob, 0, blob.size, 'application/octet-stream');
+            const a = document.createElementNS('http://www.w3.org/1999/xhtml', 'a');
+            a.href = URL.createObjectURL(blob);
+            a.download = `Remake_save_${new Date().toISOString().replace(':','.')}.json`;
+
+            document.body.appendChild(a);
+            a.click();
+            document.body.removeChild(a);
+            URL.revokeObjectURL(a.href);
+        });
+        this.btnLoad.on(Laya.Event.CLICK, this, ()=>{
+            const file = document.createElement('input');
+            file.setAttribute('type', 'file');
+            file.setAttribute('name', 'file');
+            file.setAttribute('accept', 'application/json');
+            file.setAttribute('style', 'display: none;');
+            document.body.appendChild(file);
+            file.click();
+            file.onchange = (e)=>{
+                const file = e.target.files[0];
+                if(!file) return;
+                const reader = new FileReader();
+                reader.onload = () => this.data = [reader.result];
+                reader.readAsText(file);
+                document.body.removeChild(file);
+            };
+        });
+        this.input.on(Laya.Event.MOUSE_DOWN, this, ()=>{
+            this.input.setSelection(0, this.input.text.length);
+        })
+    }
+
+    static load() {
+        return ["images/atlas/images/radio.atlas"];
+    }
+
+    init() {
+        this.input.text = this.data;
+    }
+
+    get data() {
+        const data = {};
+        Object
+            .keys(localStorage)
+            .filter(v=>v.substr(0,4)!='goog')
+            .forEach(key=>data[key] = localStorage[key]);
+        return JSON.stringify(data);
+    }
+
+    set data([v, success = 'UI_LoadSuccess', faild = 'UI_LoadFaild']) {
+        try {
+            const data = JSON.parse(v);
+            for(const key in data)
+                localStorage.setItem(key, data[key]);
+            $$event('message', [success]);
+            $ui.theme = $ui.theme;
+            this.btnClose.event(Laya.Event.CLICK);
+        } catch (e) {
+            console.error(e);
+            $$event('message', [faild]);
+        }
+    }
+}

src/ui/themes/themes.js

@@ -0,0 +1,40 @@
+export default class Themes extends ui.view.ThemesUI {
+    constructor() {
+        super();
+        this.btnClose.on(Laya.Event.CLICK, this, ()=>this.close());
+        this.btnOK.on(Laya.Event.CLICK, this, async ()=>{
+            const selected = this.selected;
+            if(!selected == $ui.theme) return this.close();
+            $ui.theme = selected;
+            await this.close();
+            $ui.switchView(UI.pages.MAIN);
+        });
+    }
+
+    static load() {
+        return ["images/atlas/images/radio.atlas"];
+    }
+
+    init() {
+        this.selected = localStorage.getItem('theme');
+    }
+
+    get selected() {
+        switch(this.radioTheme.selectedIndex) {
+            case 0: return 'cyber';
+            case 1: return 'dark';
+            case 2: return 'light';
+            default: return 'default';
+        }
+    }
+    set selected(v) {
+        let index;
+        switch(v) {
+            case 'cyber': index = 0; break;
+            case 'dark': index = 1; break;
+            case 'light': index = 2; break;
+            default: index = -1; break;
+        }
+        this.radioTheme.selectedIndex = index;
+    }
+}

src/ui/themes/views.js

@@ -7,6 +7,8 @@ const pages = {
     SUMMARY: 'SUMMARY',
     ACHIEVEMENT: 'ACHIEVEMENT',
     THANKS: 'THANKS',
+    THEMES: 'THEMES',
+    SAVELOAD: 'SAVELOAD',
 };
 
 const popups = {
@@ -24,6 +26,8 @@ const cyber = {
         [pages.SUMMARY]: "cyber/summary",
         [pages.ACHIEVEMENT]: "cyber/achievement",
         [pages.THANKS]: "default/thanks",
+        [pages.THEMES]: 'themes',
+        [pages.SAVELOAD]: 'saveload',
     },
     popups: {
         [popups.ACHIEVEMENT]: "cyber/popup/achievementPopup",
@@ -53,6 +57,24 @@ const cyber = {
             ],
         },
         pages: {
+            [pages.MAIN]: {
+                vars: {
+                    btnThemes: {
+                        defaultColor: '#cccccc',
+                        radius: 100,
+                    },
+                    btnSaveLoad: {
+                        defaultColor: '#5865f2',
+                        defaultStroke: '#eeeeee',
+                        defaultLabel: '#eeeeee',
+                        hoverColor: '#1160b0',
+                        hoverStroke: '#eeeeee',
+                        hoverLabel: '#eeeeee',
+                        lineWidth: 0,
+                        radius: 100,
+                    },
+                }
+            },
             [pages.THANKS]: {
                 vars: {
                     btnBack: {
@@ -84,7 +106,56 @@ const cyber = {
                         radius: 4,
                     },
                 },
-            }
+            },
+            [pages.THEMES]: {
+                vars: {
+                    btnOK: {
+                        defaultColor: '#28b070',
+                        defaultLabel: '#ffffff',
+                        hoverColor: '#00ff00',
+                        hoverLabel: '#ffffff',
+                        radius: 80,
+                    },
+                    btnClose: {
+                        defaultColor: '#eb3941',
+                        defaultLabel: '#ffffff',
+                        hoverColor: '#ff0000',
+                        hoverLabel: '#ffffff',
+                        radius: 80,
+                    },
+                }
+            },
+            [pages.SAVELOAD]: {
+                vars: {
+                    btnClose: {
+                        defaultColor: '#eb3941',
+                        hoverColor: '#ff0000',
+                    },
+                    btnSave: {
+                        defaultColor: '#007046',
+                        hoverColor: '#76f190',
+                    },
+                    btnRead: {
+                        defaultColor: '#007046',
+                        hoverColor: '#76f190',
+                    },
+                    btnLoad: {
+                        defaultColor: '#fc5531',
+                        hoverColor: '#f28b54',
+                    },
+                    btnWrite: {
+                        defaultColor: '#fc5531',
+                        hoverColor: '#f28b54',
+                    },
+                },
+                names: {
+                    btnSmall: {
+                        radius: 80,
+                        defaultLabel: '#ffffff',
+                        hoverLabel: '#ffffff',
+                    }
+                }
+            },
         }
     }
 }
@@ -99,6 +170,8 @@ const dark = {
         [pages.SUMMARY]: "default/summary",
         [pages.ACHIEVEMENT]: "default/achievement",
         [pages.THANKS]: "default/thanks",
+        [pages.THEMES]: 'themes',
+        [pages.SAVELOAD]: 'saveload',
     },
     popups: {
         [popups.ACHIEVEMENT]: "default/popup/achievementPopup",
@@ -340,10 +413,23 @@ const dark = {
             [pages.MAIN]: {
                 vars: {
                     btnRemake: 'btn_main',
-                    labTitle: 'title',
+                    btnThemes: {
-                    labSubTitle: 'title',
+                        defaultColor: '#cccccc',
+                        radius: 100,
+                    },
+                    btnSaveLoad: {
+                        defaultColor: '#5865f2',
+                        defaultStroke: '#eeeeee',
+                        defaultLabel: '#eeeeee',
+                        hoverColor: '#1160b0',
+                        hoverStroke: '#eeeeee',
+                        hoverLabel: '#eeeeee',
+                        lineWidth: 0,
+                        radius: 100,
+                    },
                 },
                 names: {
+                    title: 'title',
                     btnSmall: 'btn_small',
                 }
             },
@@ -448,7 +534,56 @@ const dark = {
                         radius: 4,
                     },
                 },
-            }
+            },
+            [pages.THEMES]: {
+                vars: {
+                    btnOK: {
+                        defaultColor: '#28b070',
+                        defaultLabel: '#ffffff',
+                        hoverColor: '#00ff00',
+                        hoverLabel: '#ffffff',
+                        radius: 80,
+                    },
+                    btnClose: {
+                        defaultColor: '#eb3941',
+                        defaultLabel: '#ffffff',
+                        hoverColor: '#ff0000',
+                        hoverLabel: '#ffffff',
+                        radius: 80,
+                    },
+                }
+            },
+            [pages.SAVELOAD]: {
+                vars: {
+                    btnClose: {
+                        defaultColor: '#eb3941',
+                        hoverColor: '#ff0000',
+                    },
+                    btnSave: {
+                        defaultColor: '#007046',
+                        hoverColor: '#76f190',
+                    },
+                    btnRead: {
+                        defaultColor: '#007046',
+                        hoverColor: '#76f190',
+                    },
+                    btnLoad: {
+                        defaultColor: '#fc5531',
+                        hoverColor: '#f28b54',
+                    },
+                    btnWrite: {
+                        defaultColor: '#fc5531',
+                        hoverColor: '#f28b54',
+                    },
+                },
+                names: {
+                    btnSmall: {
+                        radius: 80,
+                        defaultLabel: '#ffffff',
+                        hoverLabel: '#ffffff',
+                    }
+                }
+            },
         },
         popups: {
             [popups.ACHIEVEMENT]: {
@@ -475,6 +610,8 @@ const light = {
         [pages.SUMMARY]: "default/summary",
         [pages.ACHIEVEMENT]: "default/achievement",
         [pages.THANKS]: "default/thanks",
+        [pages.THEMES]: 'themes',
+        [pages.SAVELOAD]: 'saveload',
     },
     popups: {
         [popups.ACHIEVEMENT]: "default/popup/achievementPopup",
@@ -710,10 +847,23 @@ const light = {
             [pages.MAIN]: {
                 vars: {
                     btnRemake: 'btn_main',
-                    labTitle: 'title',
+                    btnThemes: {
-                    labSubTitle: 'title',
+                        defaultColor: '#cccccc',
+                        radius: 100,
+                    },
+                    btnSaveLoad: {
+                        defaultColor: '#5865f2',
+                        defaultStroke: '#eeeeee',
+                        defaultLabel: '#eeeeee',
+                        hoverColor: '#1160b0',
+                        hoverStroke: '#eeeeee',
+                        hoverLabel: '#eeeeee',
+                        lineWidth: 0,
+                        radius: 100,
+                    },
                 },
                 names: {
+                    title: 'title',
                     btnSmall: 'btn_small',
                 }
             },
@@ -818,7 +968,56 @@ const light = {
                         radius: 4,
                     }
                 },
-            }
+            },
+            [pages.THEMES]: {
+                vars: {
+                    btnOK: {
+                        defaultColor: '#28b070',
+                        defaultLabel: '#ffffff',
+                        hoverColor: '#00ff00',
+                        hoverLabel: '#ffffff',
+                        radius: 80,
+                    },
+                    btnClose: {
+                        defaultColor: '#eb3941',
+                        defaultLabel: '#ffffff',
+                        hoverColor: '#ff0000',
+                        hoverLabel: '#ffffff',
+                        radius: 80,
+                    },
+                }
+            },
+            [pages.SAVELOAD]: {
+                vars: {
+                    btnClose: {
+                        defaultColor: '#eb3941',
+                        hoverColor: '#ff0000',
+                    },
+                    btnSave: {
+                        defaultColor: '#007046',
+                        hoverColor: '#76f190',
+                    },
+                    btnRead: {
+                        defaultColor: '#007046',
+                        hoverColor: '#76f190',
+                    },
+                    btnLoad: {
+                        defaultColor: '#fc5531',
+                        hoverColor: '#f28b54',
+                    },
+                    btnWrite: {
+                        defaultColor: '#fc5531',
+                        hoverColor: '#f28b54',
+                    },
+                },
+                names: {
+                    btnSmall: {
+                        radius: 80,
+                        defaultLabel: '#ffffff',
+                        hoverLabel: '#ffffff',
+                    }
+                }
+            },
         },
         popups: {
             [popups.ACHIEVEMENT]: {

src/ui/uiManager.js

@@ -7,7 +7,6 @@ export default class UIManager {
             stage = Laya.stage;
         }
         this.#stage = stage;
-        this.theme = 'default';
 
         stage.addChild(this.#viewLayer);
         this.#viewLayer.zOrder = 1;
@@ -26,7 +25,16 @@ export default class UIManager {
         this.#popupLayer.top =
         this.#popupLayer.bottom =
         this.#popupLayer.left =
-        this.#popupLayer.right = 0;
+        this.#popupLayer.right =
+        this.#dialogMask.top =
+        this.#dialogMask.bottom =
+        this.#dialogMask.left =
+        this.#dialogMask.right = 0;
+        this.#dialogMask.graphics.drawRect(0, 0, 5000, 5000, '#000000');
+        this.#dialogMask.alpha = 0.4;
+        this.#dialogMask.on(Laya.Event.CLICK, this, ()=>{
+            this.#dialogStack[this.#dialogStack.length - 1]?.close?.();
+        })
     }
 
     static #instance = {};
@@ -37,9 +45,10 @@ export default class UIManager {
     #viewLayer = new Laya.Panel();
     #dialogLayer = new Laya.Panel();
     #popupLayer = new Laya.Panel();
+    #dialogMask = new Laya.Sprite();
     #viewMap = new Map();
     #class = new Map();
-    #theme = 'default';
+    #dialogStack = [];
 
     static get inst() {
         return this.getInstance();
@@ -95,8 +104,12 @@ export default class UIManager {
         // check if view is already loaded
         let view = await this.#viewMap.get(className);
 
+        let timeout;
         if(this.#loading) {
-            this.#stage.addChild(this.#loading);
+            timeout = setTimeout(
+                ()=>this.#stage.addChild(this.#loading),
+                3000
+            );
         }
         const onProgress = this.#loading?.onProgress;
 
@@ -121,7 +134,7 @@ export default class UIManager {
             const resourceList = await view.constructor.load?.(args);
             await this.loadRes(resourceList, preload, onProgress);
         }
-
+        if(timeout) clearTimeout(timeout);
         this.#loading?.removeSelf();
 
         this.#config(view, viewName, type);
@@ -151,12 +164,34 @@ export default class UIManager {
         }
     }
 
+    #showDialogStack() {
+        if(this.#dialogStack.length == 0) {
+            this.#dialogLayer.visible = false;
+            return;
+        }
+        this.#dialogLayer.visible = true;
+        this.#dialogStack.forEach((dialog, i)=>{
+            this.#dialogLayer.addChild(dialog);
+            dialog.zOrder = i;
+        })
+        this.#dialogLayer.addChild(this.#dialogMask);
+        const l = this.#dialogStack.length;
+        this.#dialogMask.zOrder = l -1;
+        this.#dialogStack[l -1].zOrder = l;
+    }
+
     async showDialog(dialogName, args, actions) {
         const className = this.#pages[dialogName];
         const dialog = await this.getView(className, args, actions?.load, dialogName, 'pages');
-        dialog.centerX = dialog.centerY = 0;
+
+        const index = this.#dialogStack.indexOf(dialog);
+        if(index != -1) {
+            this.#dialogStack.splice(index, 1);
+        }
+        this.#dialogStack.push(dialog);
         dialog.init?.(args);
-        this.#dialogLayer.addChild(dialog);
+        dialog.centerX = dialog.centerY = 0;
+        this.#showDialogStack();
 
         const open = actions?.open || (async () => {
             dialog.scaleX = 0;
@@ -164,9 +199,20 @@ export default class UIManager {
             await Laya.promises.Tween.to(dialog, { scaleX: 1, scaleY: 1 }, 300, Laya.Ease.backOut);
         });
         await open(dialog);
-        dialog.close = actions?.close || (async () => {
+        dialog.mouseThrough = true;
-            await Laya.promises.Tween.to(dialog, { scaleX: 0, scaleY: 0 }, 300, Laya.Ease.backOut);
+        dialog.mouseEnabled = true;
-        });;
+        dialog.close = async ()=>{
+            if(actions?.close) {
+                await actions.close();
+            } else {
+                await Laya.promises.Tween.to(dialog, { scaleX: 0, scaleY: 0 }, 300, Laya.Ease.strongIn);
+            }
+            const index = this.#dialogStack.indexOf(dialog);
+            if(index != -1) {
+                this.#dialogStack.splice(index, 1);
+            }
+            this.#showDialogStack();
+        }
 
         this.#dialogLayer.addChild(dialog);
     }
@@ -180,7 +226,8 @@ export default class UIManager {
     }
 
     clearAllDialog() {
-        this.#dialogLayer.removeChildren();
+        this.#dialogStack = [];
+        this.#showDialogStack();
     }
 
     #config(view, key, type) {
@@ -279,23 +326,27 @@ export default class UIManager {
         return this.#currentView;
     }
 
+    get currentDialog() {
+        return this.#dialogStack[this.#dialogStack.length -1];
+    }
+
     get theme() {
-        return this.#theme;
+        return localStorage.getItem('theme');
     }
     set theme(value) {
-        this.#theme = value;
+        localStorage.setItem('theme', value);
         this.#stage.bgColor = this.#configs.bgColor;
         document?.querySelector?.('meta[name="theme-color"]')?.setAttribute?.('content', this.#configs.bgColor);
     }
 
     get #pages() {
-        return UIManager.theme(this.#theme, 'pages');
+        return UIManager.theme(this.theme, 'pages');
     }
     get #popups() {
-        return UIManager.theme(this.#theme, 'popups');
+        return UIManager.theme(this.theme, 'popups');
     }
     get #configs() {
-        return UIManager.theme(this.#theme, 'configs');
+        return UIManager.theme(this.theme, 'configs');
     }
     get common() {
         return this.#configs.common;