动态面板：元件样式联动

动态面板：
①动态面板像一个透明袋(可调整大小)
②动态面板里面的状态State1…(层级)不透明(可调整大小)
③动态面板属性中的【自动调整为内容尺寸】(不勾选)

1.元件准备

注意：要调整好动态面板的大小和距离


2.设置交互样式，分两部分设置图片和矩形元件




3.要矩形与图标同时显示鼠标悬停的效果，可以在动态面板的元件属性中勾选【触发内部元件鼠标交互】

效果：边框互相遮挡情况；解决办法是为每个动态面板【鼠标移入时】事件的用例都添加一个动作，这个动作为【置于顶层】，选择元件为“当前元件”

4.新建交互——鼠标移入时——置于顶层

效果


5.设置"关注矩形框"的字色和边框颜色的交互样式

6.设置"Focus"动态面板的交互样式
新建交互——鼠标移入时——显示/隐藏

7.新建交互——鼠标移出时——显示/隐藏

8.在"Focus"动态面板上要把动态面板属性中的触发内部元件鼠标交互选上(同上第3步)

效果：边框被挡住

9.在【鼠标移入时】插入动作【置于顶层/底层】

效果

完成！