Skip to content

Conversation

@Gaubee
Copy link
Contributor

@Gaubee Gaubee commented Dec 28, 2025

概述

新增 WalletMiniCard 和 WalletList 组件,优化 monochrome-mask 算法实现彩虹水印效果。

主要更改

新增组件

  • WalletMiniCard: 小尺寸钱包卡片图标,支持三角形纹理和彩虹水印
  • WalletList: 可复用的钱包列表组件,带选择和添加功能

Monochrome-mask 算法优化

  • clip 裁剪: 基于亮度转换后的 alpha 值裁剪透明区域
  • 亮度锚定: targetBrightness 参数确保不同图标显示效果一致
  • 高清支持: 使用 devicePixelRatio 提升 canvas 清晰度
  • 核心算法抽取: applyMonochromeTransform() 函数复用

集成更新

  • WalletSelector 使用 WalletMiniCard 替代字母头像
  • WalletListJob 集成链图标彩虹水印
  • 新增 src/lib/canvas/ 工具库(canvas-pool, monochrome-mask)

测试

  • WalletMiniCard: 11 个测试用例
  • WalletList: 13 个测试用例
  • WalletSelector: 更新测试用例

Storybook

  • WalletMiniCard: 多个 stories 展示不同尺寸和效果
  • WalletList: 9 个 stories 展示各种场景
  • WalletSelector: 更新 stories 使用不同链图标

- 新增 WalletMiniCard 组件:小尺寸钱包卡片图标
- 新增 WalletList 组件:可复用的钱包列表
- 优化 monochrome-mask 算法:
  - 支持 clip 裁剪透明区域(基于亮度转换后的 alpha)
  - 支持 targetBrightness 亮度锚定
  - 使用 devicePixelRatio 提升清晰度
- WalletSelector 使用 WalletMiniCard 替代字母头像
- WalletListJob 集成链图标彩虹水印
- 新增 canvas-pool 和 monochrome-mask 工具库
@Gaubee Gaubee merged commit c1738fe into main Dec 28, 2025
5 checks passed
@Gaubee Gaubee deleted the feat/wallet-mini-card-rainbow branch December 28, 2025 08:46
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants