垂直流体悬浮 2张图片

{
"id": "phone-wallpaper-2026-master",
"name": "2026垂直流体悬浮壁纸",
"commands": [
{
"method": "fillRect",
"color": "bg",
"rect": [0, 0, 1, 1],
"comment": "1. 基础背景填充"
},
{
"method": "path",
"comment": "2-1. 背景增强：大型下部有机波浪 (JS: highlightColor 0.08)",
"d": "M 0 0.2 Q 0.5 0.15, 1 0.3 L 1 1 L 0 1 Z",
"options": {
"stroke": "transparent",
"fill": "sub2",
"opacity": 0.08,
"fillStyle": "zigzag",
"hachureGap": 40
}
},
{
"method": "path",
"comment": "2-2. 背景增强：上部反向流体 (JS: deepStroke 0.05)",
"d": "M 0 0.7 Q 0.5 0.85, 1 0.65 L 1 0 L 0 0 Z",
"options": {
"stroke": "transparent",
"fill": "main",
"opacity": 0.05,
"fillStyle": "hachure",
"hachureAngle": -45,
"hachureGap": 30
}
},
{
"method": "drawImages",
"comment": "3. 核心布局：手机壁纸专属卡片堆叠",
"layouts": {
"1": [[0.1, 0.25, 0.8, 0.02]],
"2": [[0.08, 0.22, 0.65, -0.04], [0.28, 0.52, 0.65, 0.05]],
"3": [[0.1, 0.2, 0.55, -0.02], [0.35, 0.42, 0.55, 0.03], [0.1, 0.65, 0.55, -0.01]],
"4": [[0.05, 0.22, 0.45, -0.03], [0.5, 0.28, 0.45, 0.02], [0.05, 0.52, 0.45, 0.04], [0.5, 0.58, 0.45, -0.02]]
},
"layers": [
{
"comment": "A. 模拟立体感：底部偏移层 (JS: +15px 对应 offset 0.015)",
"type": "shape",
"shape": "rect",
"offset": [0.015, 0.015],
"options": {
"stroke": "main",
"strokeWidth": 4,
"fill": "main",
"opacity": 0.2,
"fillStyle": "solid",
"roughness": 1.5
}
},
{
"comment": "B. 主卡片层",
"type": "shape",
"shape": "rect",
"options": {
"stroke": "main",
"strokeWidth": 8,
"fill": "white",
"fillStyle": "solid",
"roughness": 1
}
},
{
"comment": "C. 图片渲染 (内缩30px)",
"type": "image",
"shape": "rect",
"padding": 0.04
},
{
"comment": "D. 装饰短线：左上角 (精准贴边算法)",
"type": "shape",
"shape": "rect",
"offset": [-0.35, -0.5],
"scale": [0.3, 0.04],
"options": {
"fill": "sub2",
"fillStyle": "solid",
"stroke": "transparent",
"roughness": 0
}
},
{
"comment": "E. 装饰短线：右下角 (精准贴边算法)",
"type": "shape",
"shape": "rect",
"offset": [0.35, 0.5],
"scale": [0.3, 0.04],
"options": {
"fill": "sub2",
"fillStyle": "solid",
"stroke": "transparent",
"roughness": 0
}
}
]
},
{
"method": "path",
"comment": "4-A. 垂直刻度尺 (i < 20 循环的JSON化)",
"d": "M 0.02 0.1 L 0.05 0.1 M 0.02 0.14 L 0.05 0.14 M 0.02 0.18 L 0.05 0.18 M 0.02 0.22 L 0.05 0.22 M 0.02 0.26 L 0.05 0.26 M 0.02 0.3 L 0.05 0.3 M 0.02 0.34 L 0.05 0.34 M 0.02 0.38 L 0.05 0.38 M 0.02 0.42 L 0.05 0.42 M 0.02 0.46 L 0.05 0.46 M 0.02 0.5 L 0.05 0.5 M 0.02 0.54 L 0.05 0.54 M 0.02 0.58 L 0.05 0.58 M 0.02 0.62 L 0.05 0.62 M 0.02 0.66 L 0.05 0.66 M 0.02 0.7 L 0.05 0.7 M 0.02 0.74 L 0.05 0.74 M 0.02 0.78 L 0.05 0.78 M 0.02 0.82 L 0.05 0.82 M 0.02 0.86 L 0.05 0.86",
"options": {
"stroke": "main",
"strokeOpacity": 0.3,
"strokeWidth": 4
}
},
{
"method": "circle",
"comment": "4-B. 悬浮几何粒子 1",
"args": [0.85, 0.15, 0.06],
"options": {
"stroke": "main",
"strokeWidth": 2,
"fill": "sub2",
"opacity": 0.3,
"fillStyle": "hachure"
}
},
{
"method": "circle",
"comment": "4-B. 悬浮几何粒子 2",
"args": [0.15, 0.85, 0.1],
"options": {
"stroke": "main",
"strokeWidth": 2,
"fill": "sub2",
"opacity": 0.3,
"fillStyle": "hachure"
}
},
{
"method": "path",
"comment": "4-C. 几何虚线连接器",
"d": "M 0.5 0.05 L 0.5 0.18",
"options": {
"stroke": "sub2",
"strokeWidth": 6,
"strokeLineDash": [15, 15]
}
},
{
"method": "rectangle",
"comment": "5. 底部操作台背景带",
"args": [0, 0.88, 1, 0.08],
"options": {
"stroke": "transparent",
"fill": "main",
"opacity": 0.03,
"fillStyle": "solid"
}
},
{
"method": "drawSeal",
"pos": [0.5, 0.92],
"options": {
"font": "Youshe-Title",
"stroke": "main"
}
}
]
}