继续补充UI细节

This commit is contained in:
2025-06-04 18:06:27 +08:00
parent 28107a24f9
commit d352331151
4 changed files with 459 additions and 447 deletions

View File

@@ -14,7 +14,6 @@
{ {
"_$type": "87bad4d3-bede-442e-914d-d7bcdc85f0d1", "_$type": "87bad4d3-bede-442e-914d-d7bcdc85f0d1",
"scriptPath": "../src/views/Difficulty.ts", "scriptPath": "../src/views/Difficulty.ts",
"sprite_bg": null,
"obj_items": { "obj_items": {
"_$ref": "34t1dkio" "_$ref": "34t1dkio"
} }
@@ -35,17 +34,27 @@
"skin": "res://a98f334e-ce04-4cd0-8fc5-bbdf9b048609", "skin": "res://a98f334e-ce04-4cd0-8fc5-bbdf9b048609",
"color": "#000000" "color": "#000000"
}, },
{
"_$id": "8qh18emh",
"_$type": "Box",
"name": "bottom",
"y": 705,
"width": 1080,
"height": 1215,
"left": 0,
"right": 0,
"bottom": 0,
"_$child": [
{ {
"_$id": "jzxgx41i", "_$id": "jzxgx41i",
"_$type": "Box", "_$type": "Box",
"name": "offset", "name": "offset",
"y": 2400,
"width": 1080, "width": 1080,
"height": 1215, "height": 1215,
"_mouseState": 2, "_mouseState": 2,
"left": 0, "left": 0,
"right": 0, "right": 0,
"bottom": -1695, "bottom": 0,
"_$child": [ "_$child": [
{ {
"_$id": "bd1s5tvm", "_$id": "bd1s5tvm",
@@ -468,4 +477,6 @@
] ]
} }
] ]
}
]
} }

View File

