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

如何利用動態(tài)面板來實現(xiàn)側(cè)滑菜單呢，一起來文中看看~

利用動態(tài)面板實現(xiàn)側(cè)滑菜單效果，實現(xiàn)過程如下：

1、準備首頁，標題欄添加一個菜單按鈕，用于控制抽屜菜單打開。

2、添加一個動態(tài)面板組件，將動態(tài)面板拖放到最終顯示的位置，設(shè)置動態(tài)面板的寬、高，動態(tài)面板的寬度比實際屏幕的寬度小，預(yù)留右側(cè)的空白；動態(tài)面板的高度，根據(jù)需要設(shè)置是否包含標題欄。

如下圖所示：

3、動態(tài)面板位置、大小設(shè)置完成，接下來，設(shè)置動態(tài)面板的2個狀態(tài)。雙擊動態(tài)面板，彈出“面板管理狀態(tài)”彈框，默認狀態(tài)是state1，重命名為“側(cè)滑前”，增加一個狀態(tài)，重命名為“側(cè)滑后”。

4、編輯狀態(tài)?！皞?cè)滑前”的狀態(tài)頁面，不添加任何內(nèi)容。雙擊“側(cè)滑后”，編輯抽屜菜單頁，添加組件，如下圖：

2個狀態(tài)的順序需要注意：側(cè)滑前的狀態(tài)要在前。

（為了使動態(tài)面板不影響其他組件的編輯，在狀態(tài)編輯結(jié)束后，將動態(tài)面板的順序設(shè)置為“置于底層”）

5、給菜單按鈕綁定單擊事件。在開始綁定點擊事件前，還有一件事情需要做，設(shè)置一個全局變量isSlide，用來判斷菜單是否已經(jīng)側(cè)滑，默認值設(shè)為false。(全局變量在工具欄“項目”中打開，具體不細說)

選中菜單按鈕，切換到屬性頁面，雙擊“鼠標單擊時”，添加點擊用例。當變量值isSlide=false時，菜單按鈕的點擊事件為打開側(cè)滑菜單；當isSilde=true時，菜單按鈕的點擊事件為關(guān)閉側(cè)滑菜單。

如下圖所示，為點擊事件的具體用例：

打開菜單：

1）添加用例時，添加一個判斷條件，isSlide=false。

2）將動態(tài)面板的順序，設(shè)置為頂層。（原先我們?yōu)榱朔奖闫渌M件編輯，將動態(tài)面板設(shè)置到底層，所以在這里，要將其設(shè)置回頂層，如果沒有設(shè)置到底層，這一步可以省略）

3）設(shè)置動態(tài)面板的狀態(tài)。設(shè)置為側(cè)滑后狀態(tài)，設(shè)置狀態(tài)面板切換狀態(tài)時的動畫以及動畫展示的時間。

4）將全局變量isSlide修改為true。

關(guān)閉菜單：

1）添加用例時，添加一個判斷條件，isSlide=true。

2）設(shè)置面板狀態(tài)，設(shè)置為側(cè)滑前狀態(tài)，設(shè)置動畫以及動畫展示事件。

3）重新將動態(tài)面板的順序設(shè)置為底層。（同樣，如果沒有設(shè)置底層的需求，這步可省略）

4）將全局變量isSlide修改為false。

總結(jié)：

• 添加動態(tài)面板，設(shè)置動態(tài)面板最終顯示位置和大小。
• 設(shè)置動態(tài)面板的2個狀態(tài)，側(cè)滑前和側(cè)滑后。2個 狀態(tài)的順序為：”側(cè)滑前“在前。
• 增加全局變量isSlide，判斷菜單打開的狀態(tài)。
• 設(shè)置觸發(fā)按鈕的點擊事件，根據(jù)isSlide的值，設(shè)置用例：打開菜單、關(guān)閉菜單。用例內(nèi)容包括：切換狀態(tài)面板的順序?qū)蛹墸ǚ潜仨殻?；設(shè)置面板狀態(tài)（側(cè)滑前，側(cè)滑后），含動畫和動畫時間? 修改全局變量isSlide的值（true，false）。

以上，結(jié)束~

本文由 @First_Step 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載

題圖來自Unsplash，基于CC0協(xié)議