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

Axure本身就提供了模板的功能，也就是說只要實現一次但可以一勞永逸，本文就一起來看看這個遮罩層實現過程和效果。

今天在做產品原型設計時，遇到了個關于動態顯現遮罩層的難點?！盁o奈”為追求高保真的效果，還是花了點心思做個原型實現。待做好回過頭來看看的話，其實這個效果的難度也不大，只是看個人意愿是否想做而已。

Axure本身就提供了模板的功能，也就是說只要實現一次但可以一勞永逸。下面就一起來看看這個遮罩層實現過程和效果吧。

做前端開發的同學都知道，在HTML實現一個遮罩層，只需要添加個浮動的DIV即可輕松實現。那么在Axure中如何去實現它呢？

如上圖所示，可以將這個遮罩層的實現分為如下2部分：

• ?主體內容，即遮罩層要蓋住的部分
• ?遮罩層組件，即遮罩層+其它裝飾部分（在Demo中只是增加了個Loading的動畫圖片來區分）

所以遮罩層的實現思路就清晰啦步驟如下：

1. 準備一個與你所想要遮蓋內容大小相同的矩形框，注意要減去邊框的大小，示例：主體內容大小為`600×400`，邊框寬度為**1px**，那么遮罩層的大小為`598*398`且是無邊框的。
2. 設置遮罩層的填充色，還有相對的透明度。
3. 加強遮罩層顯示的動畫效果（Axure上所支持的效果并不多，如不能夠滿足，可以采用文字描述闡明效果要求）。

接著用3個按鈕來做不同效果的展示：

打開遮罩層：

關閉遮罩層：

自動演示：

那么現在來看看最終的實現效果如下，請看下面的大屏幕：（點擊在線預覽）

如果想要做全屏的遮罩層就更加的簡單啦，只在要顯示組件上增加個燈箱的效果即可。

PS：示例源文件下載：遮罩層效果.rp

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

題圖來自Unsplash，基于CC0協議