feat:下载分享检查

This commit is contained in:
R524809
2025-11-21 17:17:36 +08:00
parent ddab64bb20
commit ec773a650c
27 changed files with 267 additions and 181076 deletions
+81 -90
View File
@@ -2,11 +2,7 @@ import { SHAPES, ShapeCard } from '../../constants/shapes';
import { WATER_COLORS, PAPER_SIZE } from '../../constants/colors';
import ShapeDrawService from '../../service/shapeDrawService';
import { checkAndSaveImage } from '../../utils/saveImage';
import {
shouldShowShareGuide,
recordShareSuccess,
} from '../../utils/shareGuide';
import { shouldShowShareGuide } from '../../utils/shareGuide';
Page({
canvas: null as Canvas | null,
@@ -73,7 +69,10 @@ Page({
this.canvas = canvas;
this.ctx = ctx;
// const rect = res[0];
this.shapeDrawService = new ShapeDrawService(canvas, ctx);
this.shapeDrawService = new ShapeDrawService(
canvas,
ctx,
);
// shapeDrawService.draw();
this.setData({ boxWidth, boxHeight });
@@ -86,7 +85,7 @@ Page({
/** 变更shapeList 并更新canvas */
drawCanvas(
updatedShapeList?: ShapeCard[],
callback: () => void = () => { },
callback: () => void = () => {},
) {
if (updatedShapeList) {
this.setData({ shapeList: updatedShapeList }, () => {
@@ -102,7 +101,7 @@ Page({
handleSelectShape() {
this.setData({
showSelectShapePopup: true,
selectedShapeIndex: -1
selectedShapeIndex: -1,
});
},
@@ -110,7 +109,7 @@ Page({
const { index } = e.detail;
this.setData({
showSelectShapePopup: true,
selectedShapeIndex: index
selectedShapeIndex: index,
});
},
@@ -133,7 +132,7 @@ Page({
// 替换为新选中的 shape,保留原有 fillColor
return {
...shapes[0],
fillColor: item.fillColor
fillColor: item.fillColor,
};
} else {
// 其他 shape 不变
@@ -143,16 +142,20 @@ Page({
} else {
// 多选模式,原有逻辑
// 获取所有可用颜色
const colorList = WATER_COLORS.basic12.map(item => item.hex);
const colorList = WATER_COLORS.basic12.map((item) => item.hex);
// 记录已被使用的颜色(只考虑当前 shapeList 中的 fillColor
const usedColors = prevShapeList.map(item => item.fillColor).filter(Boolean);
const usedColors = prevShapeList
.map((item) => item.fillColor)
.filter(Boolean);
// 记录已分配的颜色,避免重复
const assignedColors = [...usedColors];
// 先将 shapes 转为 Map,方便查找
const prevShapeMap = new Map(prevShapeList.map(item => [item.id, item]));
const prevShapeMap = new Map(
prevShapeList.map((item) => [item.id, item]),
);
// 随机打乱剩余可用颜色
function shuffle(arr: string[]) {
@@ -164,7 +167,9 @@ Page({
}
// 计算未被占用的颜色
let availableColors = colorList.filter(color => !assignedColors.includes(color));
let availableColors = colorList.filter(
(color) => !assignedColors.includes(color),
);
availableColors = shuffle(availableColors);
shapes.forEach((item: ShapeCard) => {
@@ -172,7 +177,7 @@ Page({
// 已存在,保留原有 fillColor
newShapeList.push({
...item,
fillColor: prevShapeMap.get(item.id)!.fillColor
fillColor: prevShapeMap.get(item.id)!.fillColor,
});
} else {
// 新增,分配未被占用的颜色
@@ -180,19 +185,22 @@ Page({
assignedColors.push(color);
newShapeList.push({
...item,
fillColor: color
fillColor: color,
});
}
});
}
// 先关闭弹窗
this.setData({
showSelectShapePopup: false,
shapeList: newShapeList,
}, () => {
this.drawCanvas();
});
this.setData(
{
showSelectShapePopup: false,
shapeList: newShapeList,
},
() => {
this.drawCanvas();
},
);
},
/**
* 随机生成6个图形
@@ -207,7 +215,7 @@ Page({
const selectedShapes = shapesCopy.slice(0, 6);
// 随机取6个颜色
const colorList = WATER_COLORS.basic12.map(item => item.hex);
const colorList = WATER_COLORS.basic12.map((item) => item.hex);
const colorsCopy = [...colorList];
for (let i = colorsCopy.length - 1; i > 0; i--) {
const j = Math.floor(Math.random() * (i + 1));
@@ -218,70 +226,62 @@ Page({
// 分配颜色到图形
const shapeList = selectedShapes.map((shape, idx) => ({
...shape,
fillColor: selectedColors[idx]
fillColor: selectedColors[idx],
}));
// 更新数据
this.setData({
shapeList
}, () => {
// 绘制canvas
this.drawCanvas();
});
this.setData(
{
shapeList,
},
() => {
// 绘制canvas
this.drawCanvas();
},
);
},
onDelete(e: any) {
const { index } = e.detail;
const newShapeList = this.data.shapeList.filter((item, i) => i !== index);
this.setData({
shapeList: newShapeList
}, () => {
// 绘制canvas
this.drawCanvas();
});
const newShapeList = this.data.shapeList.filter((_, i) => i !== index);
this.setData(
{
shapeList: newShapeList,
},
() => {
// 绘制canvas
this.drawCanvas();
},
);
},
onColorTap(e: any) {
const { index, fillColor } = e.detail;
this.setData({
showColorPopup: true,
currentColor: fillColor,
selectedShapeIndex: index
selectedShapeIndex: index,
});
},
onCloseColorPopup() {
this.setData({
showColorPopup: false,
currentColor: '',
selectedShapeIndex: 0
selectedShapeIndex: 0,
});
},
onChangeColor(e: any) {
const { color } = e.detail;
const { selectedShapeIndex } = this.data;
this.setData({
showColorPopup: false,
[`shapeList[${selectedShapeIndex}].fillColor`]: color
}, () => {
// 绘制canvas
this.drawCanvas();
})
},
onShareAppMessage() {
// 记录分享成功(用户真正分享了)
recordShareSuccess();
return {
title: '涂鸦丫-涂色|识字|画画|打印',
path: '/pages/index/index',
};
},
onShareTimeline() {
// 记录分享成功(用户真正分享了)
recordShareSuccess();
return {
title: '涂鸦丫-涂色|识字|画画|打印',
query: '/pages/index/index',
};
this.setData(
{
showColorPopup: false,
[`shapeList[${selectedShapeIndex}].fillColor`]: color,
},
() => {
// 绘制canvas
this.drawCanvas();
},
);
},
/** 下载打印 */
@@ -305,36 +305,27 @@ Page({
this.setData({ showShareDialog: false });
},
/** 点击转发按钮 */
onShareToFriend() {
// 记录分享成功(用户点击了分享按钮,视为已分享)
recordShareSuccess();
this.setData({ showShareDialog: false });
// 允许继续下载
if (this.canvas && this.data.shapeList.length > 0) {
checkAndSaveImage(this.canvas);
}
wx.showToast({
title: '分享后即可继续下载',
icon: 'success',
duration: 2000,
});
onShareAppMessage() {
return {
title: '涂鸦丫-涂色|识字|图形|打印',
path: '/pages/shape/index',
imageUrl:
'https://cdn.joeyone.cn/doodle/share-img/index-share-v2.png',
};
},
onShareTimeline() {
return {
title: '涂鸦丫-涂色|识字|图形|打印',
query: '/pages/shape/index',
imageUrl:
'https://cdn.joeyone.cn/doodle/share-img/index-share-v2.png',
};
},
/** 点击分享到朋友圈按钮 */
onShareToTimeline() {
// 记录分享成功(用户点击了分享按钮,视为已分享)
recordShareSuccess();
/** 分享成功回调(由组件触发) */
onShareSuccess() {
// 只关闭弹窗,不触发下载
this.setData({ showShareDialog: false });
// 允许继续下载
if (this.canvas && this.data.shapeList.length > 0) {
checkAndSaveImage(this.canvas);
}
wx.showToast({
title: '分享后即可继续下载',
icon: 'success',
duration: 2000,
});
},
onUnload() {