diff --git a/pets-fe/pages/idcard/idcard.js b/pets-fe/pages/idcard/idcard.js index 6f43e6b..d3bae6c 100644 --- a/pets-fe/pages/idcard/idcard.js +++ b/pets-fe/pages/idcard/idcard.js @@ -94,11 +94,10 @@ Page({ const cardW = W - pad * 2; const fx = pad, cardW2 = cardW; - const tags = (c.personality || '').split(',').filter(Boolean); // ══════════ 正面卡(暖黄)══════════ // 正反两张卡等高(都用 cardH),中间内容垂直居中,避免正面留空 - const cardH = 540; + const cardH = 510; const fH = cardH; const fY = pad; const gf = ctx.createLinearGradient(fx, fY, fx, fY + fH); @@ -164,35 +163,9 @@ Page({ kvF('毛色', c.color, avY + 168); kvF('年龄', c.age, avY + 206); - // 性格标签(没有就不画,避免留空行);性格+介绍整体在 info 和底栏之间垂直居中 - const midTop = fY + 300, midBot = fY + fH - 92; - const blockH = (tags.length ? 90 : 0) + (c.intro ? 70 : 0); - let ty = midTop + Math.max(0, Math.floor((midBot - midTop - blockH) / 2)); - if (tags.length) { - ctx.textAlign = 'left'; - ctx.fillStyle = '#8A5A18'; - ctx.font = '600 24px sans-serif'; - ctx.fillText('🐾 性格标签', fx + 34, ty); - ty += 44; - const tagColors = [['#FFE7A8', '#8A5A18'], ['#D6E9FF', '#2E6DA8'], ['#FFD9DE', '#C24A63']]; - let tx = fx + 34; - tags.forEach((t, i) => { - ctx.font = '23px sans-serif'; - const tw = ctx.measureText(t).width + 32; - const col = tagColors[i % tagColors.length]; - ctx.fillStyle = col[0]; - this.roundRect(ctx, tx, ty - 28, tw, 40, 20); - ctx.fill(); - ctx.fillStyle = col[1]; - ctx.textAlign = 'left'; - ctx.fillText(t, tx + 16, ty); - tx += tw + 14; - }); - ty += 46; - } - - // 介绍 quote + // 介绍 quote(在 info 和底栏之间垂直居中) if (c.intro) { + const ty = fY + 300 + Math.max(0, Math.floor(((fY + fH - 92) - (fY + 300) - 60) / 2)); ctx.fillStyle = 'rgba(255,255,255,.6)'; this.roundRect(ctx, fx + 34, ty, cardW2 - 68, 60, 16); ctx.fill(); @@ -229,10 +202,10 @@ Page({ ctx.textAlign = 'left'; ctx.fillStyle = '#8A90AE'; ctx.font = '600 27px sans-serif'; - this.spacedText(ctx, star + '星人地球移民', fx + 44, bY + 70, 8); + this.spacedText(ctx, star + '星人地球移民', fx + 44, bY + 64, 8); ctx.fillStyle = '#3E4A63'; - ctx.font = '800 60px sans-serif'; - ctx.fillText('居民身份卡', fx + 44, bY + 150); + ctx.font = '800 58px sans-serif'; + ctx.fillText('居民身份卡', fx + 44, bY + 140); // 资料行(标签 + 值) const rowX = fx + 44; @@ -245,14 +218,14 @@ Page({ ctx.fillStyle = '#3E4A63'; ctx.fillText(value || '—', rowX + 160, yy); }; - let ry = bY + 210; - kvB('主人', c.owner, ry); ry += 48; - kvB('联系电话', c.phone || '未验证', ry); ry += 48; - kvB('签发机构', c.org || '肉垫计划', ry); ry += 48; + let ry = bY + 198; + kvB('主人', c.owner, ry); ry += 46; + kvB('联系电话', c.phone || '未验证', ry); ry += 46; + kvB('签发机构', c.org || '肉垫计划', ry); ry += 46; kvB('有效期限', c.validity || '永久有效', ry); // 小程序码(右下角,直接落在淡紫底上) - const qrD = 120, qrX = fx + cardW2 - 44 - qrD, qrY = bY + bH - 34 - qrD; + const qrD = 114, qrX = fx + cardW2 - 44 - qrD, qrY = bY + bH - 30 - qrD; ctx.fillStyle = '#fff'; this.roundRect(ctx, qrX, qrY, qrD, qrD, 14); ctx.fill();