表单组件主题

admin

下表汇总了当前 `组件美化栏` 中每个组件（Schemas 里已有的 13 个）的“初始化配置字段”  
——所有字段已在真实组件内验证有效，直接在 cfg 对象写同名键即可覆盖默认值。

| t | 组件 | 可用配置键（默认值） |
|----|-----------|------------------------------------------------------------------------------------------------------------------------------------|
| 1  | 按钮 Button | 宽度(100) 高24 背景颜色(primary) 文本颜色(0xffffff) 圆角(radius) 文本("按钮") |
| 2  | 编辑框 Input | 宽度160 高24 背景颜色(0xffffff) 边框颜色(0x666666) 文本颜色(text) 圆角(radius) 占位("请输入…") |
| 3  | 单选框 Radio | 宽度20 高20 背景颜色(0xffffff) 选中颜色(primary) |
| 4  | 超级列表框 SuperListBox | 宽度300 高200 背景颜色(ctrlBg) 边框颜色(0x666666) |
| 6  | 复选框 CheckBox | 宽度20 高20 背景颜色(0xffffff) 选中颜色(primary) |
| 7  | 滑块条 Slider | 宽度160 高24 最小值0 最大值100 当前值50 轨道厚度8 滑块宽度12 滑块颜色(primary) 轨道颜色(0x505050) |
| 8  | 幻灯片 SlideShow | 宽度320 高180 当前页0 背景颜色(0x000000) |
| 9  | 进度条 ProgressBar | 宽度160 高24 值50 背景颜色(0x505050) 前景颜色(primary) |
| 10 | 列表框 ListBox | 宽度200 高140 背景颜色(ctrlBg) 文本颜色(text) |
| 11 | 面板框 Panel | 宽度260 高160 背景颜色(ctrlBg) 标题("面板") |
| 12 | 树形框 TreeView | 宽度240 高200 背景颜色(ctrlBg) 文本颜色(text) |
| 18 | 颜色拾取器 ColorPicker | 宽度160 高120 当前颜色(primary) |
| 20 | 组合框 ComboBox | 宽度160 高24 选项列表([{文本:'选项1',值:1}]) 当前选中0 背景颜色(ctrlBg) 文本颜色(text) |

使用示例（覆盖宽度和圆角）  
```js
{ t:1, id:'btnSave', bt:'保存', 宽度:120, 圆角:8 }
```

凡在表中列出的键都已在组件内部对应到真实属性 / 方法，设置后会立即生效；除此之外还可以写行列定位键 `row | col`、标签参数 `bt jg`、提示 `tips` 等布局相关字段。


// 1) 创建面板
const panel = new 组件美化栏();

// 2) 全局主题 / 样式（可选）
panel.切换主题('dark');            // 或 'light'
panel.设置全局样式({
  radius: 6,                // 统一圆角
  labelColor: 0x66ccff,     // 标签文字颜色
  compBg: 0x1976d2,         // 所有控件主色(primary + ctrlBg)
  compFg: 0xffffff          // 所有文字颜色
});

// 3) 生成组件
panel.初始化(app, [
  {row:0,col:0,t:1,id:'btn1',bt:'按钮1',文本:'确定',tips:'保存修改'},
  {row:0,col:1,t:2,id:'edit1',bt:'名称',占位文本:'请输入…'},
  {row:1,col:0,t:7,id:'opa', bt:'透明度', 最小值:0,最大值:100}
], { rowGap:8, colGap:12 });





panel.初始化(app, cfgs[, layoutOpts])
panel.切换主题(mode)
panel.设置主题(obj)
panel.设置全局样式(obj)
panel.设置默认文字大小(size)
panel.设置默认组件高度(h)
panel.设置Tip主题(obj)
panel.on / panel.off / panel.emit
panel.设置内容(id, value)
panel.获取组件(id) ← 取到组件实例（用于监听或调用内部方法）
panel.获取容器() ← 返回面板最外层 PIXI.Container，可自定义拖动、缩放等
panel.销毁() ← 释放资源、移除所有子组件