ZartUI Mobile · Filter 筛选栏

v1.0 · 单列 / 双列 / 三列布局

一、单列筛选（宽度 382px）
预设文字状态（请选择）
请选择
已选中状态
科技
二、双列筛选（单列 187px，间距 8px）
双列预设（均未选择）
请选择
请选择
双列混合（一个已选 / 一个未选）
北京
请选择
双列均已选择
分类A
分类B
三、三列筛选（单列 122px，间距 8px）
三列预设（均未选择）
请选择
请选择
请选择
三列混合（部分已选）
选项一
请选择
选项三
三列均已选择
全部
进行中
已完成

Filter 筛选栏规范速查表

尺寸

页面宽度414px
选择框高度36px
单列宽度382px
双列宽度187px × 2
三列宽度122px × 3
列间距8px
下拉箭头16×16px
圆角999px 全圆角

颜色

页面/区域背景#F5F7FA
选择框填充#FFFFFF
已选文字 (G60)#223355
预设文字 (G40)#A8B4C8
下拉箭头 (G40)#A8B4C8
按压态边框 (DB60)#3388FF

字体

预设文字14px / 400 · G40
已选文字14px / 400 · G60
文字内边距0 16px
箭头右边距12px

布局公式

单列414-16×2 = 382px
双列(382-8)/2 = 187px
三列(382-8×2)/3 = 122px
返回组件首页