系统框架如何画,如何画篮球框架

大家相信，在日常的B端网页原型绘制过程中，会经常在类似的框架页面上绘制。其效果如下：

左侧显示次菜单。点击菜单后右边的内容会实时更改，一些合作伙伴可以在第一次制作时直接在每页上绘制菜单。例如：

但是，有一个问题是，如果后菜单发生了变化(例如，添加菜单)，则必须在每页上添加此菜单，并添加交互事件。从这些方法来看，后期修改可能非常麻烦。

那么有没有简单点的方法实现这个功能呢？

答案当然是肯定的，这里不得不提到axure基础元件中的内联框架

那么内联框架的作用是什么呢，通俗一点说,内联框架就是在固定的区域显示内容,如果显示不下了，可以拖动滚条移动到其他的部分，那么在这种框架的需求下，就比较适合使用了。那么下面咱们开始教学，咱们以1920*968（减去浏览器的顶部内容高度）的展示分辨率进行演示

1.新建一个框架页面，并进行页面划分区域并添加对应的元件，具体样式大家可以按照自己喜欢的样式进行编辑

2.新建两个子页面，员工花名册和员工档案库，并在两个页面里添加一下页面内容，用于后续查看页面跳转是否成功

3.接下来在框架中进行菜单功能的绘制。拖入矩形，并分别按照菜单的结构进行摆放

为二级菜单添加交互事件，首先将两个二级菜单添加至同一个选项组

然后为两个二级菜单添加选中的效果，这里就不做复杂的选中效果了，选中时直接字体加粗

将员工花名册设置为默认选中项；同时为两个二级菜单添加单击时的交互时间，点击时选中当前元件

到这里为止，左边菜单的效果就已经实现了，当然大家如果想做高保真或者更好的交互效果，可以自行进行添加，在这里就不产开给大家做赘述了

4.接下来开始设置内联框架相关的配置，首先需要配置默认打开时，展示哪个页面，这里举例，框架打开时，默认打开员工花名册，需要点击内联框架，选择默认框架目标为员工花名册

在点击二级菜单时，配置切换内联框架打开对应的页面，同样给另一个二级菜单页配置跳转的，页面

接下来就是运行查看效果了