xsl
8a901176c4
- fix(tryon): 鸿蒙 http.multiFormDataList 真机发空包（400 请上传图片）→ TryonApi 手工构造 multipart，真机验证通过；换发型/换发色/换装全链路 MEIDA_TRYON 打点 - feat(hair): 60 款发型视觉分类男女（26/34）Segment 分栏；双图对比、8 色圆点、吸底应用发色 - feat(fitting): FittingRoomPage 预览+试穿黑胶囊+我的衣橱（preferences+filesDir 持久化）+精选衣橱（rawfile 30 件+manifest）+品类过滤+双槽位生成 - feat(diagnosis): 紫渐变落地页+五字段填写页（@Prop 修选择器回填）+预填跳 ReportCreatePage - chore(theme): 9 个色板 token 收口；首页入口改版
37 lines
1.1 KiB
Plaintext
37 lines
1.1 KiB
Plaintext
/**
|
|
* Segment —— 两枚胶囊分段控件（《美搭配与美学诊断-UI规范》§4/§7）。
|
|
*
|
|
* 使用方：发型页（女生/男生）、美学诊断填写页（男/女）。
|
|
* 形态：容器 IMAGE_BG 圆角 18 内边距 2；选中段主色底白字圆角 16。
|
|
*/
|
|
|
|
import { COLOR_PRIMARY, COLOR_IMAGE_BG, COLOR_TEXT_PRIMARY } from '../../core/Theme'
|
|
|
|
@Component
|
|
export struct Segment {
|
|
items: string[] = []
|
|
selected: number = 0
|
|
onSelect: (idx: number) => void = (_idx: number) => {}
|
|
|
|
build() {
|
|
Row({ space: 0 }) {
|
|
ForEach(this.items, (label: string, idx: number) => {
|
|
Text(label)
|
|
.fontSize(13)
|
|
.fontColor(this.selected === idx ? Color.White : COLOR_TEXT_PRIMARY)
|
|
.backgroundColor(this.selected === idx ? COLOR_PRIMARY : Color.Transparent)
|
|
.padding({ left: 20, right: 20, top: 7, bottom: 7 })
|
|
.borderRadius(16)
|
|
.onClick(() => {
|
|
if (this.selected !== idx) {
|
|
this.onSelect(idx)
|
|
}
|
|
})
|
|
}, (label: string) => label)
|
|
}
|
|
.padding(2)
|
|
.borderRadius(18)
|
|
.backgroundColor(COLOR_IMAGE_BG)
|
|
}
|
|
}
|