组件规范：内容与展示
内容与展示类的组件是APP界面中占比最大的一类，其核心使命是：高效地组织信息，并清晰美观地呈现给用户
List 列表
一个垂直排列的连续性元素，用于展示同类数据集合
核心用途
1、展示同质化的信息
以文本为主，不涉及到丰富的内容结构。如设置页、通讯录、消息列表等
2、承载需要快速浏览的信息
当用户需要在一屏内快速浏览大量信息时，列表的屏幕利用率及阅读效率远高于卡片，常见于新闻资讯类应用
3、层级导航入口
作为其他页面的入口，常用于通往详情页
注意事项
1、不要承载不同类型的数据：如果每一行展示的内容结构差异很大，如一行文本、一行视频、一行图表，会破坏列表的整体性；
2、不要在列表项中放太多按钮：如果功能很多，可以用“…”收起来，保持页面的简洁。
交互细节
分割： 通过留白或分割线区分各列表项，分割线有全宽分割线和内缩分割线（iOS风格，左侧留出部分位置，增强垂直空间的连贯性）；
侧滑： 滑动列表项，显示具体的操作项，不用进入详情页便能管理数据，提高处理效率；
长按： 通常用于触发Context Menu或进入多选模式；
刷新： 下拉刷新——列表刷新的标准触发机制。
Accordion 手风琴
列表的表体：一组垂直堆叠的头部列表，点击头部可展开或收起详细内容区域
核心用途
Acordion的核心理念是“渐进式披露”，默认只展示重要信息，展开再显示细枝末节
1、FAQ常见问题解答
Accordion在移动端最常用的场景，默认展示问题标题，感兴趣才点开看答案
2、移动端导航菜单
二级或三级菜单常折叠在父级菜单下
3、复杂表单填写
默认只展开基础填写项，保持界面简洁
注意事项
1、不要用于核心内容：如果内容是用户必须获知的，不要藏起来；
2、不要全部收起来：accordion默认会展开一项，一方面告诉用户这是可展开的，另一方面提高信息传达效率。
交互细节
显示逻辑： accordion有两种展开逻辑——
- 互斥：展开A时，原本展开的B会自动收起；
- 独立：不同条目间互不影响，可以同时展开收起；
热区： 整行可点，不要只把热区限制在箭头图标上；
动效： 展开和收起需要有平滑的过渡动画，帮助用户理解空间关系，不会迷失视觉焦点； 头部吸附：当展开内容特别长，向下滑动页面时，建议让accordion的头部吸附在屏幕顶部。
平台差异
iOS：SwiftUI才纳入系统原生组件，列表式，视觉扁平，展开/收起箭头默认在左；
Android：系统原生组件，卡片式，带有阴影变化，展开/收起箭头默认在右。
Card 卡片
独立矩形容器，将零散的信息集合成一个逻辑单元
核心用途
1、聚合不同类型的内容
当一条数据包含多种类型的内容（文字、图片、按钮、标签等）且以图片为主体，卡片是最好的载体
2、展示长度不一的内容
瀑布流是卡片的经典布局，适合展示长短不一的图片、文字
3、承载独立性强的内容
每一张卡片之间没有必然的连续逻辑，相互独立，互不干扰
注意事项
1、不适合用于展示高密度的内容：由于卡片比较占空间，若需要一屏展示尽可能多的信息，列表是最好的载体；
2、不适合需要展示纯文本：特别是简短的文本内容，若一个页面全是小卡片，会显得很破碎。
交互细节
点击热区： 点击整张卡片任何区域，都应该触发一个关联动作（展开更多或跳转至新页面）；
补充操作： 若卡片内部还有其他功能按钮，必须为每个按钮留出足够的独立热区；当按钮过多时，考虑收起来或放进详情页；
布局形式：
- 垂直排列：最常见，像feed流一样单列向下排；
- 瀑布流：双列或多列，适合社媒、作品集等以图片为主的内容；
- 横向滑动：典型代表——轮播图
交互方式： 除了点击外，有些卡片还支持长按——触发Context Menu，滑动——切换内容或显示更多操作。
平台差异
iOS：用扁平卡片或描边卡片，通过背景色和边框来区分卡片，更轻量、更现代化；
Android：Material1.0、2.0 卡片习惯用阴影区分层级，目前的Material 3.0去阴影化，和iOS的风格趋于统一。
Table 表格
一个由行和列组成的网格容器
核心用途
1、多维数据对比
适用于横向对比不同项目的同一属性时，常见于股票应用
2、海量数据管理
当需要管理大量结构化数据时，如账单流水、预算表等
3、参数规格表
详细记录物品的各项参数，常见于商品详情页
注意事项
尽量不在移动端使用表格，表格横向内容与手机竖向空间存在天然冲突，如果不得不用，当前有三种主流的处理方式：
1、横向滚动+首列固定
固定首列数据，剩下列允许横向滚动，保留表格的完整结构和对比能力
2、变形
将表格每一行数据转化为列表项或卡片，表头变为卡片里的标签。 优点：适配手机竖屏浏览习惯； 缺点：丧失横向对比能力。因此适合“管理”场景，不适合“分析”场景。
3、选择性展示
默认展示最重要的2-3列数据，其余信息收纳进详情页或弹窗，牺牲信息获取效率以换取界面简洁
交互细节
对齐： 文本左对齐，数值右对齐，表头跟随数据的对齐方式；
表头吸顶： 当表格很长，向下滚动，表头必须固定在顶部；
排序： 点击表头，支持升序/降序切换；
分页： 固定每页内容，避免无限滚动。
平台差异
iOS：非系统原生组件，通常需要自定义布局；
Android：原生没有完美的复杂表格组件，通常依赖第三方库。
