感谢罗罗诺亚索作者分享的【Axure教程：图片局部开灯交互动效】文章；由于该原型是用AxureRP9实现的，因此本文将结合文章实现方法，使用AxureRP8.0实现，并升级实现方法，引用全局变量，使原型不被位置限制，可以更灵活的复制应用。在此，感谢罗罗诺亚索作者的分享。

效果如下：

一、界面布局

（1）拉入一张图片2作为底图，再拉入一个矩形，命名为黑层，大小与图片宽高一致。填充色为黑色，不透明度为60%。

（2）复制图片2，命名为图片1。从左侧元件库的基本元件中拉入一个矩形，宽高设置为80*80，从元件库的Icons中拉入一个心型矩形，宽高设置为60*60，两个矩形的填充色都为黑色，不透明度为60%。选中这两个矩形，运用布尔运算将去顶层，得到空心的矩形。

（3）将【图片1】和空心矩形【心】选中，右键转为动态面板，命名为灯，宽高为80*80。双击动态面板【灯】，将【心】移动到（0，0）位置。如下图所示：

静态原型如下：

二、交互实现