@@ -87,9 +87,8 @@
"_$id": "5wwqja5x", "_$id": "5wwqja5x",
"_$type": "Label", "_$type": "Label",
"name": "label_month", "name": "label_month",
"x": 114,
"y": 334, "y": 334,
"width": 100, "width": 328,
"height": 60, "height": 60,
"bottom": -106, "bottom": -106,
"centerX": 0, "centerX": 0,
@@ -97,13 +96,14 @@
"font": "res://7322bbf9-175b-4a25-a0d7-72d369894de2", "font": "res://7322bbf9-175b-4a25-a0d7-72d369894de2",
"fontSize": 42, "fontSize": 42,
"color": "rgba(167, 171, 179, 1)", "color": "rgba(167, 171, 179, 1)",
"align": "center",
"valign": "middle", "valign": "middle",
"padding": "0,0,0,0" "padding": "0,0,0,0"
} }
] ]
}, },
{ {
"_$id": "u3azxf82", "_$id": "sdxgsg64",
"_$type": "Box", "_$type": "Box",
"name": "Box(2)", "name": "Box(2)",
"x": 328, "x": 328,
@@ -114,22 +114,22 @@
"_$type": "79064920-30a6-4b11-a82e-bbdd4112c4e1", "_$type": "79064920-30a6-4b11-a82e-bbdd4112c4e1",
"scriptPath": "../src/views/dc/TrophyUnit.ts", "scriptPath": "../src/views/dc/TrophyUnit.ts",
"bg_light": { "bg_light": {
"_$ref": "tnjynmgf" "_$ref": "cmcgnmju"
}, },
"icon": { "icon": {
"_$ref": "0qe74n99" "_$ref": "iv946bfq"
}, },
"label_count": { "label_count": {
"_$ref": "9dsn53bb" "_$ref": "8zok6mg3"
}, },
"label_month": { "label_month": {
"_$ref": "zse8y0wo" "_$ref": "m7q5zv5i"
} }
} }
], ],
"_$child": [ "_$child": [
{ {
"_$id": "tnjynmgf", "_$id": "cmcgnmju",
"_$type": "Image", "_$type": "Image",
"name": "bg_light", "name": "bg_light",
"x": 20, "x": 20,
@@ -140,7 +140,7 @@
"color": "#ffffff" "color": "#ffffff"
}, },
{ {
"_$id": "0qe74n99", "_$id": "iv946bfq",
"_$type": "Image", "_$type": "Image",
"name": "icon", "name": "icon",
"x": 20, "x": 20,
@@ -151,7 +151,7 @@
"color": "#ffffff" "color": "#ffffff"
}, },
{ {
"_$id": "9dsn53bb", "_$id": "8zok6mg3",
"_$type": "Label", "_$type": "Label",
"name": "label_count", "name": "label_count",
"x": 128, "x": 128,
@@ -169,12 +169,11 @@
"padding": "0,0,0,0" "padding": "0,0,0,0"
}, },
{ {
"_$id": "zse8y0wo", "_$id": "m7q5zv5i",
"_$type": "Label", "_$type": "Label",
"name": "label_month", "name": "label_month",
"x": 114,
"y": 334, "y": 334,
"width": 100, "width": 328,
"height": 60, "height": 60,
"bottom": -106, "bottom": -106,
"centerX": 0, "centerX": 0,
@@ -182,13 +181,14 @@
"font": "res://7322bbf9-175b-4a25-a0d7-72d369894de2", "font": "res://7322bbf9-175b-4a25-a0d7-72d369894de2",
"fontSize": 42, "fontSize": 42,
"color": "rgba(167, 171, 179, 1)", "color": "rgba(167, 171, 179, 1)",
"align": "center",
"valign": "middle", "valign": "middle",
"padding": "0,0,0,0" "padding": "0,0,0,0"
} }
] ]
}, },
{ {
"_$id": "wle8hrmr", "_$id": "tc7xviei",
"_$type": "Box", "_$type": "Box",
"name": "Box(3)", "name": "Box(3)",
"x": 656, "x": 656,
@@ -199,22 +199,22 @@
"_$type": "79064920-30a6-4b11-a82e-bbdd4112c4e1", "_$type": "79064920-30a6-4b11-a82e-bbdd4112c4e1",
"scriptPath": "../src/views/dc/TrophyUnit.ts", "scriptPath": "../src/views/dc/TrophyUnit.ts",
"bg_light": { "bg_light": {
"_$ref": "o57stpd9" "_$ref": "k5b3mzbs"
}, },
"icon": { "icon": {
"_$ref": "en1ghf80" "_$ref": "qi90ngqx"
}, },
"label_count": { "label_count": {
"_$ref": "1znenn3j" "_$ref": "1t6ofvi0"
}, },
"label_month": { "label_month": {
"_$ref": "row347fk" "_$ref": "bcvpzkxl"
} }
} }
], ],
"_$child": [ "_$child": [
{ {
"_$id": "o57stpd9", "_$id": "k5b3mzbs",
"_$type": "Image", "_$type": "Image",
"name": "bg_light", "name": "bg_light",
"x": 20, "x": 20,
@@ -225,7 +225,7 @@
"color": "#ffffff" "color": "#ffffff"
}, },
{ {
"_$id": "en1ghf80", "_$id": "qi90ngqx",
"_$type": "Image", "_$type": "Image",
"name": "icon", "name": "icon",
"x": 20, "x": 20,
@@ -236,7 +236,7 @@
"color": "#ffffff" "color": "#ffffff"
}, },
{ {
"_$id": "1znenn3j", "_$id": "1t6ofvi0",
"_$type": "Label", "_$type": "Label",
"name": "label_count", "name": "label_count",
"x": 128, "x": 128,
@@ -254,12 +254,11 @@
"padding": "0,0,0,0" "padding": "0,0,0,0"
}, },
{ {
"_$id": "row347fk", "_$id": "bcvpzkxl",
"_$type": "Label", "_$type": "Label",
"name": "label_month", "name": "label_month",
"x": 114,
"y": 334, "y": 334,
"width": 100, "width": 328,
"height": 60, "height": 60,
"bottom": -106, "bottom": -106,
"centerX": 0, "centerX": 0,
@@ -267,6 +266,7 @@
"font": "res://7322bbf9-175b-4a25-a0d7-72d369894de2", "font": "res://7322bbf9-175b-4a25-a0d7-72d369894de2",
"fontSize": 42, "fontSize": 42,
"color": "rgba(167, 171, 179, 1)", "color": "rgba(167, 171, 179, 1)",
"align": "center",
"valign": "middle", "valign": "middle",
"padding": "0,0,0,0" "padding": "0,0,0,0"
} }

View File

@@ -87,9 +87,8 @@
"_$id": "ybx61p0y", "_$id": "ybx61p0y",
"_$type": "Label", "_$type": "Label",
"name": "label_month", "name": "label_month",
"x": 133,
"y": 334, "y": 334,
"width": 100, "width": 366,
"height": 60, "height": 60,
"bottom": -106, "bottom": -106,
"centerX": 0, "centerX": 0,
@@ -97,13 +96,14 @@
"font": "res://7322bbf9-175b-4a25-a0d7-72d369894de2", "font": "res://7322bbf9-175b-4a25-a0d7-72d369894de2",
"fontSize": 42, "fontSize": 42,
"color": "rgba(167, 171, 179, 1)", "color": "rgba(167, 171, 179, 1)",
"align": "center",
"valign": "middle", "valign": "middle",
"padding": "0,0,0,0" "padding": "0,0,0,0"
} }
] ]
}, },
{ {
"_$id": "khaz9803", "_$id": "8sqsb1v7",
"_$type": "Box", "_$type": "Box",
"name": "Box(2)", "name": "Box(2)",
"x": 366, "x": 366,
@@ -114,22 +114,22 @@
"_$type": "79064920-30a6-4b11-a82e-bbdd4112c4e1", "_$type": "79064920-30a6-4b11-a82e-bbdd4112c4e1",
"scriptPath": "../src/views/dc/TrophyUnit.ts", "scriptPath": "../src/views/dc/TrophyUnit.ts",
"bg_light": { "bg_light": {
"_$ref": "wswxra73" "_$ref": "mv6jx0hr"
}, },
"icon": { "icon": {
"_$ref": "3eszf2o1" "_$ref": "zp0wq75q"
}, },
"label_count": { "label_count": {
"_$ref": "saz64m1x" "_$ref": "ywg1cix4"
}, },
"label_month": { "label_month": {
"_$ref": "xzf561ib" "_$ref": "1pcxh1ei"
} }
} }
], ],
"_$child": [ "_$child": [
{ {
"_$id": "wswxra73", "_$id": "mv6jx0hr",
"_$type": "Image", "_$type": "Image",
"name": "bg_light", "name": "bg_light",
"x": 39, "x": 39,
@@ -140,7 +140,7 @@
"color": "#ffffff" "color": "#ffffff"
}, },
{ {
"_$id": "3eszf2o1", "_$id": "zp0wq75q",
"_$type": "Image", "_$type": "Image",
"name": "icon", "name": "icon",
"x": 39, "x": 39,
@@ -151,7 +151,7 @@
"color": "#ffffff" "color": "#ffffff"
}, },
{ {
"_$id": "saz64m1x", "_$id": "ywg1cix4",
"_$type": "Label", "_$type": "Label",
"name": "label_count", "name": "label_count",
"x": 147, "x": 147,
@@ -169,12 +169,11 @@
"padding": "0,0,0,0" "padding": "0,0,0,0"
}, },
{ {
"_$id": "xzf561ib", "_$id": "1pcxh1ei",
"_$type": "Label", "_$type": "Label",
"name": "label_month", "name": "label_month",
"x": 133,
"y": 334, "y": 334,
"width": 100, "width": 366,
"height": 60, "height": 60,
"bottom": -106, "bottom": -106,
"centerX": 0, "centerX": 0,
@@ -182,13 +181,14 @@
"font": "res://7322bbf9-175b-4a25-a0d7-72d369894de2", "font": "res://7322bbf9-175b-4a25-a0d7-72d369894de2",
"fontSize": 42, "fontSize": 42,
"color": "rgba(167, 171, 179, 1)", "color": "rgba(167, 171, 179, 1)",
"align": "center",
"valign": "middle", "valign": "middle",
"padding": "0,0,0,0" "padding": "0,0,0,0"
} }
] ]
}, },
{ {
"_$id": "be29eeum", "_$id": "1xs6zjzu",
"_$type": "Box", "_$type": "Box",
"name": "Box(3)", "name": "Box(3)",
"x": 732, "x": 732,
@@ -199,22 +199,22 @@
"_$type": "79064920-30a6-4b11-a82e-bbdd4112c4e1", "_$type": "79064920-30a6-4b11-a82e-bbdd4112c4e1",
"scriptPath": "../src/views/dc/TrophyUnit.ts", "scriptPath": "../src/views/dc/TrophyUnit.ts",
"bg_light": { "bg_light": {
"_$ref": "un800knw" "_$ref": "1po7r6cl"
}, },
"icon": { "icon": {
"_$ref": "hqax24bs" "_$ref": "6ymckz7p"
}, },
"label_count": { "label_count": {
"_$ref": "qxr4wb3w" "_$ref": "mq8s6wlg"
}, },
"label_month": { "label_month": {
"_$ref": "y5wo3jiq" "_$ref": "cbj7anbs"
} }
} }
], ],
"_$child": [ "_$child": [
{ {
"_$id": "un800knw", "_$id": "1po7r6cl",
"_$type": "Image", "_$type": "Image",
"name": "bg_light", "name": "bg_light",
"x": 39, "x": 39,
@@ -225,7 +225,7 @@
"color": "#ffffff" "color": "#ffffff"
}, },
{ {
"_$id": "hqax24bs", "_$id": "6ymckz7p",
"_$type": "Image", "_$type": "Image",
"name": "icon", "name": "icon",
"x": 39, "x": 39,
@@ -236,7 +236,7 @@
"color": "#ffffff" "color": "#ffffff"
}, },
{ {
"_$id": "qxr4wb3w", "_$id": "mq8s6wlg",
"_$type": "Label", "_$type": "Label",
"name": "label_count", "name": "label_count",
"x": 147, "x": 147,
@@ -254,12 +254,11 @@
"padding": "0,0,0,0" "padding": "0,0,0,0"
}, },
{ {
"_$id": "y5wo3jiq", "_$id": "cbj7anbs",
"_$type": "Label", "_$type": "Label",
"name": "label_month", "name": "label_month",
"x": 133,
"y": 334, "y": 334,
"width": 100, "width": 366,
"height": 60, "height": 60,
"bottom": -106, "bottom": -106,
"centerX": 0, "centerX": 0,
@@ -267,13 +266,14 @@
"font": "res://7322bbf9-175b-4a25-a0d7-72d369894de2", "font": "res://7322bbf9-175b-4a25-a0d7-72d369894de2",
"fontSize": 42, "fontSize": 42,
"color": "rgba(167, 171, 179, 1)", "color": "rgba(167, 171, 179, 1)",
"align": "center",
"valign": "middle", "valign": "middle",
"padding": "0,0,0,0" "padding": "0,0,0,0"
} }
] ]
}, },
{ {
"_$id": "l1qfa1q3", "_$id": "9h2i3y7o",
"_$type": "Box", "_$type": "Box",
"name": "Box(4)", "name": "Box(4)",
"x": 1098, "x": 1098,
@@ -284,22 +284,22 @@
"_$type": "79064920-30a6-4b11-a82e-bbdd4112c4e1", "_$type": "79064920-30a6-4b11-a82e-bbdd4112c4e1",
"scriptPath": "../src/views/dc/TrophyUnit.ts", "scriptPath": "../src/views/dc/TrophyUnit.ts",
"bg_light": { "bg_light": {
"_$ref": "5gsoayj9" "_$ref": "8fygsnwf"
}, },
"icon": { "icon": {
"_$ref": "54xz5s5e" "_$ref": "b6j6afm0"
}, },
"label_count": { "label_count": {
"_$ref": "6q0dsx4g" "_$ref": "8nqk46k9"
}, },
"label_month": { "label_month": {
"_$ref": "sj7l0rt1" "_$ref": "bbay5ca1"
} }
} }
], ],
"_$child": [ "_$child": [
{ {
"_$id": "5gsoayj9", "_$id": "8fygsnwf",
"_$type": "Image", "_$type": "Image",
"name": "bg_light", "name": "bg_light",
"x": 39, "x": 39,
@@ -310,7 +310,7 @@
"color": "#ffffff" "color": "#ffffff"
}, },
{ {
"_$id": "54xz5s5e", "_$id": "b6j6afm0",
"_$type": "Image", "_$type": "Image",
"name": "icon", "name": "icon",
"x": 39, "x": 39,
@@ -321,7 +321,7 @@
"color": "#ffffff" "color": "#ffffff"
}, },
{ {
"_$id": "6q0dsx4g", "_$id": "8nqk46k9",
"_$type": "Label", "_$type": "Label",
"name": "label_count", "name": "label_count",
"x": 147, "x": 147,
@@ -339,12 +339,11 @@
"padding": "0,0,0,0" "padding": "0,0,0,0"
}, },
{ {
"_$id": "sj7l0rt1", "_$id": "bbay5ca1",
"_$type": "Label", "_$type": "Label",
"name": "label_month", "name": "label_month",
"x": 133,
"y": 334, "y": 334,
"width": 100, "width": 366,
"height": 60, "height": 60,
"bottom": -106, "bottom": -106,
"centerX": 0, "centerX": 0,
@@ -352,13 +351,14 @@
"font": "res://7322bbf9-175b-4a25-a0d7-72d369894de2", "font": "res://7322bbf9-175b-4a25-a0d7-72d369894de2",
"fontSize": 42, "fontSize": 42,
"color": "rgba(167, 171, 179, 1)", "color": "rgba(167, 171, 179, 1)",
"align": "center",
"valign": "middle", "valign": "middle",
"padding": "0,0,0,0" "padding": "0,0,0,0"
} }
] ]
}, },
{ {
"_$id": "m8pa8be4", "_$id": "v4qo7s87",
"_$type": "Box", "_$type": "Box",
"name": "Box(5)", "name": "Box(5)",
"x": 1464, "x": 1464,
@@ -369,22 +369,22 @@
"_$type": "79064920-30a6-4b11-a82e-bbdd4112c4e1", "_$type": "79064920-30a6-4b11-a82e-bbdd4112c4e1",
"scriptPath": "../src/views/dc/TrophyUnit.ts", "scriptPath": "../src/views/dc/TrophyUnit.ts",
"bg_light": { "bg_light": {
"_$ref": "gu5av5vw" "_$ref": "aw2ku55f"
}, },
"icon": { "icon": {
"_$ref": "dkfotcdq" "_$ref": "euqes0rh"
}, },
"label_count": { "label_count": {
"_$ref": "z7hfr2ud" "_$ref": "34ujh5mt"
}, },
"label_month": { "label_month": {
"_$ref": "f0b5rsee" "_$ref": "ywbyys1d"
} }
} }
], ],
"_$child": [ "_$child": [
{ {
"_$id": "gu5av5vw", "_$id": "aw2ku55f",
"_$type": "Image", "_$type": "Image",
"name": "bg_light", "name": "bg_light",
"x": 39, "x": 39,
@@ -395,7 +395,7 @@
"color": "#ffffff" "color": "#ffffff"
}, },
{ {
"_$id": "dkfotcdq", "_$id": "euqes0rh",
"_$type": "Image", "_$type": "Image",
"name": "icon", "name": "icon",
"x": 39, "x": 39,
@@ -406,7 +406,7 @@
"color": "#ffffff" "color": "#ffffff"
}, },
{ {
"_$id": "z7hfr2ud", "_$id": "34ujh5mt",
"_$type": "Label", "_$type": "Label",
"name": "label_count", "name": "label_count",
"x": 147, "x": 147,
@@ -424,12 +424,11 @@
"padding": "0,0,0,0" "padding": "0,0,0,0"
}, },
{ {
"_$id": "f0b5rsee", "_$id": "ywbyys1d",
"_$type": "Label", "_$type": "Label",
"name": "label_month", "name": "label_month",
"x": 133,
"y": 334, "y": 334,
"width": 100, "width": 366,
"height": 60, "height": 60,
"bottom": -106, "bottom": -106,
"centerX": 0, "centerX": 0,
@@ -437,6 +436,7 @@
"font": "res://7322bbf9-175b-4a25-a0d7-72d369894de2", "font": "res://7322bbf9-175b-4a25-a0d7-72d369894de2",
"fontSize": 42, "fontSize": 42,
"color": "rgba(167, 171, 179, 1)", "color": "rgba(167, 171, 179, 1)",
"align": "center",
"valign": "middle", "valign": "middle",
"padding": "0,0,0,0" "padding": "0,0,0,0"
} }

View File

@@ -12,12 +12,13 @@ export class Difficulty extends Laya.Script {
// 组件被激活后执行,此时所有节点和组件均已创建完毕,此方法只执行一次 // 组件被激活后执行,此时所有节点和组件均已创建完毕,此方法只执行一次
onAwake(): void { onAwake(): void {
const offset = this.owner.getChildByName("offset") as Laya.Box const offset = this.owner.getChildByName("bottom").getChildByName("offset") as Laya.Box
const bg = offset.getChildByName("bg") as Laya.Sprite const bg = offset.getChildByName("bg") as Laya.Sprite
bg.graphics.clear() bg.graphics.clear()
bg.graphics.drawRoundRect(0, 0, offset.width, offset.height, 20, 20, 0, 0, "#f5f7fb") bg.graphics.drawRoundRect(0, 0, offset.width, offset.height, 20, 20, 0, 0, "#f5f7fb")
Laya.Tween.to(offset, { y: 705 }, 500) offset.y = offset.width
Laya.Tween.to(offset, { y: 0 }, 500)
const mask = this.owner.getChildByName("mask") const mask = this.owner.getChildByName("mask")
mask.on(Laya.Event.CLICK, this, () => { mask.on(Laya.Event.CLICK, this, () => {