feat: 增加下载分享检查功能

This commit is contained in:
R524809
2025-11-20 17:54:16 +08:00
parent 654ea69915
commit ddab64bb20
11 changed files with 350 additions and 52 deletions
+103 -22
View File
@@ -1,5 +1,9 @@
import WordDrawService from '../../service/wordDrawService';
import { checkAndSaveImage } from '../../utils/saveImage';
import {
shouldShowShareGuide,
recordShareSuccess,
} from '../../utils/shareGuide';
import { PAPER_SIZE } from '../../constants/colors';
import { getWordsSvgData } from '../../utils/getWordsSvgJson';
import { WORDS } from '../../constants/words';
@@ -22,6 +26,7 @@ Page({
currentColor: '',
boxWidth: 0,
boxHeight: 0,
showShareDialog: false, // 显示分享引导弹窗
},
async onLoad() {
@@ -29,14 +34,17 @@ Page({
const hasShowPracticeDemo =
wx.getStorageSync('hasShowPracticeDemo') || false;
if (!hasShowPracticeDemo) {
this.setData({
words: ['好', '好', '学', '习', '天', '天', '向', '上']
}, () => {
wx.setStorageSync('hasShowPracticeDemo', true);
})
this.setData(
{
words: ['好', '好', '学', '习', '天', '天', '向', '上'],
},
() => {
wx.setStorageSync('hasShowPracticeDemo', true);
},
);
}
await this.setCanvasBoxSize();
await this.initCanvas()
await this.initCanvas();
},
async loadSvgWords() {
@@ -48,7 +56,11 @@ Page({
this.svgWords = svgWordsData;
wx.hideToast();
console.log('SVG汉字数据加载成功,共', Object.keys(this.svgWords).length, '个汉字');
console.log(
'SVG汉字数据加载成功,共',
Object.keys(this.svgWords).length,
'个汉字',
);
const { words } = this.data as any;
if (words && words.length > 0) {
@@ -70,7 +82,7 @@ Page({
// 用户点击重试,重新加载
this.loadSvgWords();
}
}
},
});
}
},
@@ -143,18 +155,25 @@ Page({
const { key } = e.detail;
const { words } = this.data as any;
const next = words.filter((_: string, index: number) => index !== key);
this.setData({ words: next }, () => this.renderPracticeContent().catch(console.error));
this.setData({ words: next }, () =>
this.renderPracticeContent().catch(console.error),
);
},
// 清空
clearWords() {
this.setData({ words: [] }, () => this.renderPracticeContent().catch(console.error));
this.setData({ words: [] }, () =>
this.renderPracticeContent().catch(console.error),
);
},
// 随机生成(取基础分类,过滤为可用SVG字,最多11个)
refreshWords() {
// 选取较简单的几个分类(如 0:基础独体字,1:生活高频字,2:自然与动作)
const candidate = WORDS.slice(0, 3).reduce((acc: string[], c: any) => acc.concat(c.words), [] as string[]);
const candidate = WORDS.slice(0, 3).reduce(
(acc: string[], c: any) => acc.concat(c.words),
[] as string[],
);
// 去重
const unique = Array.from(new Set(candidate));
// 打乱
@@ -164,10 +183,15 @@ Page({
// 过滤为支持的SVG字
const supported = this.getSupportedWords(picked);
if (supported.length === 0) {
wx.showToast({ title: '随机到的字暂不支持,重试一下', icon: 'none' });
wx.showToast({
title: '随机到的字暂不支持,重试一下',
icon: 'none',
});
return;
}
this.setData({ words: supported }, () => this.renderPracticeContent().catch(console.error));
this.setData({ words: supported }, () =>
this.renderPracticeContent().catch(console.error),
);
},
// 校验 & 分割
@@ -181,7 +205,6 @@ Page({
return matches || [];
},
setCanvasBoxSize() {
const query = wx.createSelectorQuery();
query
@@ -212,13 +235,17 @@ Page({
if (ctx) {
this.canvas = canvas;
this.ctx = ctx;
this.wordDrawService = new WordDrawService(canvas, ctx);
this.wordDrawService = new WordDrawService(
canvas,
ctx,
);
// 初始化时只绘制页眉和布局
await this.wordDrawService.drawLayout();
// 绘制完成后计算并缓存最大行列数(与实际绘制一致)
const { maxRow, maxCol } = this.wordDrawService.getMaxGridLayout();
const { maxRow, maxCol } =
this.wordDrawService.getMaxGridLayout();
this.maxRow = maxRow;
this.maxCol = maxCol;
@@ -269,18 +296,25 @@ Page({
}
// 处理布局和生成练字数据(基于实际最大行列数)
const characterData = this.processCharacterLayout(supportedWords, maxRow, maxCol);
const characterData = this.processCharacterLayout(
supportedWords,
maxRow,
maxCol,
);
this.wordDrawService.drawPracticeContent(characterData);
},
/** 检查汉字是否支持,返回支持的汉字列表 */
getSupportedWords(words: string[]): string[] {
return words.filter(word => this.svgWords[word]);
return words.filter((word) => this.svgWords[word]);
},
/** 处理汉字布局,生成练字数据 */
processCharacterLayout(words: string[], maxRow: number, maxCol: number): CharacterItem[] {
processCharacterLayout(
words: string[],
maxRow: number,
maxCol: number,
): CharacterItem[] {
let rowIndex = 0;
const characterData: CharacterItem[] = [];
const boundaryWords: string[] = [];
@@ -319,11 +353,58 @@ Page({
wx.showToast({ title: '请先生成练字贴', icon: 'none' });
return;
}
// 检查是否需要显示分享引导
if (shouldShowShareGuide()) {
this.setData({ showShareDialog: true });
return;
}
// 直接下载
checkAndSaveImage(this.canvas);
},
/** 关闭分享引导弹窗 */
onCloseShareDialog() {
this.setData({ showShareDialog: false });
},
/** 点击转发按钮 */
onShareToFriend() {
// 记录分享成功(用户点击了分享按钮,视为已分享)
recordShareSuccess();
this.setData({ showShareDialog: false });
// 允许继续下载
if (this.canvas) {
checkAndSaveImage(this.canvas);
}
wx.showToast({
title: '分享后即可继续下载',
icon: 'success',
duration: 2000,
});
},
/** 点击分享到朋友圈按钮 */
onShareToTimeline() {
// 记录分享成功(用户点击了分享按钮,视为已分享)
recordShareSuccess();
this.setData({ showShareDialog: false });
// 允许继续下载
if (this.canvas) {
checkAndSaveImage(this.canvas);
}
wx.showToast({
title: '分享后即可继续下载',
icon: 'success',
duration: 2000,
});
},
// 分享功能
onShareAppMessage() {
// 记录分享成功(用户真正分享了)
recordShareSuccess();
return {
title: '涂鸦丫-练字|识字|打印',
path: '/pages/copyBook/index',
@@ -331,11 +412,11 @@ Page({
},
onShareTimeline() {
// 记录分享成功(用户真正分享了)
recordShareSuccess();
return {
title: '涂鸦丫-练字|识字|打印',
query: '/pages/copyBook/index',
};
},
});