a65adcc2e5
Sources: extracted from two upstream archives (skill-repo, skills-main),
merged with the following policy:
- 15 broken symlinks (pointing to /Users/jameslee/.cc-switch/skills or
../../.agents/skills on a foreign machine) discarded
- 3 real name collisions with identical content (ai-pair, ifind-http-api,
zhipu-websearch) kept as one copy
- Functional overlaps deduped keeping the strongest variant:
- docx family: kept docx (official, full toolchain) + docx-cn
(GB/T 9704 Chinese official-document constants),
dropped docx_writer (no scripts, name collided with docx)
- humanizer family: kept humanizer-zh (6 zh reference docs),
dropped humanizer (en, redundant for CN workflow)
- Skills that only ran in a foreign environment removed:
ablemind-ops, app-publish, hlb-design-system, openclaw-adj-skill,
claude-driver
- alphapai excluded from this public repo because its SKILL.md hard-coded
live credentials
Result: 25 skills, 572 files, ~7.5 MB.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
263 lines
11 KiB
Markdown
263 lines
11 KiB
Markdown
# Layout: `icon_grid` — 图标网格
|
||
|
||
> 幻灯片尺寸: 13.333 × 7.5 英寸 | 边距: 0.6 英寸 | 内容宽: 12.133 英寸
|
||
|
||
---
|
||
|
||
## 用途
|
||
|
||
能力矩阵、特征展示、产品功能清单、投资策略要素、风险因素分类。
|
||
|
||
---
|
||
|
||
## ASCII 线框图
|
||
|
||
### 2×3 网格（6格，每行2列）
|
||
|
||
```
|
||
┌─────────────────────────────────────────────────────────────┐
|
||
│ [标题] y=0.25 │
|
||
│ ▬▬ (accent 装饰线) y=0.90 │
|
||
│ │
|
||
│ ┌──────────────────────────┐ ┌──────────────────────────┐ │
|
||
│ │ [图标] [标题] │ │ [图标] [标题] │ │
|
||
│ │ 一行描述文字... │ │ 一行描述文字... │ │
|
||
│ └──────────────────────────┘ └──────────────────────────┘ │
|
||
│ │
|
||
│ ┌──────────────────────────┐ ┌──────────────────────────┐ │
|
||
│ │ [图标] [标题] │ │ [图标] [标题] │ │
|
||
│ │ 一行描述文字... │ │ 一行描述文字... │ │
|
||
│ └──────────────────────────┘ └──────────────────────────┘ │
|
||
│ │
|
||
│ ┌──────────────────────────┐ ┌──────────────────────────┐ │
|
||
│ │ [图标] [标题] │ │ [图标] [标题] │ │
|
||
│ │ 一行描述文字... │ │ 一行描述文字... │ │
|
||
│ └──────────────────────────┘ └──────────────────────────┘ │
|
||
└─────────────────────────────────────────────────────────────┘
|
||
```
|
||
|
||
### 3×3 网格（9格，每行3列）
|
||
|
||
```
|
||
│ ┌─────────────┐ ┌─────────────┐ ┌─────────────┐ │
|
||
│ │ [图] [标题] │ │ [图] [标题] │ │ [图] [标题] │ │
|
||
│ │ 描述文字... │ │ 描述文字... │ │ 描述文字... │ │
|
||
│ └─────────────┘ └─────────────┘ └─────────────┘ │
|
||
│ ... ×3 行 │
|
||
```
|
||
|
||
### 3×2 网格（6格，每行3列，2行——较常用）
|
||
|
||
与 3×3 相同列数，仅 2 行，格内内容更多。
|
||
|
||
---
|
||
|
||
## 网格尺寸计算
|
||
|
||
### 2列布局（N=4,6）
|
||
|
||
```
|
||
cols = 2
|
||
col_gap = 0.30
|
||
cell_w = (12.133 - col_gap) / 2 = 5.917"
|
||
|
||
rows = ceil(N / cols) # 4→2行, 6→3行
|
||
row_gap = 0.20
|
||
grid_start_y = 1.15
|
||
available_h = 7.5 - 1.15 - 0.30 = 6.05"
|
||
cell_h = (available_h - (rows-1)*row_gap) / rows
|
||
|
||
rows=2: cell_h = (6.05 - 0.20) / 2 = 2.925"
|
||
rows=3: cell_h = (6.05 - 0.40) / 3 = 1.883"
|
||
```
|
||
|
||
### 3列布局（N=6,9）
|
||
|
||
```
|
||
cols = 3
|
||
col_gap = 0.25
|
||
cell_w = (12.133 - 2*col_gap) / 3 = 3.878"
|
||
|
||
rows = ceil(N / 3) # 6→2行, 9→3行
|
||
row_gap = 0.20
|
||
cell_h: rows=2→2.925", rows=3→1.883"（与2列相同）
|
||
```
|
||
|
||
---
|
||
|
||
## 精确坐标标注
|
||
|
||
### 固定元素
|
||
|
||
| 元素 | x | y | w | h | 字号 | 颜色 |
|
||
|------|---|---|---|---|------|------|
|
||
| 页面标题 | 0.60 | 0.25 | 12.133 | 0.60 | title_size-2 | text_dark |
|
||
| 装饰线 | 0.60 | 0.90 | 2.00 | 0.04 | — | accent |
|
||
|
||
### 单格内部结构（以 3列×2行, cell_w=3.878", cell_h=2.925" 为例）
|
||
|
||
**格内元素（横向图标+标题排列）**:
|
||
|
||
| 元素 | x（相对 cell_x） | y（相对 cell_y） | w | h | 字号 | 颜色 | 对齐 |
|
||
|------|----------------|----------------|---|---|------|------|------|
|
||
| 格背景（圆角矩形） | +0 | +0 | cell_w | cell_h | — | card_bg | — |
|
||
| 左侧 accent 竖条 | +0 | +0 | 0.06 | cell_h | — | accent | — |
|
||
| 图标 | +0.20 | +0.30 | 0.60 | 0.60 | 28pt | primary | 中 |
|
||
| 格标题 | +0.90 | +0.30 | cell_w-1.10 | 0.55 | subtitle_size | text_dark | 左 |
|
||
| 描述正文 | +0.20 | +1.00 | cell_w-0.40 | cell_h-1.20 | body_size | text_muted | 左 |
|
||
|
||
> **格标题 y 对齐图标垂直居中**: 图标高 0.60"，标题高 0.55"，图标从 +0.30 开始，
|
||
> 标题从 +0.33 开始，视觉上与图标垂直居中。
|
||
|
||
**替代排列：图标置顶（更适合 2列×3行 的高格）**:
|
||
|
||
| 元素 | x（相对 cell_x） | y（相对 cell_y） | w | h | 字号 | 颜色 | 对齐 |
|
||
|------|----------------|----------------|---|---|------|------|------|
|
||
| 格背景 | +0 | +0 | cell_w | cell_h | — | card_bg | — |
|
||
| 顶部 accent 色带 | +0 | +0 | cell_w | 0.06 | — | accent | — |
|
||
| 图标（居中大图标） | +0 | +0.15 | cell_w | 0.80 | 40pt | primary | 中 |
|
||
| 格标题 | +0.15 | +1.05 | cell_w-0.30 | 0.50 | subtitle_size | text_dark | 中 |
|
||
| 描述正文 | +0.20 | +1.65 | cell_w-0.40 | cell_h-1.85 | body_size | text_muted | 中 |
|
||
|
||
---
|
||
|
||
## 数据接口
|
||
|
||
```python
|
||
data = {
|
||
"title": str, # 页面标题
|
||
"subtitle": str, # 可选
|
||
"cols": int, # 列数（2 或 3），默认自动根据 N 判断
|
||
"icon_position": "left" | "top", # 图标位置，默认 "left"
|
||
"items": [
|
||
{
|
||
"icon": str, # Unicode 图标或文字（如 "📊", "①", "AI"）
|
||
"title": str, # 格标题（12字以内）
|
||
"desc": str, # 描述（40字以内，超出自动换行）
|
||
"color": str, # 可选，左侧竖条/顶部色带的颜色变量名
|
||
},
|
||
... # 4-9 个
|
||
],
|
||
}
|
||
```
|
||
|
||
---
|
||
|
||
## 列数自动判断规则
|
||
|
||
```
|
||
N <= 4: cols=2
|
||
N == 5: cols=3（5格：2×3网格中5格填满，最后一格空白或用"敬请期待"）
|
||
N == 6: cols=2（2×3，格高1.88"，推荐）或 cols=3（3×2，格高2.93"，推荐）
|
||
N == 7,8: cols=4（推荐改用4列）
|
||
N == 9: cols=3（3×3）
|
||
```
|
||
|
||
> **推荐最多 9 格**；超过 9 格时内容过于拥挤，建议拆成多页。
|
||
|
||
---
|
||
|
||
## 实现伪代码
|
||
|
||
```python
|
||
def layout_icon_grid(slide, data, theme):
|
||
m = theme["margin"]
|
||
sw, sh = 13.333, 7.5
|
||
cw = sw - 2 * m
|
||
|
||
set_slide_bg(slide, theme["bg_light"])
|
||
add_text(slide, data["title"],
|
||
x=m, y=0.25, w=cw, h=0.60,
|
||
font_size=theme["title_size"]-2, color=theme["text_dark"],
|
||
bold=True, font_name=theme["header_font"])
|
||
add_rect(slide, m, 0.90, 2.0, 0.04, fill=theme["accent"])
|
||
|
||
items = data["items"]
|
||
N = len(items)
|
||
cols = data.get("cols", 2 if N <= 4 else 3)
|
||
rows = (N + cols - 1) // cols
|
||
icon_pos = data.get("icon_position", "left")
|
||
|
||
col_gap = 0.30 if cols == 2 else 0.25
|
||
row_gap = 0.20
|
||
cell_w = (cw - (cols-1) * col_gap) / cols
|
||
grid_y = 1.15
|
||
available_h = sh - grid_y - 0.30
|
||
cell_h = (available_h - (rows-1) * row_gap) / rows
|
||
|
||
for idx, item in enumerate(items):
|
||
row_i = idx // cols
|
||
col_i = idx % cols
|
||
cx = m + col_i * (cell_w + col_gap)
|
||
cy = grid_y + row_i * (cell_h + row_gap)
|
||
|
||
item_color = theme.get(item.get("color", "accent"), theme["accent"])
|
||
|
||
# 格背景
|
||
add_rounded_rect(slide, cx, cy, cell_w, cell_h,
|
||
fill=theme["card_bg"], border=theme["border"], radius=0.08)
|
||
|
||
if icon_pos == "left":
|
||
# 左侧 accent 竖条
|
||
add_rect(slide, cx, cy, 0.06, cell_h, fill=item_color)
|
||
# 图标
|
||
add_text(slide, item["icon"],
|
||
x=cx+0.15, y=cy+0.25, w=0.65, h=0.65,
|
||
font_size=28, color=theme["primary"],
|
||
align="center", font_name=theme["body_font"])
|
||
# 标题
|
||
add_text(slide, item["title"],
|
||
x=cx+0.90, y=cy+0.28, w=cell_w-1.10, h=0.55,
|
||
font_size=theme["subtitle_size"], color=theme["text_dark"],
|
||
bold=True, font_name=theme["header_font"])
|
||
# 描述
|
||
add_text(slide, item["desc"],
|
||
x=cx+0.20, y=cy+0.95, w=cell_w-0.40, h=cell_h-1.15,
|
||
font_size=theme["body_size"], color=theme["text_muted"],
|
||
font_name=theme["body_font"])
|
||
else: # top
|
||
add_rect(slide, cx, cy, cell_w, 0.06, fill=item_color)
|
||
add_text(slide, item["icon"],
|
||
x=cx, y=cy+0.10, w=cell_w, h=0.80,
|
||
font_size=40, color=theme["primary"],
|
||
align="center", font_name=theme["body_font"])
|
||
add_text(slide, item["title"],
|
||
x=cx+0.15, y=cy+0.95, w=cell_w-0.30, h=0.50,
|
||
font_size=theme["subtitle_size"], color=theme["text_dark"],
|
||
bold=True, align="center", font_name=theme["header_font"])
|
||
add_text(slide, item["desc"],
|
||
x=cx+0.20, y=cy+1.55, w=cell_w-0.40, h=cell_h-1.75,
|
||
font_size=theme["body_size"], color=theme["text_muted"],
|
||
align="center", font_name=theme["body_font"])
|
||
```
|
||
|
||
---
|
||
|
||
## 设计要点
|
||
|
||
1. **左侧竖条** 0.06 英寸宽，等于格高，颜色可每格不同（对应不同类别）
|
||
2. **图标** 建议 Emoji 或 Unicode 符号，字号 28-40pt，颜色用 `primary`
|
||
3. **描述** 左对齐（icon_pos=left）/ 居中（icon_pos=top），字号 body_size
|
||
4. **列间距** 3列时用 0.25"（更紧凑），2列时用 0.30"
|
||
5. **空格处理**（N=5 时 3×2 网格有一空格）：最后空格留白或填"敬请期待"占位
|
||
|
||
---
|
||
|
||
## 测试数据示例
|
||
|
||
```python
|
||
data = {
|
||
"title": "养老金投资管理核心能力",
|
||
"cols": 3,
|
||
"icon_position": "left",
|
||
"items": [
|
||
{"icon": "📊", "title": "量化风险管理", "desc": "基于 VaR/CVaR 的实时风险监控，覆盖市场、信用、流动性三类风险"},
|
||
{"icon": "🌐", "title": "全球资产配置", "desc": "覆盖 30+ 个市场，QDII 额度 120 亿元，海外资产占比 20%"},
|
||
{"icon": "🤖", "title": "AI 辅助决策", "desc": "机器学习因子模型，月度再平衡信号生成，提升组合效率"},
|
||
{"icon": "📋", "title": "ESG 整合", "desc": "UN PRI 签署机构，ESG 评分纳入选股模型，覆盖全部持仓"},
|
||
{"icon": "⚖️", "title": "合规风控", "desc": "独立风控部门，三重审批机制，满足银保监会全部监管要求"},
|
||
{"icon": "💬", "title": "投资者服务", "desc": "7×24 小时客服，季度投资报告，专属客户经理 1 对 1 服务"},
|
||
],
|
||
}
|
||
```
|