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

編輯導讀：列表頁是APP中常見的頁面類型之一，它是承接導航頁與詳情頁的中間頁。網頁端PM需要了解常見列表頁的相關規范，本文作者根據多年的經驗對通用邏輯和文檔規范進行了總結，與大家分享，希望對你有所啟發。

Web后臺產品的列表頁通常由列表+分頁+ 搜索組成，接下來分別介紹他們的邏輯規范和應用場景。相關規范以Axure原型的方式整理到網址：https://fulgv0.axshare.com

01 列表項規范

列表項包含字段名和對應的字段值。我們需要了解他們的常用規范。

1. 列表項數量

建議列表項的數量不要太多，這樣一屏很難展示所有的列表項或者看不全每個列表項的值。

PM需要學會思考少即是多，而不是粗暴的展示所有數據給到用戶。

2. 列表項寬度

列表項寬度建議使用%表示，從而保證一屏幕可以看到所有列表項。

如果列表項寬度使用px表示，則無法100%保證不會超過一屏幕，即需要左右滾動。原因是列表項1寬度+列表項2寬度+…往往大于屏幕寬度，而且即使減少寬度也無法同時滿足不同用戶的屏幕分辨率。

通常前端開發為了省事，設置所有列表項的寬度一樣。

• 如果列表項很少并且字段值的字符數也不多，可以這樣設置。

• 如果列表項很多或者字段值的字符數不太固定，需要根據不同列表項的性質進行適當調整，才能保證不錯的視覺效果。

• 如果列表項對應的字段值會出現很多的字符串，超出寬度的部分則會自動換行。如果不想換行，則可以約束最多顯示前N字(后面的用省略號…表示，懸浮的時候用toast顯示完整的信息)

02 對齊規范

1. 列表項對齊

列表項默認靠左對齊，根據需要也可以居中對齊。

如果列表項很少并且字段值的字符數也不多，可以居中對齊。

如果部分列表項的字段值的字符數有多有少，此時居中對齊會比較丑。

2. 標題項對齊

列表項的字段名和字段值，需要保證對齊方式一致。不要出現字段名靠左對齊而字段值居中對齊這樣的奇葩效果。

03 分頁規范

1. 每頁條數

每頁默認顯示N條數據，超過則分頁顯示，默認展示第一頁。N通常為10、15、20。列表底部最好顯示每頁顯示N條，方便用戶理解。

注意：

• 有些列表頁由于業務需要，不需要分頁展示。需要提前說明。
• 對于自動加載的頁面最好在每頁下方提示文字”正在加載更多”，然后加載出第二頁，以此類推。列表全部加載完畢后，文字顯示”已經到底啦”

2. 顯示總條數

顯示當前列表的總條數，當搜索列表的時候則顯示對應結果的總條數。

3. 顯示總頁碼

顯示當前列表的總頁碼，總頁碼=總條數/每月條數的結果取整+1，如無余數則不+1。

4. 跳轉到第N頁

通常有4種實現方式①點擊對應頁碼去跳轉②點擊上一頁下一頁去跳轉③點擊首頁尾頁去跳轉④輸入頁碼直接跳轉。

04 搜索規范

搜索后進入詳情頁，然后返回列表依然保留原先篩選條件的搜索結果列表。比如我搜索指定余額區間的用戶，然后我查看他們的詳情，然后返回到該頁面的時候依然是這些搜索結果。而不需要重新搜索。

#專欄作家#

浪子，個人微信langzipm，公眾號：浪子畫原型(langzisay)。擅長于APP原型設計和產品架構。

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

題圖來自Unsplash，基于CC0協議。