一、擦除法1.设计思路其设计思路是当鼠标指针指向特定区域时,显示功能按钮,当鼠标指针离开该区域时,按钮消失。其实现的方法是通过设置热区响应,进入该热区时,显示功能按钮,当离开该热区时,擦除功能按钮。按钮的出现和消失是随着激活显示按钮热区和激活擦除按钮热区响应实现的。由于工具按钮的隐藏是通过擦除图标实现的,因此,暂且称其“ 擦除法”。
2.设计方法(1)在主流程线上放置一个【交互】图标,在其右侧放置两个【映射】图标,分别命名为“显示按钮 ”和“清除按钮”,其响应类型设置热区(hot spot)。见图1。
(2)双击【显示按钮】交互按钮,设置热区位置、大小及参数如图2所示。
(3)打开显示按钮【映射】图标,在流程线上放置一个【交互】图标,命名为“按钮组”,在其右侧放置两个【映射】图标,分别命名为“按钮1”、“按钮2”(仅以两个按钮为例,读者可以根据自己的设计需要随意增加),其响应类型设置为按钮响应。双击显示按钮交互按钮,设置按钮位置、大小及参数如图3所示(注意各个按钮一定要放置在显示按钮热区中)(4)如果设置若干功能按钮,其具体设置可参考按钮1的设置。这里不一一叙述。
(5)双击清除按钮交互按钮,除设置其热区位置与显示按钮有所不同外,(如上图3所示)其余参数设置和显示按钮相同。
(6)打开清除按钮【映射】图标,在流程线上放置一个【擦除】图标,命名为“清除按钮”。
(7)双击清除按钮【擦除】图标,用鼠标点击“按钮1”和“按钮2”,使设置窗口呈现图4所示,其作用是当鼠标指针进入擦除按钮热区时,将所有按钮擦掉。由于擦除按钮热区设置在紧邻显示按钮热区上方,所以,当鼠标指针从显示按钮热区向上移动时,经过擦除按钮热区,执行【擦除】图标,擦除所有显示按钮。
二、移动法1.设计思路其做法是将按钮以热区的形式设计在可移动的工具条上,当鼠标指针指向特定区域时,显示工具条,当鼠标指针离开该区域时,通过移动图标,将工具条移出画面隐藏起来,由于工具按钮的隐藏是靠移动图标将其移出显示画面以外,姑且称其“移动法”。该法较擦除法复杂。
2.设计方法(1)在主流程线上放置一个【交互】图标,在其右侧放置两个【显示】图标和两个【映射】图标,分别命名为“工具条”、“按钮1”、“进入按钮1”、“移动工具条”,其响应类型均为热区(hot spot),如图5 示。
(2)双击工具条【显示】图标,装入工具条图片,双击“工具条”交互按钮,设置热区位置、大小、参数及工具条位置大致如图6所示(注意热区大小及以后出现的热区的位置关系)(3)双击“按钮1”交互按钮,设置热区位置、大小如图6所示,其他参数设置为将match项设置成 cursor in area, cursor项设置成手形。选中p erpetual项,将erase设置为before next entry(4)打开“按钮1”【显示】图标,装入设计好的按钮1被激活时的图片,见图7,调整该图片的位置使其正好覆盖工具条按钮1的位置。注意此时应将modify 菜单下的icon properties中的direct to screen项选中。
同时将其所在层次置于比工具条高一层。
(5)双击移动工具条交互按钮,设置热区位置、大小及参数如下图8所示(注意该热区应与工具条热区紧密相邻),将match项设置成 cursor in area,cursor项设置成 none。
(6)打开移动工具条【映射】图标,在流程线上放置一个【移动】图标。
(7)双击“工具条”显示图标,使工具条图片显示在设计窗口中,按住shift键不放,双击【移动】图标,用鼠标点击工具条图片,并垂直向下拖曳,直至全部移出显示窗口消失。调整参数设置如图9。
(8)在【移动】图标下放置一【擦除】图标,双击【擦除】图标,点击按钮1图片(如果还有按钮2、按钮3、按钮4等一并点击)。
(9)双击“进入按钮1”交互按钮,设置其热区位置、大小及参数和“按钮1”的设置基本相同,不同点是mat ch项选择single-click。进入“进入按钮1”【映射】设计窗口,在此设计单击按钮1需要执行的内容。
(10)按钮2、按钮3、按钮4等可参考按钮1进行设计,这里不再叙述。
以上是笔者总结设计隐藏工具按钮的两种方法,读者可参考制作,引入隐藏工具按钮后,相信你的作品会有新的起色。
新闻热点
疑难解答