跳到主要内容

Bilup 界面指南

Bilup 的界面设计既让 Scratch 用户熟悉，又增添了强大的新功能。本指南将帮助你有效地浏览和自定义界面。

主界面布局​

整体结构​

┌─────────────────────────────────────────────────────┐
│                   菜单栏                          │
├─────────────────────┬───────────────────────────────┤
│                     │         舞台标题栏          │
│                     ├───────────────────────────────┤
│    积木面板          │                               │
│                     │          舞台               │
│   ┌─────────────┐   │                               │
│   │ 代码   │    │   │                               │
│   │ 造型│    │   ├───────────────────────────────┤
│   │ 声音  │    │   │        目标窗格            │
│   └─────────────┘   │                               │
│                     │    ┌─────────┬─────────────┐   │
│   积木工作区        │    │ 角色    │   舞台       │   │
│                     │    │         │   选择器     │   │
│                     │    └─────────┴─────────────┘   │
└─────────────────────┴───────────────────────────────┘

菜单栏​

顶部菜单栏提供对文件操作、设置和工具的访问。

文件菜单​

  • 新建：创建新项目
  • 从电脑加载：打开本地 .sb3 文件
  • 从 Scratch 加载：从 Scratch 网站导入
  • 保存到电脑：将项目导出为 .sb3

编辑菜单​

  • 撤销：撤销上一个操作(Ctrl/Cmd+Z)
  • 重做：恢复已撤销的操作(Ctrl/Cmd+Shift+Z)
  • Turbo 模式：切换高速执行

设置​

点击齿轮图标(⚙️)访问：

外观​

  • 主题：浅色、深色、高对比度
  • 语言：界面语言选择
  • 缩放：界面缩放选项

高级​

  • 帧率：30、60 或自定义 FPS
  • 高质量画笔：抗锯齿绘图
  • 自定义舞台尺寸：超出 480x360
  • 编译器：启用/禁用优化

插件​

点击插件图标(🧩)来：

  • 浏览插件：查看所有可用增强功能
  • 启用/禁用：切换插件功能
  • 配置：调整插件设置
  • 自定义插件：加载用户创建的插件

积木面板(左侧)​

标签导航​

代码标签​

主要的编程界面，包含：

  • 积木类别：运动、外观、声音、事件等
  • 积木搜索：快速查找积木
  • 自定义积木：用户定义的过程
  • 扩展：附加的积木类别

造型标签​

造型编辑器，具有：

  • 造型列表：所有角色造型
  • 绘图编辑器：内置绘图工具
  • 导入工具：从文件或摄像头添加图片
  • 矢量/位图：选择编辑模式

声音标签​

音频管理，具有：

  • 声音库：内置音效
  • 录音：录制新声音
  • 导入：添加音频文件
  • 编辑：裁剪和调整声音

积木工作区​

这是主要的编码区域，你可以：

  • 拖动积木从调色板到脚本区域
  • 连接积木以创建程序
  • 右键点击复制脚本
  • 用注释和空格整理代码

工作区功能​

  • 缩放：鼠标滚轮或缩放控件
  • 平移：拖动空白空间以移动视图
  • 搜索：Ctrl/Cmd+F 查找积木
  • 整理：自动整理积木

舞台面板(右侧)​

舞台显示​

舞台显示你的项目运行情况：

  • 绿旗：启动所有脚本
  • 停止标志：停止所有执行
  • 全屏：将舞台扩展到整个窗口

舞台控制​

  • Turbo 模式：⚡ 加速模式按钮
  • 帧率显示：显示当前 FPS
  • 自定义尺寸：调整超出标准尺寸

舞台标题栏​

舞台上方有附加控件：

  • 询问/回答：项目的输入处理
  • 变量监视器：显示变量值
  • 自定义控件：插件提供的功能

目标窗格​

管理角色和舞台：

角色选择器​

  • 添加角色：从库中选择、上传或绘制
  • 复制：复制现有角色
  • 删除：移除角色
  • 重命名：更改角色名称

角色信息​

