在了解“列表构建器”之前，咱们先来了解下什么是“列表”和“构建器”。
列表是一种数据项构成的有限序列，即按照必定的线性顺序，排列而成的数据项的调集。常见的列表有新闻流、表格、事件列表、老友列表等。
在 java 中，构建器主要用于把复杂方针的构建进程抽象出来，使得复杂方针的构建能够分部件分别创立，从而依据需求构建出来十分复杂的方针。由此咱们能够推演出日常中大家口口相传的图表构建器、地图构建器等实际是在阐述图表、地图等依据某种规范或规则生成此类方针的进程。
因而，咱们今日要聊的“列表构建器”便是经过某种途径，达到用户所需的列表方针的进程。
在 B 端界面中，络绎框便是列表构建器的一种展示方式，用户从较大的数据调集中挑选出契合自己所需的较小的数据调集。一般大数据调集在左面（待选区），称之为源数据区；小数据调集在右边（已选区），称之为方针数据区。
B 端界面上为何会需求列表构建器这种组件呢？从实践经验来看，无外乎以下 2 点：
1. 所见即所得
源列表和方针列表在同一个页面，用户无需经过跳转页面来回检查源和方针数据，不仅提升了用户操作功率，也提升了用户操作的愉悦性。
2. 数据展示量大
列表构建器可展示的源数据空间和方针数据空间都比 select 组件大的多，这十分便利用户在界面上自由与直观地操作。关于 B 端产品来说，数据量大是不争的事实，在展示、操作、呈现上也是急需解决的问题。列表构建器的呈现在必定程度上解决了某些场景下的问题。
运用列表构建器规划方式的情形为：
- 源数据量大，且方针数据量也大的情况下，适合运用；
- 不想经过翻滚、跳转等方法检查源和方针数据时，适合运用。
依据不同场景下的不同需求，衍生出了列表构建器的多种形状，下面共享一下 B 端常见的列表构建器场景规划方式。
1. 根底列表构建器
What 是什么
根底列表构建器是列表构建器的根底用法，展示了数据量不大的源数据，用户经过挑选后承认方针数据。
When 运用场景
当源数据量小于大约 50 条时，且挑选的方针数据要直接可见时，能够考虑运用。
How 怎么运用
用户直接经过滚轮检查源数据中的方针数据，然后选中它们。当承认后，点击络绎按钮将已挑选的数据转入已选区。
B端体会细节（四）：列表构建器的规划方式
2. 可查找列表构建器
What 是什么
展示了数据量较大的源数据，且有查找功用，用户经过挑选后承认方针数据。
When 运用场景
当源数据量较大，用户已经无法经过在有限容器中翻滚鼠标快速查阅和定位数据时，能够考虑运用。
How 怎么运用
用户经过查找承认方针数据，勾选后再经过络绎按钮将已挑选的数据转入已选区。
B端体会细节（四）：列表构建器的规划方式
3. 可排序列表构建器
What 是什么
该列表构建器可对数据进行排序，让用户将本身关怀的数据前置。
When 运用场景
当方针数据量较大，用户需求将本身所关怀靠前展示，进行检查、比照、分析等操作时，能够考虑运用。
How 怎么运用
用户经过查找承认源数据中的方针数据，勾选后再经过络绎按钮将已挑选的数据转入已选区；再在已选区中将某些数据进行置顶展示或前置展示。
B端体会细节（四）：列表构建器的规划方式
4. 可自动络绎列表构建器
What 是什么
该列表构建器可直接将源数据络绎到方针数据区。
When 运用场景
当勾选的源数据无需反复承认时，能够考虑运用，这大大加快了用户的操作速度。
How 怎么运用
用户点击待选区数据的增加按钮，直接可将数据增加到已选区；点击已选区数据的删除按钮，也可将数据回归到待选区。
B端体会细节（四）：列表构建器的规划方式
5. 表格局列表构建器
What 是什么
望文生义，表格局列表构建器以表格的方式展示，便利用户多维度承认数据规模。
When 运用场景
当用户选取的成果数据需求数据本身的多维度属性来承认时，能够考虑运用。
How 怎么运用
用户经过滚轮检查或查找源数据中的方针数据，然后选中它们。当承认后，点击络绎按钮将已挑选的数据转入已选区。
B端体会细节（四）：列表构建器的规划方式
6. 标题式列表构建器
What 是什么
标题式列表构建器除了展示普通的数据，还有图片等信息。
When 运用场景
当源数据的展示需求愈加丰厚时，能够考虑运用。
How 怎么运用
用户经过滚轮检查或查找源数据中的方针数据，然后选中它们。当承认后，点击络绎按钮将已挑选的数据转入已选区。
B端体会细节（四）：列表构建器的规划方式
除了以上常用场景的列表构建器规划方式，依据事务的需求大家能够在此根底上持续拓展和衍生，丰厚 B 端界面的表现力，及满意事务日益丰厚的场景需求。
根据根底的常用列表构建器，不同产品依据本身的实际需求衍生出了多类构建器，咱们一起来感触下吧。
1. sketch 常用功用构建器
在 sketch 界面中，东西栏被规划成只显现用户认为常用的功用。用户只需经过拖拽增加的方法从东西调集中将常用的功用增加到东西栏上。
B端体会细节（四）：列表构建器的规划方式
2. sketch 常用颜色构建器
sketch 供给了常用颜色构建功用，关于规划师常用的颜色能够自行增加出来，构成一份常用颜色库。
B端体会细节（四）：列表构建器的规划方式
3. 使用参数相关构建器
使用需求在相关参数后才可运转。右边为参数调集，左面为使用与待相关参数列表，用户只需求从参数调集里边挑选方针参数拖拽到对应的使用容器中，即可完结使用与参数的绑定。
B端体会细节（四）：列表构建器的规划方式
4. 表格列显现字段构建器
当表格列十分多时，用户能够挑选列显现字段构建器来将常用列字段选取出来。如此表格会变得轻盈，且数据加载变快。
B端体会细节（四）：列表构建器的规划方式
5. word 底部栏元素构建器
鼠标右键点击 word 底部栏，会呈现底部栏上可展示的所有元素。用户点击勾选后，元素被展示到了底部栏上。
B端体会细节（四）：列表构建器的规划方式
6. 自定义模块构建器
富途牛牛答应用户自定义界面模块，便利用户按本身的习气检查行情和操作等。用户只需从富途牛牛供给的组件库中挑选出自己需求的，装备成自己想要的模块界面即可。
B端体会细节（四）：列表构建器的规划方式
7. 选成员构建器
很多 B 端产品的成员管理模块都需求涉及到增加成员，这时候会用到选成员构建器，将成员从一个池子增加到另一个池子。
B端体会细节（四）：列表构建器的规划方式
列表构建器在 B 端必不可少，产品经理和规划师依据产品本身的事务诉求，根据根底的列表构建器衍生出了很多种玩法，以不断提升 B 端的用户体会。
如果你发现了我在文中没有说到的列表构建器及其衍生事例，欢迎在文章下方留言~
B端体会细节（二）：通用性图标统一的秘诀
在企业级规划规范建设中，咱们会遇到相同功用的操作，不同规划师用了不同的图标按钮去规划，如下所示。这会导致用户在操作时发生疑问，同时会降低用户对产品的信任程度。
阅读文章 >>
B端体会细节（三）：按钮不可用的规划方式
规划方式来源于实践，又高于实践。
[link https://www.uisdc.com/universal-icon-unification]
什么是规划方式
De Dream 说：“方式意味着重用。
阅读文章 >>
欢迎关注作者微信公众号：「知果日记」
B端体会细节（四）：列表构建器的规划方式
