项目 4 任务 2 网络摄像机：PictureBox、Image / Bitmap、照片列表

- 摄像头：自绘东围墙场景（Camera/scene.svg），按云台位置切成 640×480 帧（build-frames.ts）；
  Pan 每次转一格，红外对射被遮挡时画面出现翻墙的人；类名、委托、事件参数与教材 dll 一致，
  ImageRead 每 250 ms 在后台线程触发
- Image / Bitmap 保存真实图片数据：Save、FromFile、FromStream，文件夹不存在时报 GDI+ 一般性错误；
  图片每张只发给浏览器一次（按内容哈希缓存）
- 程序所在目录（AppDomain.CurrentDomain.BaseDirectory，编译检查单独放行）和当前目录指向可写的 bin/Debug，
  沙箱里在沙箱的临时目录
- PictureBox（SizeMode、BorderStyle）；设计器工具箱加"图片框"；运行区显示程序保存的图片，点开看大图；
  实训台摄像头图标显示开启状态
- 评分规则加图片框显示图片、摄像头开关与转向、保存图片三种检查；示例 p4-t2-网络摄像机
- 测试：摄像头端到端、图片读写与程序目录、AppDomain 编译检查、评分出错情况

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

web/src/designer/catalog.ts

@@ -179,6 +179,28 @@ export const CONTROLS: ControlDef[] = [
     ],
     initial: () => [['FormattingEnabled', bool(true)], ['ItemHeight', int(12)], ['Size', size(120, 88)]],
   },
+  {
+    type: `${FORMS}.PictureBox`,
+    label: '图片框',
+    group: '常用控件',
+    namePrefix: 'pictureBox',
+    defaultEvent: 'Click',
+    props: [
+      ...COMMON_PROPS.filter((p) => p.name !== 'Text' && p.name !== 'ForeColor' && p.name !== 'Font'),
+      {
+        name: 'SizeMode', label: '显示方式', description: '图片在图片框里怎样显示', type: 'enum', enumType: `${FORMS}.PictureBoxSizeMode`,
+        options: ['Normal', 'StretchImage', 'AutoSize', 'CenterImage', 'Zoom'],
+        optionLabels: { Normal: '原样放在左上角', StretchImage: '拉伸填满', AutoSize: '图片框随图片大小', CenterImage: '居中', Zoom: '按比例缩放' },
+        default: enumValue(`${FORMS}.PictureBoxSizeMode`, 'Normal'), category: '外观',
+      },
+      {
+        name: 'BorderStyle', label: '边框', description: '边框', type: 'enum', enumType: `${FORMS}.BorderStyle`,
+        options: ['None', 'FixedSingle', 'Fixed3D'], optionLabels: { None: '无', FixedSingle: '单线', Fixed3D: '立体' }, default: enumValue(`${FORMS}.BorderStyle`, 'None'), category: '外观',
+      },
+    ],
+    events: COMMON_EVENTS.filter((e) => e.name !== 'TextChanged'),
+    initial: () => [['Size', size(100, 50)], ['TabStop', bool(false)]],
+  },
   {
     type: `${FORMS}.CheckBox`,
     label: '复选框',