细谈对axure8的运用之各个元件(一)

    最近新接触的axure8软件进行原型设计,感触颇多,对axure8软件理解越是深入,越是感叹这款软件的强大。感觉以前自己用dreamweaver做原型真是...,应该说各有各的优点,我的感觉就是axure8更专业,更迅速,更简单与便捷,而dreamweaver则灵活性更高些。

    我们进入正题,这一篇我先带大家了解一下axure8的各种元件。axure8的元件有很多,基本分为基本元件、表单元件、菜单和表格、标记元件。几乎涵盖了你能用到的所有的元件,如果你不信就让我一一给你讲解。

    元件都在元件库中,一般在界面的左侧功能栏,如果你没有找到你的元件库,可以在视图》功能区》元件库勾选上,这样它会在左侧(一般左侧)功能栏上显示。

    我们先说基本元件,先说矩形这个元件,我们可以看到矩形元件一共有三个,分别是矩形1,矩形2,矩形3。它们的区别除了名字不一样,样式不一样基本就没有不一样了。用的方法就是选中矩形元件然后拖拽到你的界面上就好了,再右侧功能栏里可以看到矩形的属性、说明和样式。对单个元件的操作基本都在右侧功能栏里面,所以我们来看一下如何对矩形编辑出自己想要的效果。

    从上往下看,我们可以看到右侧功能栏上第一个位置是一个输入框,里面有注释是矩形名称,看到这个大家基本能明白这个的意思吧,就是给元件命名的意思。这个命名的作用就是在之后我们编辑事件的时候可以找到我们的元件,大家可以想象一下在我们界面中有不止一个矩形框,我们想编辑一个隐藏的功能,在一排长得差不多的矩形框中一个一个筛选出自己想要隐藏的矩形框是一件多么头疼的事情。

    接下来我们看到中间的说明栏,就如同我们写代码或者做笔记一样,我们要先对我们要做的东西命名,创作人,创作时间,东西是干什么用的进行记录。这里说明就是这个用途。一般比较大的原型都是团队做的,这样这个功能就很有必要,既能让想用你的元件的人知道元件的用途,还可以在他不懂的时候知道询问谁,或是发现错了找谁去纠错等等。

    编辑说明,最简单的记录元件的功能可以在元件默认的说明框中记录元件的功能。但是如果是团队项目中,你就不能这么随意了,要先自定义字段或配置,定义配置的作用可以根据公司模式自己定义要记录的格式,定义字段的作用是你定义配置时所使用的字段。有人可能说了定义字段就行了,为什么还要定义配置。这里有一种可能,就是你在定义完字段后,发现有那么一个元件需要更多的字段进行说明,但是你添加字段后又发现,你之前的元件说明都变了,多出了你根本用不上的字段,这时你就会明白配置的重要性,编程里经常提到的降低耦合就是这个意思。

    在编辑配置前,我们先添加字段,点击加号,我们可以看到可以添加四种类型的字段。分别是Text,选项列表,Number,日期。基本涵盖了我们能用到的所有类型,这里我给大家演示一个模式,大家可以跟我一起练习。

细谈对axure8的运用之各个元件(一)细谈对axure8的运用之各个元件(一)

    怎么样,很简单是吧,具体演示细节我相信也难不倒大家,我就不啰嗦了。

     接下来我们来说一下样式,样式的第一栏,就是位置·尺寸。有人会问为什么样式的第一栏不是元件样式,我个人是这么解读的,位置·尺寸独立于元件样式,也就是说元件可以样式一致但是位置基本没有一致的,所以位置·尺寸算是单独的样式。位置·尺寸基本没什么难理解的东西,大家试试就都明白了。

我们来讲比较核心的东西,就是元件样式了,在你新创建的元件都会有系统默认的元件样式,所以你可以先创建一个元件样式,就是元件样式下拉框右侧的图标,点开进去的就是元件样式管理界面,里面有所有的系统元件样式和你自己创建的元件样式。

    细谈对axure8的运用之各个元件(一)

你可以点加号进行创建,去一个合适的样式名称然后确认,你的样式就创建完了,然后在元件样式列表框中选择你刚创建的样式,这样你再编辑你的样式的时候,点击样式列表框旁的更新,你创建的样式也会随之更新,并且你的其他沿用你样式的元件也会更改。

我们接下来说一下样式,每个元件都有自己可以更改的样式,但是基本样式都一样,只是有的元件不让你更改。我们来说一下矩形框可以更改的样式。

第一个样式:填充,这个好理解,就是想元件中填充颜色。填充类型有两种,一个是单色,一个是渐变。颜色框中打红斜号的是无色,同时也可以设置不透明度。

第二个样式:阴影,分两种,一个是内阴影,一个是外阴影。外阴影是做立体效果的,而内阴影是做元件凹凸效果的,大家可以尝试的试试。

第三个样式:边框,这个可以定义边框的粗细,边框的可见,边框的颜色,边框的线段类型,和显示上下左右哪一个边框。这里如果你想不显示边框,你有两个方法,一个就是边框粗细选None,也可以选边框可见中那个边都不选。

第四个样式:圆角半径,你可以设置圆角半径,这个可以跟边框可见运用,指定那两个为圆角。

第五个样式:不透明,按百分比来配置矩形框的透明度。

第六个样式:字体,行间距,项目符号,对齐,填充都是对文本的编辑。说到字体,我们会发现可以在矩形框内写字。我们可以设置矩形框内字的字体,这里有一个功能为文字阴影,可以做出文字的立体效果。行间距就是文本行间距。项目符号就是在每行前加标识符。对齐就是文本对齐方式。填充就是文本与矩形框之间的间距。

    这里我们就把矩形框所有的样式都讲完了,接下来我们要讲第二个重点,就是属性。但是每个元件的属性都是一样的,所以我准备把所有元件都讲完了再系统的讲属性,因为有些数据需要多个元件协同完成。

    在接下来的基本元件中我需要重点讲的有四种,分别是热区,动态面板,内联框架,中继器。这四个是基本元件里比较难理解,但也是比较重要的元件。请大家敬请期待我的下一篇。