Axure RP是一款来自美国Axure Software Solution公司的旗舰产品,它是一款专业的快速原型设计工具。使用它,你可以快速创建应用软件或Web网站的线框图、流程图、原型和规格说明文档。无论你是负责定义需求和规格、设计功能和界面的专家,还是一名初学者,Axure RP都能够满足你的需求。

打开网易新闻 查看精彩图片

使用Axure RP,你可以轻松地创建各种原型设计,无论是低保真还是高保真的设计。同时,它还支持多人协作设计,使得团队合作更加高效。此外,Axure RP还支持版本控制管理,让你随时随地管理和维护你的原型设计。

Axure RP的优势在于它能够提高你的工作效率,减少你的时间成本。它让原型设计过程变得更加轻松和有趣,同时还能够让你的设计更加专业和精确。无论你是想创建一个简单的原型还是一个复杂的应用程序,Axure RP都可以帮助你轻松实现。

打开网易新闻 查看精彩图片

如果你正在寻找一款专业的原型设计工具,那么Axure RP绝对是你的不二选择。它不仅可以提高你的工作效率,还可以让你的团队更加协作高效。同时,它还可以让你的原型设计更加专业、精确。快来尝试吧!

软件自取

youmu66.top/?profile?xpt=O9SttpoLnyUym

安装步骤

1.鼠标右键解压到“Axure RP 9.0”

打开网易新闻 查看精彩图片

2.选中AxureRP-安装程序,鼠标右击选择“以管理员身份运行”

打开网易新闻 查看精彩图片

3.点击“Next”

打开网易新闻 查看精彩图片

4.勾选上I accept the terms in the License Agreement,点击“Next”

打开网易新闻 查看精彩图片

5.选择软件安装路径,点击“Next”

打开网易新闻 查看精彩图片

6.点击“Install”

打开网易新闻 查看精彩图片

7.软件正在安装,请耐心等待

打开网易新闻 查看精彩图片

8.取消勾选Launch Axure RP 9,点击“Finish”

打开网易新闻 查看精彩图片

9.双击打开【汉化文件】文件夹

打开网易新闻 查看精彩图片

10.复制该文件夹下全部文件

打开网易新闻 查看精彩图片

11.粘贴到软件安装路径(第5步设置的路径)下,点击“替换目标中的文件”

打开网易新闻 查看精彩图片

12.双击图标,启动软件

打开网易新闻 查看精彩图片

13.点击“输入授权”

打开网易新闻 查看精彩图片

14.双击打开【axure9注册机】文件夹

打开网易新闻 查看精彩图片

15.选中Keygen,鼠标右键点击“以管理员身份运行”

打开网易新闻 查看精彩图片

温馨提示:若打开没有注册机,说明被电脑杀毒软件隔离了,关闭杀毒软件重新解压即可。

16.Licensee输入:ABC,点击“Generate”

打开网易新闻 查看精彩图片

17.对应输入被授权人和授权密钥,点击“提交”

打开网易新闻 查看精彩图片

18.勾选不再显示,点击右上角的×,关闭该界面

打开网易新闻 查看精彩图片

19.安装结束

打开网易新闻 查看精彩图片

教大家在Axure中制作一个低代码可视化编辑器的原型模板。

一、效果展示

1、添加控件——点击对应控件,可以在主页内容中增加对应的控件;

2、修改内容——添加控件后,点击控件,可以在控件属性中修改不同控件的内容;

3、删除内容——如果添加错误控件,可以点击该控件的关闭按钮,就可以删除该控件。

打开网易新闻 查看精彩图片

二、制作教程

低代码可视化编辑器主要分成3部分的内容,左侧是添加控件,中部是页面内容,右侧是控件属性。

1. 添加控件

左侧添加控件栏,相当于一个菜单栏,我们可以在里面选择添加需要的控件。因为左侧控件基本都是由文字和图标组成,我们用中继器制作会比较方便。

1)制作材料

中继器,图片和文本标签。

将图片和文本标签组合在一起,然后放置在中继器里,文字颜色和填充颜色根据实际需要设置,也可以适当增加移入变色的样式。

中继器表格里需要两列,type就是元件的类型,对应文本标签,pic就是图标,对应图片元件

打开网易新闻 查看精彩图片

案例中增加了13种常用的元件,分别为单行输入框、多行输入框、数字输入框、密码输入框、月份选择器、日期选择器、时间选择器、单选按钮组、多选按钮组、下拉列表、文件上传、评分控件、滑动滑块,你们也可以根据实际需要增加或删除。

2)交互设置

