view — 实现与 components.md 对照
对照基准:
- 规格:docs/refs/components.md#view
- 实现:
packages/flexui-ascf/src/components/view/view.ts
flexui-engine/.../adapters/view-adapter.ts
- Demo:
demos/.../view-demo/
模板使用 kebab-case(如 hover-class),组件 properties 为 camelCase(如 hoverClass)。
结论摘要
| 维度 |
结论 |
| 规格纳入属性 |
4/4 已实现:hover-class / hover-stop-propagation / hover-start-time / hover-stay-time |
| 与规格差异 |
无缺口;默认值与规格一致(none / false / 50 / 400) |
| 通用事件 |
bindtap / touch 系列经 adapter 映射(tap→click,含 pressin/pressout) |
| 规格未单列 |
id / class / style / hidden / data-* 由框架层处理,不计入本组件属性表 |
属性对照
| 属性(模板) |
类型 |
规格默认 |
components.md |
当前实现 |
说明 |
hover-class |
string |
none |
✅ 纳入 |
✅ hoverClass |
none 关闭点击态;非 none 时按住切换该类 |
hover-stop-propagation |
boolean |
false |
✅ 纳入 |
✅ hoverStopPropagation |
阻止祖先 hover;并 stopPropagation |
hover-start-time |
number |
50 |
✅ 纳入 |
✅ hoverStartTime |
按住后出现点击态延迟(ms) |
hover-stay-time |
number |
400 |
✅ 纳入 |
✅ hoverStayTime |
松手后点击态保留(ms) |
components.md:view 无 Skyline / WebView 分项,交付集合即为上表四属性。
事件对照(常用)
| 事件 |
components.md |
当前实现 |
备注 |
bindtap / catchtap |
(基础能力,未单列) |
✅ tap → native click |
view-adapter |
bindtouchstart / move / end / cancel |
(基础能力) |
✅ |
坐标写入 touches[0] |
bindlongpress 等 |
未在 view 节声明 |
⚠️ 视引擎/手势链路 |
非 view 交付清单 |
实现要点
- Hover 在 ASCF
view 组件内用 touch/press 监听 + toggleNodeClass 实现,不依赖 view-adapter 的 attributeMaps(adapter 仅事件映射)。
- Demo 覆盖四属性及内外层
hover-stop-propagation 行为。
- 与规格一致:需按住超过
hover-start-time 才出现 hover。
参考路径
| 角色 |
路径 |
| 交付规格 |
components.md#view |
| 组件定义 |
packages/flexui-ascf/src/components/view/view.ts |
| Native 适配 |
flexui-engine/driver/js/packages/hippy-ascf/src/adapters/view-adapter.ts |
| Demo |
demos/ascf-ai-demo/.../view-demo/ |