对于选中的角色：

  • 名称：角色标识符
  • 位置：X 和 Y 坐标
  • 大小：缩放百分比
  • 方向：旋转角度
  • 可见性：在舞台上显示/隐藏

舞台选择器​

背景和舞台设置：

  • 添加背景：选择或创建背景
  • 舞台信息：舞台特定属性
  • 全局变量：舞台级数据

响应式设计​

桌面布局(1024px+)​

完整的并排布局，所有面板都可见。

平板布局(768-1023px)​

具有可折叠面板的堆叠布局。

移动布局(768px 以下)​

带有标签导航的单列布局。

自定义选项​

界面主题​

浅色主题(默认)​

类似于 Scratch 的明亮、高对比度设计。

深色主题​

针对低光环境优化的深色背景：

  • 减少视疲劳
  • 在黑暗环境中更好地集中注意力
  • 可自定义的主题色

高对比度​

注重无障碍的设计：

  • 最大对比度
  • 粗边框和轮廓
  • 优化屏幕阅读器

布局自定义​

面板大小​

  • 可调整分隔线：拖动以调整面板大小
  • 折叠面板：在不需要时隐藏
  • 记住首选项：布局自动保存

自定义 CSS​

高级用户可以注入自定义样式：

/* 示例：更大的积木文本 */
.blocklyText {
    font-size: 14px !important;
}

/* 示例：自定义配色方案 */
:root {
    --ui-primary: #your-color;
}

键盘快捷键​

全局快捷键​

操作Windows/LinuxMac
新建项目Ctrl+NCmd+N
打开项目Ctrl+OCmd+O
保存项目Ctrl+SCmd+S
撤销Ctrl+ZCmd+Z
重做Ctrl+Shift+ZCmd+Shift+Z
全屏F11F11
启动项目Ctrl+EnterCmd+Enter
停止项目Ctrl+Shift+EnterCmd+Shift+Enter

编辑器快捷键​

操作Windows/LinuxMac
切换到代码Ctrl+1Cmd+1
切换到造型Ctrl+2Cmd+2
切换到声音Ctrl+3Cmd+3
查找积木Ctrl+FCmd+F
放大Ctrl + '+'Cmd + '+'
缩小Ctrl + '-'Cmd + '-'
重置缩放Ctrl+0Cmd+0

无障碍功能​

屏幕阅读器支持​

  • ARIA 标签：全面的标签
  • 键盘导航：完整的键盘访问
  • 焦点指示器：清晰的焦点可视化

高对比度模式​

  • 系统集成：遵循操作系统偏好
  • 自定义主题：无障碍专用选项
  • 文字缩放：遵循浏览器文字大小

运动无障碍​

  • 大点击目标：更轻松的交互
  • 拖动替代方案：基于键盘的操作
  • 可自定义快捷键：可配置的快捷键

性能优化​

界面性能​

  • 虚拟滚动：流畅的大型列表
  • 延迟加载：按需加载内容
  • 高效渲染：最小化重绘

内存管理​

  • 资源清理：自动垃圾回收
  • 资源优化：压缩图像和声音
  • 缓存管理：智能缓存策略

界面问题故障排除​

常见问题​

界面无法加载​

  1. 检查浏览器兼容性
  2. 清除浏览器缓存
  3. 禁用冲突的扩展
  4. 尝试无痕/隐私模式

性能慢​

  1. 关闭其他浏览器标签
  2. 禁用不必要的插件
  3. 如有需要减小舞台尺寸
  4. 更新显卡驱动程序

布局问题​

  1. 将浏览器缩放重置为 100%
  2. 清除本地存储
  3. 禁用自定义 CSS
  4. 尝试不同的浏览器

获取帮助​

  • 浏览器控制台：检查错误消息
  • GitHub Issues：报告界面错误
  • 社区 Discord：获取实时帮助
  • 文档搜索：找到具体解决方案

Bilup 界面设计得既强大又易于使用。花时间探索功能并自定义布局以匹配你的工作流程偏好。

下一步：了解 项目 以开始创建和管理你的作品。