列表左右箭头滑动_移动端列表设计

首先先说一下垂直列表，它是纵向罗列多个条目，这是最基本的列表形式，无论是手机端还是网页端都会使用到这种布局，在App中也应用广泛，这是一种非常干净和清晰的列表方式，用户容易理解，也很容易找到自己的目标。

垂直列表

对于垂直列表，用户的阅读习惯是从左往右，从上往下，再者就是条目的详细程度与数量之间的平衡。就是条目越详细，意味着占的空间越大，单屏上显示的数量就会越少，所以具体情况要根据需求做出判断，对于订单用户可能更关心最近的订单，并且如果知道详细信息，就不用点击进去在查看，但是如果放在通讯录里面，用户希望在同一时间内能够看到更多的内容，这样也就能更快的找到目标，所以我们要做好条目数量与信息详细程度之间的平衡。

常见的列表形式如下图，要按照实际的需求选择合适的方案。

常见列表形式

列表形式还有比较特殊的两种形式，比如微信的聊天列表是以对话框的形式。

横向列表

横向列表

一般大家都叫它轮播面板，只需要左右滑动面板就可以实现图片的切换，它一次就着重展示一个条目，这种形式常常位于页面的上方作为广告位展示或推广商品，有大图展示型当然也就有小图展示型，这相当于之前的大图，小图能展示更多的内容，不管是大图还是小图，在本质上都是横向罗列，把信息藏在界面外，因此能够充分利用页面空间，但是必须要有提示，否则用户并不知道可以滑动，就像上面的轮播面板使用了原点指示器。

小图展示型

网格列表

网格列表结合了垂直列表与横向列表，就像相册使用了网格列表，网格列表主要以展示图片为主，偶尔会配合一些文字说明，如果想展示大量的图片，网格列表是非常合适的展现形式。

瀑布流

瀑布流是网格列表的一种变种形式，瀑布流的排版比较随意，类似于花瓣。

总结

垂直列表：冷静、清晰，常用于二级导航，比如微信发现页面，这样结构清晰，一目了然，也可用于一级导航，但是需要页面层级很浅，比如邮箱；

轮播面板：隐藏内容，充分利用空间，让用户在同一时间只专注于一个目标，并且往往配合大图或者大背景，获得较好的体验，但是用户很难跳转到非相邻的页面，所以比较适合一些选项比较少，且不频繁跳转的App中；

网格列表：能同时显示大量图片，提升界面魅力，常用语手机主界面，主要以平铺的形式去展示，更加扁平化，也可用于二级导航，比如支付宝首页页面。