SuperAPI AI 工具集

avatar-background-color

前端与建站

查看项目

更新于 10-16 05:05

技能介绍

用途:在 Decentraland/sites 仓库中新增或修改任何头像表面(AvatarFace、自定义头像样式组件、EventCard 头像槽、导航栏头像等)时,统一使用由用户显示名派生的确定性背景色,使浏览器端与 unity-explorer 世界的头像颜色保持一致,映射 NameColorHelper.GetNameColor(见 ADR-292)。

主要能力:src/utils/avatarColor.ts 提供 getDisplayName({ name, hasClaimedName, ethAddress })(去除非字母数字 Unicode 字符,未认领名追加地址后四位)与 getAvatarBackgroundColor(displayName)(FNV-1a 32 位哈希→色相→HSV(hue,0.75,1)→#rrggbb)。已有钩子 useProfileAvatar、useCreatorAvatar、useCreatorProfile 会传播 backgroundColor,其中 Foundation 创作者在 isDclFoundationCreator 匹配时覆盖为品牌紫 #9d76e3。

使用方式:不要在组件内重新推导颜色,应从钩子取值,或在父级调用一次 getAvatarBackgroundColor(getDisplayName(...))。直接使用 decentraland-ui2 的 AvatarFace 时,因其不支持 sx/background 属性,需用 styled 容器通过 & .MuiAvatar-root 覆盖(用 && 提升优先级);EventCard 同理在包裹层覆盖;自定义 img/div 头像用 shouldForwardProp 过滤后转发或内联 style。静态资料用 useMemo 计算;尚无资料则在父级调用 useProfileAvatar(address, { skip: !address })。新增头像表面需补充测试,mock 钩子断言颜色生效,Foundation 场景断言 #9d76e3。

限制:禁止重新引入旧的 getCreatorColor(address)(djb2 仅基于地址,与 Unity 不一致);不要硬编码 Foundation 覆盖色,应导入 DCL_FOUNDATION_BACKGROUND_COLOR;对原始用户名必须先经 getDisplayName 再哈希,否则含空白、标点或未认领名时结果会偏离。参考 ADR-292 及 unity-explorer 的 NameColorHelper.cs 与 Profile.CompactInfo.GenerateAndValidateName。