feat:下载分享检查
This commit is contained in:
@@ -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() {
|
||||
|
||||
Reference in New Issue
Block a user