快好知 kuaihz

Axure RP官方教程翻译(3):显示隐藏的部件

文章分享了通过Axure来实现点击触发显示隐藏的部件的具体过程,一起看看吧~

本教程翻自Axure官方教程第3篇《Show Hidden widget》,通过点击触发显示隐藏的部件,实现效果如下:

STEP 0:下载练习文件

如果你还没有练习文件,下载AxureTraining.rp文件并且在Axure RP打开它。这个文件包含了Axure培训网站上每个教程用到的相关页面。我们建议一直都用我们准备的这个文件来完成教程,但是如果你不想,那也是ok的——即使你没有使用我们的培训文件,我们总是会告诉你为了完成每一个教程需要在新文件中创建什么。

AxureTraining.rp文件打开后如下:

STEP 1:配置

打开培训文件中的“Show hidden widget”页面。这里你会看到一张图片部件和一个对话气泡框部件

(要将图片设置成圆形,你可以通过拖拽图片部件左上角黄色的倒三角“圆角控制器”到部件的中间。要制作一个气泡对话框,首先添加一个形状部件,然后通过部件右上角灰色圆圈“形状选择器”选择对话气泡框。你可以通过点击和拖拽它的端点将对话框的箭头移动到左侧。)

通过点击勾选“Hidden”复选框来隐藏气泡对话框部件,不管是在上方Style工具栏还是在右侧Inspector面板中的Style标签栏来勾选都能达到同样的效果。

STEP 2:添加点击交互行为

选择图片部件。在右侧Inspector面板的Properties标签栏,双击“OnClick”来添加一个点击实例。

在Case Editor(OnClick)对话框,在左侧选择行为“Show”。

在右侧“Configure actions”标签下,选择“(Speech Bubble)”部件

点击确定关闭对话框

STEP 3:预览

预览原型。点击图片来展现气泡对话框。

本站资源来自互联网,仅供学习,如有侵权,请通知删除,敬请谅解!
搜索建议:部件  部件词条  隐藏  隐藏词条  翻译  翻译词条  教程  教程词条  官方  官方词条  
原型

 中继器系列(三):下拉选择框

中继器的表格“增删改查”请查看中继器系列一:《中继器系列一:信息新增、删除、简单筛选》和中继器系列二:《中继器系列二:信息修改》。今天给大家带来下拉选择框的套用...(展开)

原型

 简单6步用Axure绘制相机图标...

记录这些内容,只是觉得有趣,尽管可能看起来没什么用,但很多事情换个视角总会有些不同。步骤1:拖入一个矩形,宽高自定,设置圆角值、投影,填充类型选择为渐变,然后设...(展开)