界面设计预览——Design 按钮即时查看效果
如何打开预览
在编辑 XML 布局文件时，点击 Action Bar（顶部工具栏）上的 Design 按钮即可切换到预览视图。再点一次或点 Edit 按钮切回编辑模式。
预览功能能做什么
| 能力 | 说明 |
|---|---|
| 实时渲染 | 展示当前 XML 定义的界面外观 |
| 红色选框 | 每个 View 周围有红色虚线框表示边界 |
| 点选跳转 | 点击预览中的 View 跳转到 XML 对应行 |
| 方向切换 | 横屏 / 竖屏预览 |
| 设备尺寸 | 模拟不同屏幕大小 |
预览的局限性
AIDE 的内置预览不是完整的可视化设计器，有以下限制：
- ❌ 不能拖拽添加或移动 View（不能在预览里拖 Button）
- ❌ 不能在预览里修改属性值（只能在 XML 里改）
- ❌ 复杂属性有时不能完全渲染（如自定义 Style、Theme）
- ❌ 不会执行 Java 代码（预览是静态的，不响应点击事件）
所以这个预览更像一个查看器而不是编辑器。它的主要作用是让你写 XML 时能即时看到效果，而不用每次都 Run 一次完整编译。
与 UI Designer 的区别
| 对比项 | 内置 Design 预览 | UI Designer（$2.99） |
|---|---|---|
| 查看布局效果 | ✅ | ✅ |
| 拖拽添加 View | ❌ | ✅ |
| 在预览中改属性 | ❌ | ✅ |
| 修改后直接更新 XML | 需手动写 | ✅ 自动同步 |
| 价格 | 免费 | $2.99 |
PhoneGap 项目的预览
PhoneGap 项目（HTML/CSS/JS）的预览更强大——点击 Design 按钮后渲染的是完整的 HTML 页面，支持即时显示 CSS 样式效果。这个功能在免费版 PhoneGap Edition 中已经内置。
