中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

移動鼠標放大縮小圖片在原型設計的時候算是很常用的功能，如何在Axure中實現呢？這篇文章給你解答。

關鍵步驟1：

底層是圖片，第二層是小矩形；小矩形隨著鼠標進行移動，圖片上加交互效果：鼠標移動。

以鼠標作為中心點，小矩形的X Y點在 鼠標X-小矩形寬度/2 ，鼠標Y-小矩形高度/2。

因這樣的設計導致鼠標在小矩形內部時無法生效，需要將鼠標移出小矩形外部才能生效，此時需要在圖片與小矩形上加一個頂層：大矩形，同時將大矩形填充色的透明度設置為0%

此時鼠標在大矩形上移動就會帶著小矩形移動

關鍵步驟2：

1.設置邊界，令小矩形不會在大矩形外部活動，即使超出會自動回到大矩形對應的位置

2.對小矩形加交互效果：加判斷條件

頂部：

If 小矩形TOP<大矩形TOP（條件中無法用target這個元件，同時多個元件存在時，不建議用target 直接用局部變量替代更加方便）

分析：此時小矩形的X不需要變，僅有Y需要變化

執行 小矩形X=小矩形X；小矩形Y=大矩形TOP

左邊部：

If 小矩形Left<大矩形left（條件中無法用target這個元件，同時多個元件存在時，不建議用target 直接用局部變量替代更加方便）

分析：此時小矩形的Y不需要變，僅有X需要變化

執行 小矩形X=大矩形的left；小矩形Y=小矩形Y

底部：

If 小矩形bottom>大矩形bottom（條件中無法用target這個元件，同時多個元件存在時，不建議用target 直接用局部變量替代更加方便）

分析：此時小矩形的X不需要變，僅有Y需要變化

執行 小矩形X=小矩形X；小矩形Y=大矩形bottom-小矩形高度

右部：

If 小矩形right>大矩形right（條件中無法用target這個元件，同時多個元件存在時，不建議用target 直接用局部變量替代更加方便）

分析：此時小矩形的Y不需要變，僅有X需要變化

執行 小矩形X=大矩形right-小矩形寬度；小矩形Y=小矩形Y

注意：選擇局部變量時，注意查看選擇局部變量的屬性，選錯就導致交互效果出錯

關鍵步驟3：

• 圖片隨著鼠標移動右側顯示圖片放大效果，右側新建動態面板
• 此時小矩形與動態面板是一類，原始圖片與放大圖片是一類
• 如小矩形為160*160.原始圖片為400*400，設置動態面板也為400*400，那么此時放大圖片的大小應該為 160/400=400/?,?=1000,放大圖片大小為1000*1000
• 放大效果的實現邏輯：小矩形往由移動==放大圖片往左移動，小矩形的移動距離計算：

小矩形X距離=小矩形left-大矩形left；小矩形Y距離=小矩形top-大矩形top；

• 小矩形與放大圖片的聯系就是：大矩形與小矩形的比例=要呈現的圖片的比例，即400/160=2.5，即小矩形移動距離*（-2.5）=要呈現的圖片的距離（左移）
• 在小矩形上加交互效果：

移動時：

令動態面板中的放大圖片進行移動：X=-（小矩形left-大矩形left）*2.5；Y=-（小矩形top-大矩形top）*2.5

注意：條件要設置為IF

本文由 @啦啦啦 原創發布于人人都是產品經理。未經許可，禁止轉載

題圖來自 Unsplash ，基于 CC0 協議