组件和页面的添加及管理
左边栏是你添加和管理组件及页面的主要面板,下面是对左边栏内容的具体介绍。
添加组件
组件是组成页面的基本元素,点击【添加组件】的按钮即可在左边栏展开组件列表。你也可以通过快捷键 (⌥ C丨Alt C)快速唤出。
目前在我们的编辑器中,一共有三种组件资源:
系统组件
自定义组件
代码组件
你可以直接将想要添加的组件拖入目标容器中,或者在选中目标容器后双击组件进行添加。
如果你觉得组件太多,可以点击右上角的搜索按钮对当前选中组件类型的列表进行搜索。
你也可以通过快捷键快速添加比较常用的组件到页面或容器类组件中
文本——T
按钮——B
图片——I
视图——F
添加页面
点击下方图中的图标即可在项目中添加一个新的页面。
如果你想为你的页面添加分组的话,点击下方图中的图标即可。
添加分组成功后,你可以直接往分组中添加页面。
管理页面及组件
页面操作
你可以右键页面打开菜单管理你选中的页面,菜单包含以下操作:
复制:复制选中页面。(包含页面中的组件)
修改名称:修改页面名称。(亦可双击页面名称进行修改)
设为主页:“主页”即是用户打开应用或网站时默认打开的页面。
添加到分组:将选中页面添加到已存在的某个分组中。
删除:删除页面及页面中的全部内容。
如果你想快速预览项目中的所有页面,可以打开页面平铺模式(⌘ P 丨Ctrl P)
页面分组
分组不存在选中状态,但亦可执行右键操作,菜单包含以下操作:
修改名称:修改分组名称。(亦可双击分组名称进行修改)
取消分组:分组消失,分组内的页面仍然保留但不属于任何分组。
删除:删除分组及分组内的页面。
组件操作
组件的右键菜单包含以下操作:
拷贝:拷贝组件到剪切板。(⌘ C丨Ctrl C)
剪切:剪切组件到剪切板。(⌘ X丨Ctrl X)
粘贴:粘贴剪切板中的组件到目标组件。(⌘ V丨Ctrl V)
复制:将组件重新复制一份到同层级。(⌘ D丨Ctrl D)
选择:以选中的组件为基准选择同页面中的其它内容。详细内容可查看选择与显示
移动:移动组件的层级。
重命名:修改组件名称。(亦可双击组件名称进行修改;快捷键⌘ R丨Ctrl R)
保存为“自定义组件":将选中的组件保存到“自定义组件”列表中。(⇧ ⌘ K丨Shift Ctrl K)
创建视图:创建一个视图将所选内容包裹住。(⌘ G丨Ctrl G)
删除:删除所选组件。
搜索内容
当页面和组件过多时,你可以通过搜索页面/组件名及 ID 快速查找定位到你想要找的页面组件。
如果是在网页端,同一个组件会在多个断点下被命中。