| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566 |
- /**
- * 生成 81×81 TabBar PNG 图标(透明底,适合微信小程序)
- * 用法:node scripts/gen-tabbar-icons.mjs
- */
- import fs from 'node:fs'
- import path from 'node:path'
- import { fileURLToPath } from 'node:url'
- import sharp from 'sharp'
- const __dirname = path.dirname(fileURLToPath(import.meta.url))
- const outDir = path.resolve(__dirname, '../src/static/tabbar')
- const GRAY = '#666666'
- const PRIMARY = '#00BCD4'
- function svgIcon(type, color) {
- if (type === 'meal') {
- return `<svg width="81" height="81" xmlns="http://www.w3.org/2000/svg">
- <path d="M26 22 V48" fill="none" stroke="${color}" stroke-width="4" stroke-linecap="round"/>
- <path d="M34 22 V48" fill="none" stroke="${color}" stroke-width="4" stroke-linecap="round"/>
- <path d="M26 22 C26 16 34 16 34 22" fill="none" stroke="${color}" stroke-width="4" stroke-linecap="round"/>
- <path d="M48 22 V58" fill="none" stroke="${color}" stroke-width="4" stroke-linecap="round"/>
- <path d="M48 22 C48 16 56 16 56 22 V34 C56 40 48 40 48 34" fill="none" stroke="${color}" stroke-width="4" stroke-linejoin="round"/>
- <ellipse cx="40.5" cy="58" rx="22" ry="6" fill="none" stroke="${color}" stroke-width="3"/>
- </svg>`
- }
- if (type === 'order') {
- return `<svg width="81" height="81" xmlns="http://www.w3.org/2000/svg">
- <rect x="22" y="18" width="37" height="48" rx="6" fill="none" stroke="${color}" stroke-width="4"/>
- <line x1="30" y1="32" x2="51" y2="32" stroke="${color}" stroke-width="3" stroke-linecap="round"/>
- <line x1="30" y1="42" x2="51" y2="42" stroke="${color}" stroke-width="3" stroke-linecap="round"/>
- <line x1="30" y1="52" x2="44" y2="52" stroke="${color}" stroke-width="3" stroke-linecap="round"/>
- </svg>`
- }
- return `<svg width="81" height="81" xmlns="http://www.w3.org/2000/svg">
- <circle cx="40.5" cy="32" r="12" fill="none" stroke="${color}" stroke-width="4"/>
- <path d="M20 62 C20 50 58 50 61 62" fill="none" stroke="${color}" stroke-width="4" stroke-linecap="round"/>
- </svg>`
- }
- async function writeIcon(name, type, color) {
- const svg = svgIcon(type, color)
- const buf = await sharp(Buffer.from(svg)).png().toBuffer()
- fs.writeFileSync(path.join(outDir, name), buf)
- }
- async function main() {
- fs.mkdirSync(outDir, { recursive: true })
- const items = [
- ['meal.png', 'meal', GRAY],
- ['meal-active.png', 'meal', PRIMARY],
- ['order.png', 'order', GRAY],
- ['order-active.png', 'order', PRIMARY],
- ['profile.png', 'profile', GRAY],
- ['profile-active.png', 'profile', PRIMARY]
- ]
- for (const [file, type, color] of items) {
- await writeIcon(file, type, color)
- console.log('wrote', file)
- }
- }
- main().catch(err => {
- console.error(err)
- process.exit(1)
- })
|