国外亚洲成av人片在线观看,热99re久久精品这里都是精品,天堂网在线最新版www,国产成人av区一区二区三,51久久成人国产精品麻豆

編輯導(dǎo)讀：在手機端進(jìn)行操作時，上下滑動是最常做的動作。想要實現(xiàn)這個一簡單效果，背后有錯綜復(fù)雜的工作。本文作者將從四個方面，分析如何用更簡單的方法完成上下滑動的功能，一起來看一下吧。

在網(wǎng)上看了很多大神的文章，學(xué)會了在手機端實現(xiàn)上下滑動的效果。但是有感于此功能的錯綜復(fù)雜，希望本文章可以用更簡單的思路，幫助大家更好地理解上下滑動的功能。

預(yù)覽地址：https://t2og3w.axshare.com

一、明確

首先明確：這邊只講上下滑動，且按照我的方法，可以做出這個效果。

二、元件準(zhǔn)備

第1步：從元件庫中拖一個動態(tài)面板命名為“內(nèi)容面板”高“500”。

第2步：在第1步的“內(nèi)容面板”動態(tài)面板中再加一個動態(tài)面板，叫”拖動面板“，高“800”。最后效果中顯示的頁面內(nèi)容，是添加在這個拖動面板里面的。

三、滑動原理

我們來理解一下上下滑動的原理：

• 向上滑動時，拖動面板在y軸的活動范圍是：-300；頂部邊界是≥-300，且≤0;
• 向下滑動時，拖動面板在y軸的活動范圍是：300；底部邊界是≥500，且≤800;

四、添加交互事件

選中“內(nèi)容面板”動態(tài)面板，添加交互事件如圖：

• 注意：選中的是“內(nèi)容面板”動態(tài)面板，目標(biāo)元件是“拖動面板”動態(tài)面板，事件是“向上滑動”
• 移動范圍是：y軸上-300的距離（即“內(nèi)容面板”和“拖動面板”的高度差）
• 添加邊界：頂部邊界≥-300，頂部邊界≤0
• 添加動畫效果：線性，500毫秒

繼續(xù)選中“內(nèi)容面板”動態(tài)面板，添加交互事件如圖：

• 選中的是“內(nèi)容面板”動態(tài)面板，目標(biāo)元件是“拖動面板”動態(tài)面板，事件是“向下滑動”。
• 移動范圍是：y軸上300的距離（即“拖動面板”和“內(nèi)容面板”的高度差）
• 添加邊界：底部邊界≥500，底部邊界≤800
• 添加動畫效果：線性，500毫秒

這樣，手機端上下滑動的功能就大致實現(xiàn)了。

結(jié)語：實際操作中，大家制作的面板高度各不相同，但只要理解這個意思，自行加減高度，就可以實現(xiàn)滑動效果。

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

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