MahApps.Metro 概览仪表盘
完全基于 Sciter UI 兼容规范打造的 Windows Metro / WPF 风格高级组件库
Metro 磁贴 (Tiles)
极速响应 (Sciter 5)
WPF Metro 风格
全组件解耦
按需避坑兼容
💡 Sciter 兼容亮点
1. 使用 flow 弹性流替代 Flex/Grid 布局，杜绝换行塌陷。
2. 使用原生 <popup> 层 + @mouseup，解决弹窗截断与点击吞噬。
3. 自定义 @set metro-scrollbar，原生媲美 WPF Metro 滚动条。
📊 核心组件指标
核心组件数:
30+ 常用控件
渲染引擎:
Sciter Direct2D / WARP
主题支持:
深色 / 浅色 / 7色 Accent
按钮与徽章 (Buttons & Badges)
遵循 Sciter 规范：双向居中文本、避免原生 button 文字裁切、使用 * 弹簧边距
基础按钮类型
组合按钮组
左选项
中选项
右选项
Metro 徽章与状态
默认 Accent
已成功
处理中
出错了
表单与输入框 (Form Controls)
固定宽度 Label、content-vertical-align 文本垂直居中、弹性尺寸 min-width: 0
文本输入框
用户名:
密码:
多行文本域 (Textarea)
备注说明:
下拉框与滑块 (Select & Sliders)
基于 Sciter 原生 <popup> + hslider 控件，告别绝对定位截断
Metro 自定义下拉框 (<popup>)
选择驱动:
Google Drive (网盘)▼
Google Drive (网盘)
Google Photos (相册)
OneDrive (微软云盘)
Dropbox (文件归档)
FTP (文件传输)
SFTP (安全传输)
WebDAV (网络盘)
选择协议:
FTP 传输协议▼
FTP 传输协议
SFTP 安全 SSH
WebDAV SSL
Metro 自定义滑块
音量调节:
65
透明度:
85
复选框、单选框与开关 (Checkboxes & Switches)
基于 SVG/CSS 背景的无依赖 Checkbox，支持平滑 transform 过渡 Toggle Switch
复选框 (Checkbox) & 单选框 (Radio)
WPF 风格 Toggle Switch
网络代理:
自动更新:
进度条与加载指示器 (Progress & Skeleton)
Sciter 专属 JS requestAnimationFrame 世代计数器，杜绝 CPU 泄漏与假死
Metro 线性进度条与环形 Progress
已下载: 75%
骨架屏加载动画 (Skeleton Loader)
选项卡与面板 (Tabs & Pivot Controls)
WPF Metro TabControl 控件风格
常规设置
高级网络
账号授权
这里是【常规设置】选项卡内容。
包含应用程序的基本运行模式、语言切换与缓存清理策略。
这里是【高级网络】选项卡内容。
支持配置 HTTP/SOCKS5 代理服务器、自定义 DNS 解析与端口分配。
这里是【账号授权】选项卡内容。
管理云盘 OAuth 授权令牌与 API 秘钥配置。
数据表格与文本日志 (Tables & Logs)
支持 Sciter 原生 selectable 划选复制属性的日志视图
Metro 数据网格
| 盘符 | 网盘类型 | 连接状态 | 已用空间 |
|---|---|---|---|
| Z: | Google Drive | 已连接 | 45.2 GB / 100 GB |
| Y: | OneDrive Pro | 已连接 | 128.0 GB / 1 TB |
| X: | FTP 服务器 | 连接中 | -- / -- |
运行日志 (只读
textarea，支持选择与复制)对话框与侧滑面板 (Dialogs & Flyouts)
WPF Metro 风格 Modal Overlay 与 Flyout Drawer 抽屉
弹窗与抽屉交互演练
打开 Metro 模态对话框
切换侧滑 Flyout 抽屉