- runtime:仿真 WinForms 子集(Form、Button、Label、TextBox、ComboBox、 GroupBox、Timer、MessageBox、界面线程消息循环、跨线程检查)、 教材设备类库(DeviceCtrlHelper、LED 控件)、运行器(常驻编译服务 + 运行模式) - server:Bun + Hono,WebSocket 会话,每次运行一个进程,消息转发 - web:Vue + Naive UI,WinForms 风格窗体渲染、MessageBox、实训台 LED 屏 - 端到端测试与 100 个程序并发的压力测试 - 教材逐任务摘要(docs/教材摘要) Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
68 lines
2.6 KiB
TypeScript
68 lines
2.6 KiB
TypeScript
// 把运行器发来的 WinForms 属性值转换成 CSS。
|
||
// 运行器的序列化格式:Point → {x,y},Size → {width,height},
|
||
// Color → CSS 颜色字符串(未设置时为 null,表示继承父控件),Font → FontValue。
|
||
import type { CSSProperties } from 'vue'
|
||
|
||
export interface PointValue {
|
||
x: number
|
||
y: number
|
||
}
|
||
|
||
export interface SizeValue {
|
||
width: number
|
||
height: number
|
||
}
|
||
|
||
export interface FontValue {
|
||
family: string
|
||
size: number
|
||
bold: boolean
|
||
italic: boolean
|
||
underline: boolean
|
||
strikeout: boolean
|
||
}
|
||
|
||
/** Windows 中文字体在网页上的替代字体 */
|
||
const FONT_FALLBACKS: Record<string, string> = {
|
||
宋体: '"SimSun", "Songti SC", "Noto Serif CJK SC", "Noto Serif SC", serif',
|
||
SimSun: '"SimSun", "Songti SC", "Noto Serif CJK SC", "Noto Serif SC", serif',
|
||
黑体: '"SimHei", "Heiti SC", "Noto Sans CJK SC", "Noto Sans SC", sans-serif',
|
||
楷体: '"KaiTi", "Kaiti SC", "AR PL UKai CN", serif',
|
||
微软雅黑: '"Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", "Noto Sans SC", sans-serif',
|
||
'Microsoft YaHei': '"Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", "Noto Sans SC", sans-serif',
|
||
}
|
||
|
||
export function fontCss(font: FontValue | null | undefined): CSSProperties {
|
||
if (!font) return {}
|
||
const decorations = [font.underline && 'underline', font.strikeout && 'line-through'].filter(Boolean)
|
||
return {
|
||
fontFamily: FONT_FALLBACKS[font.family] ?? `"${font.family}", ${FONT_FALLBACKS.宋体}`,
|
||
// WinForms 字号单位是磅,96 DPI 下 1pt = 4/3 px
|
||
fontSize: `${(font.size * 4) / 3}px`,
|
||
fontWeight: font.bold ? 'bold' : undefined,
|
||
fontStyle: font.italic ? 'italic' : undefined,
|
||
textDecoration: decorations.length ? decorations.join(' ') : undefined,
|
||
}
|
||
}
|
||
|
||
/** 控件外框:绝对定位,坐标相对父控件的客户区 */
|
||
export function boxCss(props: Record<string, unknown>, autoSize = false): CSSProperties {
|
||
const location = (props.Location as PointValue | undefined) ?? { x: 0, y: 0 }
|
||
const size = props.Size as SizeValue | undefined
|
||
return {
|
||
left: `${location.x}px`,
|
||
top: `${location.y}px`,
|
||
width: autoSize || !size ? undefined : `${size.width}px`,
|
||
height: autoSize || !size ? undefined : `${size.height}px`,
|
||
color: (props.ForeColor as string | null) ?? undefined,
|
||
backgroundColor: (props.BackColor as string | null) ?? undefined,
|
||
display: props.Visible === false ? 'none' : undefined,
|
||
...fontCss(props.Font as FontValue | null),
|
||
}
|
||
}
|
||
|
||
/** 去掉助记符:WinForms 里 "用户名称(&U)" 显示为 "用户名称(U)","&&" 显示为 "&" */
|
||
export function displayText(text: unknown): string {
|
||
return String(text ?? '').replace(/&(&?)/g, (_, amp) => amp)
|
||
}
|