{
"commands": [
{
"_comment": "=== 第1层:背景填充 ===",
"method": "fillRect",
"color": "bg",
"rect": [0, 0, 1, 1]
},
{
"_comment": "=== 第2层:顶部+底部 淡色横带(上下留白氛围) ===",
"method": "nativeContext",
"commands": [
{ "op": "save", "args": [] },
{ "op": "globalAlpha", "args": [0.08] },
{ "op": "fillStyle", "args": ["sub2"] },
{ "op": "rect", "args": [0, 0, 1, 0.07] },
{ "op": "fill", "args": [] },
{ "op": "rect", "args": [0, 0.93, 1, 0.07] },
{ "op": "fill", "args": [] },
{ "op": "restore", "args": [] }
],
"_desc": "画布顶部和底部各 7% 的淡色带,框定视觉范围"
},
{
"_comment": "=== 第3层:左侧竖条装饰(杂志侧边栏风格) ===",
"method": "nativeContext",
"commands": [
{ "op": "save", "args": [] },
{ "op": "globalAlpha", "args": [0.12] },
{ "op": "fillStyle", "args": ["accent"] },
{ "op": "rect", "args": [0, 0, 0.04, 1] },
{ "op": "fill", "args": [] },
{ "op": "globalAlpha", "args": [0.06] },
{ "op": "fillStyle", "args": ["sub3"] },
{ "op": "rect", "args": [0.04, 0, 0.015, 1] },
{ "op": "fill", "args": [] },
{ "op": "restore", "args": [] }
],
"_desc": "左侧 4% 宽 accent 色条 + 1.5% 宽 sub3 色条,双色侧边栏"
},
{
"_comment": "=== 第4层:右上角小方块矩阵装饰 ===",
"method": "gingham",
"args": {
"rect": [0.88, 0.04, 0.1, 0.06],
"rows": 3,
"cols": 4,
"type": "rectangle",
"color1": "sub3",
"color2": "accent",
"alpha1": 0.18,
"alpha2": 0.35,
"roughness": 0,
"padding": 0.1
},
"_desc": "右上角 4×3 小方格矩阵,模拟像素风装饰"
},
{
"_comment": "=== 第5层:散落光斑 ===",
"method": "scatterElements",
"args": {
"type": "circle",
"count": [18, 30],
"areas": [[0.08, 0.28], [0.65, 0.92]],
"colors": ["sub2", "sub3", "accent"],
"sizeRange": [0.003, 0.014],
"options": {
"fillStyle": "solid",
"randomAlpha": [0.15, 0.5],
"roughness": 0
}
},
"_desc": "在左侧和下方区域散布半透明光斑"
},
{
"_comment": "=== 第6层:散落十字星装饰 ===",
"method": "scatterHollowPath",
"args": {
"d": "M 0 -0.45 L 0.08 -0.08 L 0.45 0 L 0.08 0.08 L 0 0.45 L -0.08 0.08 L -0.45 0 L -0.08 -0.08 Z",
"count": [5, 10],
"areas": [[0.06, 0.3], [0.62, 0.9]],
"colors": ["sub3", "accent"],
"sizeRange": [0.02, 0.045],
"randomRotate": true,
"options": {
"strokeWidth": 1.6,
"roughness": 0.2,
"randomAlpha": [0.25, 0.55]
}
},
"_desc": "散落的八芒星,随机旋转,增加精致感"
},
{
"_comment": "=== 第11层:日期下方细线分隔 ===",
"method": "nativeContext",
"commands": [
{ "op": "save", "args": [] },
{ "op": "globalAlpha", "args": [0.35] },
{ "op": "fillStyle", "args": ["sub2"] },
{ "op": "rect", "args": [0.05, 0.225, 0.12, 0.002] },
{ "op": "fill", "args": [] },
{ "op": "restore", "args": [] }
],
"_desc": "日期下方一条细横线"
},
{
"_comment": "=== 第12层:右下角日期组(今天高亮圆) ===",
"method": "executeDateTimeline",
"centerX": 0.8,
"y": 0.87,
"gapRatio": 0.07,
"direction": "horizontal",
"config": {
"dayName": {
"fontSize": 0.036,
"lang": "zh",
"color": "sub2",
"fontOpacity": 0.8,
"fontWeight": "600",
"bgShape": { "type": "none" }
},
"today": {
"fontSize": 0.04,
"color": "white",
"fontOpacity": 1,
"fontWeight": "bold",
"bgShape": {
"type": "circle",
"size": 0.06
},
"bgcolor": "accent",
"opacity": 0.85
},
"otherDays": {
"fontSize": 0.032,
"color": "main",
"fontOpacity": 0.8,
"fontWeight": "600",
"bgShape": { "type": "none" }
},
"headerGap": 0.04
},
"_desc": "右下角中文星期 + 日期,今天用 accent 圆高亮"
},
{
"_comment": "=== 第14层:贯穿中部的极淡结构线(模拟版式网格) ===",
"method": "nativeContext",
"commands": [
{ "op": "save", "args": [] },
{ "op": "globalAlpha", "args": [0.04] },
{ "op": "fillStyle", "args": ["main"] },
{ "op": "rect", "args": [0.21, 0.1, 0.002, 0.8] },
{ "op": "fill", "args": [] },
{ "op": "rect", "args": [0.79, 0.1, 0.002, 0.8] },
{ "op": "fill", "args": [] },
{ "op": "restore", "args": [] }
],
"_desc": "两条极淡的竖线,定位图片左右边界,增加结构感"
},
{
"method": "drawImages",
"layouts": {
"1": [[0.2, 0.35, 0.6]]
},
"layers": [
{
"type": "roundedImage",
"height_ratio": 1.333,
"radius": 0.1,
"strokeKey": "sub-1",
"strokeOpacity": 0.2,
"strokeWidth": 10,
"txt": "使用独立 roundedImage 分支,参数更清晰,性能更稳"
}
]
}
],
"height_ratio":[1.33]
}
"commands": [
{
"_comment": "=== 第1层:背景填充 ===",
"method": "fillRect",
"color": "bg",
"rect": [0, 0, 1, 1]
},
{
"_comment": "=== 第2层:顶部+底部 淡色横带(上下留白氛围) ===",
"method": "nativeContext",
"commands": [
{ "op": "save", "args": [] },
{ "op": "globalAlpha", "args": [0.08] },
{ "op": "fillStyle", "args": ["sub2"] },
{ "op": "rect", "args": [0, 0, 1, 0.07] },
{ "op": "fill", "args": [] },
{ "op": "rect", "args": [0, 0.93, 1, 0.07] },
{ "op": "fill", "args": [] },
{ "op": "restore", "args": [] }
],
"_desc": "画布顶部和底部各 7% 的淡色带,框定视觉范围"
},
{
"_comment": "=== 第3层:左侧竖条装饰(杂志侧边栏风格) ===",
"method": "nativeContext",
"commands": [
{ "op": "save", "args": [] },
{ "op": "globalAlpha", "args": [0.12] },
{ "op": "fillStyle", "args": ["accent"] },
{ "op": "rect", "args": [0, 0, 0.04, 1] },
{ "op": "fill", "args": [] },
{ "op": "globalAlpha", "args": [0.06] },
{ "op": "fillStyle", "args": ["sub3"] },
{ "op": "rect", "args": [0.04, 0, 0.015, 1] },
{ "op": "fill", "args": [] },
{ "op": "restore", "args": [] }
],
"_desc": "左侧 4% 宽 accent 色条 + 1.5% 宽 sub3 色条,双色侧边栏"
},
{
"_comment": "=== 第4层:右上角小方块矩阵装饰 ===",
"method": "gingham",
"args": {
"rect": [0.88, 0.04, 0.1, 0.06],
"rows": 3,
"cols": 4,
"type": "rectangle",
"color1": "sub3",
"color2": "accent",
"alpha1": 0.18,
"alpha2": 0.35,
"roughness": 0,
"padding": 0.1
},
"_desc": "右上角 4×3 小方格矩阵,模拟像素风装饰"
},
{
"_comment": "=== 第5层:散落光斑 ===",
"method": "scatterElements",
"args": {
"type": "circle",
"count": [18, 30],
"areas": [[0.08, 0.28], [0.65, 0.92]],
"colors": ["sub2", "sub3", "accent"],
"sizeRange": [0.003, 0.014],
"options": {
"fillStyle": "solid",
"randomAlpha": [0.15, 0.5],
"roughness": 0
}
},
"_desc": "在左侧和下方区域散布半透明光斑"
},
{
"_comment": "=== 第6层:散落十字星装饰 ===",
"method": "scatterHollowPath",
"args": {
"d": "M 0 -0.45 L 0.08 -0.08 L 0.45 0 L 0.08 0.08 L 0 0.45 L -0.08 0.08 L -0.45 0 L -0.08 -0.08 Z",
"count": [5, 10],
"areas": [[0.06, 0.3], [0.62, 0.9]],
"colors": ["sub3", "accent"],
"sizeRange": [0.02, 0.045],
"randomRotate": true,
"options": {
"strokeWidth": 1.6,
"roughness": 0.2,
"randomAlpha": [0.25, 0.55]
}
},
"_desc": "散落的八芒星,随机旋转,增加精致感"
},
{
"_comment": "=== 第11层:日期下方细线分隔 ===",
"method": "nativeContext",
"commands": [
{ "op": "save", "args": [] },
{ "op": "globalAlpha", "args": [0.35] },
{ "op": "fillStyle", "args": ["sub2"] },
{ "op": "rect", "args": [0.05, 0.225, 0.12, 0.002] },
{ "op": "fill", "args": [] },
{ "op": "restore", "args": [] }
],
"_desc": "日期下方一条细横线"
},
{
"_comment": "=== 第12层:右下角日期组(今天高亮圆) ===",
"method": "executeDateTimeline",
"centerX": 0.8,
"y": 0.87,
"gapRatio": 0.07,
"direction": "horizontal",
"config": {
"dayName": {
"fontSize": 0.036,
"lang": "zh",
"color": "sub2",
"fontOpacity": 0.8,
"fontWeight": "600",
"bgShape": { "type": "none" }
},
"today": {
"fontSize": 0.04,
"color": "white",
"fontOpacity": 1,
"fontWeight": "bold",
"bgShape": {
"type": "circle",
"size": 0.06
},
"bgcolor": "accent",
"opacity": 0.85
},
"otherDays": {
"fontSize": 0.032,
"color": "main",
"fontOpacity": 0.8,
"fontWeight": "600",
"bgShape": { "type": "none" }
},
"headerGap": 0.04
},
"_desc": "右下角中文星期 + 日期,今天用 accent 圆高亮"
},
{
"_comment": "=== 第14层:贯穿中部的极淡结构线(模拟版式网格) ===",
"method": "nativeContext",
"commands": [
{ "op": "save", "args": [] },
{ "op": "globalAlpha", "args": [0.04] },
{ "op": "fillStyle", "args": ["main"] },
{ "op": "rect", "args": [0.21, 0.1, 0.002, 0.8] },
{ "op": "fill", "args": [] },
{ "op": "rect", "args": [0.79, 0.1, 0.002, 0.8] },
{ "op": "fill", "args": [] },
{ "op": "restore", "args": [] }
],
"_desc": "两条极淡的竖线,定位图片左右边界,增加结构感"
},
{
"method": "drawImages",
"layouts": {
"1": [[0.2, 0.35, 0.6]]
},
"layers": [
{
"type": "roundedImage",
"height_ratio": 1.333,
"radius": 0.1,
"strokeKey": "sub-1",
"strokeOpacity": 0.2,
"strokeWidth": 10,
"txt": "使用独立 roundedImage 分支,参数更清晰,性能更稳"
}
]
}
],
"height_ratio":[1.33]
}