在中继器每项加载时,我们要用设置文本和设置图片的交互,将type和pic列的值设置图片和文本标签的元件里。Axure10以下的要用这两个交互设置,如果是Axure10版本的,可以直接点击中继器里的连接,选择对应的元件即可。

打开网易新闻 查看精彩图片

鼠标单击文本标签和图片的组合时,即点击选择了该元件,我们用添加行的交互,将当前行元件的信息传递到页面内容中部的中继器。这里你们也可以用拖动事件,增加判断条件,当拖动到指定位置时才增加,这里作者为了方便就做在鼠标单击时。你们可以根据自己需要的效果来设置。

2. 页面内容

前面鼠标点击元件时,对应元件的组合就会在该区域显示出来,所以我们这一块的内容要用中继器来制作

1)制作材料

中继器、文本标签、关闭按钮、对应的元件、背景矩形。

这里我们要把文本标签和对应的元件放在动态面板里,有多少个元件就复制多少个动态面板,动态面板里每个状态的名称和中继器type里的名称一致,并且在里面放置对应的元件,案例中包括了13种常用的元件,分别为单行输入框、多行输入框、数字输入框、密码输入框、月份选择器、日期选择器、时间选择器、单选按钮组、多选按钮组、下拉列表、文件上传、评分控件、滑动滑块,所以我们要动态面板里应该要有13个对应的状态。

中继器表格里只需要有type一列,对应左侧元件中继器的type,上面提到鼠标单击左侧元件组合时,通过新增行的交互,将type列的值传递过来。后续我们通过交互,就可以显示对应的元件。

一般默认内容为空的话,我们中继器表格里就不填写数据。

注意,考虑到如果添加的元件太多,就会有一个长页面,所以我们可以通过把中继器转为动态面板增加滚动条,同时可以用设置锚点的交互,这样可以在新增元件的时候,将页面滚动到最下方,就是最新的位置。

2)交互设置

中继器没每项加载时,我们用设置面板状态的交互,将动态面板设置到状态面和type列的值对应的页面。

鼠标单击关闭按钮时,我们用删除行的交互,将当前行的内容删除。然后再用隐藏的交互,将右侧的元件属性的组合隐藏。

鼠标单击中继器内组合时,我们做一个高亮变色的效果,这样就知道选中了该行内容,所以我们要先把背景矩形设置选中样式,设置单选组,因为在中继器内部,所以记得要勾选隔离列表质检的选项组。设置完成后,在鼠标单击中继器内组合添加设置选中的交互,将背景矩形选中,这样就可以完成变色效果了。

当背景矩形被选中时,我们先用显示的交互,将右侧元件属性的组合显示,并且用设置面板状态的交互,让右侧元件属性显示对应页面的内容。

3. 元件属性

元件属性分成两部分内容,统一必填的内容,以经各个元件独立的内容,必填的内容包括想标题文字,是否为必填项。

独立的内容就要根据各个元件的属性,例如输入框就包括提示文字,下拉列表就包括了选项信息,上传控件就包括了限制上传的数量和文件大小……

打开网易新闻 查看精彩图片

大家根据不同的元件的独立属性,将他们放在同一个面板里不同的状态页面里,这里状态名也是要和type列里每行的值一一对应,有多少个元件类型就增加多少个状态页面,案例中包括了13种常用的元件,分别为单行输入框、多行输入框、数字输入框、密码输入框、月份选择器、日期选择器、时间选择器、单选按钮组、多选按钮组、下拉列表、文件上传、评分控件、滑动滑块,你们也可以根据实际需要增加或删除。

上面页面内容中讲到了鼠标单击元件背景就会被选中,高亮变色,所以右侧元件属性就会显示出来,并且根据type的值来设置显示对应的面板状态,我们就可以在里面填写该元件对应的信息。那么填写完成后,考虑到下一个元件的使用,就是说一个页面会同时存在几个相同的元件,例如有一个爱好的下拉列表,也有一个性别的下拉列表。因为右边元件属性是通用的,所以我们要做一个重置的操作,不然就会影响到其他元件属性的编辑。

所以这里我们用简单暴利的方式来解决,我们用设置文本的交互,将元件属性里的内容设置为初始值。

打开网易新闻 查看精彩图片

这个是最快捷的方式,更好的方式是,在页面内容中继器表格里增加对应的列,将元件的属性记录到中继器表格里,这样点击选中的时候,将对应的值传递到对应的元件即可,这样会更加高保真和实际。由于我做的时候时间优先,所以就用了第一种方法,设置为初始值,感兴趣的同学也可以用第二种方法来制作。