Skip to content

Cell 单元格 ​

列表单元格。左侧图标 + 标题(含必填红星与副标题),右侧值与箭头,底部分隔线。

契约源:lh-ui-core/specs/cell.json · 黄金用例:lh-ui-core/cases/cell.json(6 条,已翻译为 XCTest,macOS 宿主即可运行)

基本形态 ​

title 必填,value / label / icon 可选。bordered 控制底部分隔线(默认开)。

9:41Cell 基本
标题文字
右侧值
›
带副标题
这是副标题说明文字
›
无分隔线
值

HTML 模拟预览(iOS / SwiftUI 外观),非真机渲染

swift
LhCell(title: "标题文字", value: "右侧值", clickable: true) {
  // onClick
}

图标 / 必填 / 不可点击 ​

icon 走 LhIconMap 映射;required 在标题前显示红色星号; clickable = false(默认)时不响应点击(黄金用例 not-clickable-no-onclick)。

9:41Cell 扩展
左侧图标
›
*必填项
请选择
›

HTML 模拟预览(iOS / SwiftUI 外观),非真机渲染

API ​

Props ​

属性说明类型默认值
title标题(必填)String—
value右侧值String""
label标题下方副标题String""
icon左侧图标逻辑名(LhIconMap 映射)String?nil
bordered是否显示底部分隔线Booltrue
clickable是否可点击(控制箭头与点击 gate)Boolfalse
required标题前是否显示红色必填星号Boolfalse
onClick点击回调;clickable = false 时不触发(() -> Void)?nil

文字层级 ​

区域字号颜色
标题cell.fontSizeTitle(14pt)color.text.primary
副标题cell.fontSizeLabel(13pt)color.text.secondary
右侧值cell.fontSizeValue(14pt)color.text.secondary
必填星号cell.fontSizeTitlecolor.danger.default

令牌对照 ​

令牌用途
cell.paddingHorizontal / cell.paddingVertical内边距(跟随 spacing.base / spacing.sm)
cell.fontSizeTitle / cell.fontSizeLabel / cell.fontSizeValue三级文字字号
cell.iconSize左侧图标尺寸
cell.gap各区块间距(跟随 spacing.sm)
cell.borderWidth底部分隔线宽度
color.border.lighter底部分隔线颜色
color.text.{primary,secondary}标题与值/副标题颜色
color.danger.default必填星号颜色
color.background.default单元格底色

黄金用例对照 ​

case id断言本地测试
title-and-value-render同时绘制标题与值testTitleAndValueUseFontTokens
label-renders-secondary-tone副标题取次要文字色testLabelRendersSecondaryTone
required-uses-danger-token必填星号取危险色令牌testRequiredUsesDangerToken
bordered-emits-line-command分隔线消费 border.lighter 令牌testBorderedUsesBorderTokens
clickable-emits-onclick可点击时触发 onClicktestClickableIsInteractive
not-clickable-no-onclick不可点击时不触发 onClicktestNotClickableIsNotInteractive

另有暗色专项:testDarkColorsComeFromDarkTokens / testDimensionsAreIdenticalInDarkMode / testCellInitAndRender / testLayoutUsesCellTokens。

bash
swift test --filter LhCellTests    # macOS 宿主即可跑,无需模拟器