axure 如何设置选项联动_Axure RP 9基础教程（九）工具提示设置

工具提示是很多web页面常见的功能之一，具体的表现为：当鼠标光标悬停在页面上的元素时，显示工具提示。

这里给大家介绍工具提示的两种实现方法：一是Axure RP系统自带的工具提示功能，通过它可以创建基于浏览器样式的提示；另一种是创建自定义工具提示，然后再通过设置鼠标悬停事件将其显示。     一系统自带的工具提示功能 ( 一)部件设置 1. 打开一个新的RP文件，双击页面名称，打开新的页面 2. 从部件面板中拖拽所需部件到画布中。  

  (二)添加工具提示信息 1.选中添加的部件，这里使用的是照相机的图标，下文直接称“照相机”，然后切换到交互面板。

  2.我们会发现没有看到工具提示的设置。别着急，在面板的右上角，点击更多交互图标。

  3.或者选择照相机，打开右键快捷菜单，选择“工具提示”，这也是进行工具提示设置的另一个入口。

4.在弹出的菜单顶部的工具提示字段中输入你需要的提示文字，例如“请上传图片”。  

  (三)预览页面 1.点击预览，然后将鼠标悬停在照相机上，显示工具提示也就是我们输入的文字。 2.将鼠标移开，工具提示就会消失。  

  这种方式做的工具提示功能，设置方法比较简单。缺点是样式不是我们自己能够控制的，取决于你的浏览器是什么，不同的浏览器工具提示的样式不同。  二通过交互设置制作的的自定义工具提示 (一)部件设置 最开始的设置与系统自带工具提示的设置一样，就是创建照相机。从第三步开始发生有所不同。 3、从部件面板中拖拽一个矩形部件到编辑区中，放置在照相机的旁边。

4、设置矩形的文本为“请上传图片”，调整矩形的大小和样式。

5、选中矩形部件，点击工具栏中或样式面板中的隐藏图表的快捷按钮，将其隐藏。或者通过右键快捷菜单的“设为隐藏“，将创建好的自定义工具提示隐藏。

    (二)设置提示工具可见   1.选中照相机，点击交互面板中的新建交互。

  2.在用例事件列表中选择鼠标停放时。

  3. 选择显示/隐藏动作。

  4.在目标下拉列表中选择矩形-提示工具，可见性设置为“显示“。

  5.按照实际需要，可点击动画和更多选项，选择适宜的动画和显示选项。如设置淡入淡出的显示效果。

  6.点击确定按钮，保存交互设置。     三预览交互 1. 点击预览，将鼠标停放在照相机上，自定义工具提示显示。 2.将鼠标从照相机上移开，工具提示就会再次消失。

  需要使用哪种方式设置工具提示，主要的依据是你的实际需要，并不是一定要采用某种方式去做。上述两种方法各有优缺点，如果样式没有特殊要求可采用第一种。如果样式有具体要求，或者显示有特殊效果的话，参考第二种方式。   通过交互设置还能有不同的设置方法，大家也可以尝试一样。比如，设置其他的用例事件，比如使用其他的动作等等。欢迎大家留言与我们交流探讨。

往期精选

Axure RP 9基础教程(八)-交互按钮 (Interactive Button)设置

Axure中的“AdaptiveViews”(自适应视图)是什么

Axure 教程 | 使用键盘进行移动对象