白色箱子合成

customized/pages/boxMade/boxComb/boxComb.js

@@ -56,6 +56,10 @@ Page({
       '1':'正面',
       '2':'背面',
     },
+    boxImg:{
+      '5': '/customized/images/customized/box_white_big_1_out.png',
+      '6': '/customized/images/customized/box_white_big_2_out.png',
+    },
     buildSrcArray: [],
     customGoodsImg:"",
 
@@ -94,8 +98,7 @@ Page({
    * 生命周期函数--监听页面显示
    */
   onShow: function () {
-  
-  
+
   },
 
   /**
@@ -280,12 +283,16 @@ Page({
           imgSrcArray.forEach((res) => {
             ctx.drawImage(res, dataPositionObj.left * rpx, dataPositionObj.top * rpx, dataPositionObj.width * rpx, dataPositionObj.height * rpx);
           })
+          console.log('开始执行叠加')
+          ctx.drawImage(that.data.boxImg[i], 0, 0, 750 * rpx, 800 * rpx)
+      
           ctx.draw(true, function () {
             wx.canvasToTempFilePath({
               canvasId: 'comb-canvas' + i,
               success: function (res) {
                 that.uploadFile(res.tempFilePath,that,function(data){
                   console.log(res, "合成成功");
+
                   let buildSrcArray = that.data.buildSrcArray;
 
                   buildSrcArray.push({
@@ -385,6 +392,6 @@ Page({
         cb(false)
       }
     })
-  }
+  },
 
 })

customized/pages/boxMade/boxComb/boxComb.wxml

@@ -3,12 +3,12 @@
   <canvas canvas-id="comb-canvas5" class="comb-content"></canvas>
   <canvas canvas-id='comb-img5' class='comb-img5'></canvas>
   <canvas canvas-id='comb-font5' class='comb-font5'></canvas>
-   <canvas canvas-id='comb-font5-2' class='comb-img5'></canvas>
+  <canvas canvas-id='comb-font5-2' class='comb-img5'></canvas>
   <!-- 背面 -->
   <canvas canvas-id="comb-canvas6" class="comb-content"></canvas>
   <canvas canvas-id='comb-img6' class='comb-img6'></canvas>
   <canvas canvas-id='comb-font6' class='comb-font6'></canvas>
-   <canvas canvas-id='comb-font6-2' class='comb-img6'></canvas>
+  <canvas canvas-id='comb-font6-2' class='comb-img6'></canvas>
 </view>
 <view class='comb-view-img'>
   <cover-view class="pause" wx:for="{{buildSrcArray}}" bindtap="pause">
@@ -17,6 +17,8 @@
   </cover-view>
 </view>
  <!--  -->
+  <canvas canvas-id='comb-wheel5-left' class='comb-wheel'></canvas>
+  <canvas canvas-id='comb-wheel5-right' class='comb-wheel'></canvas>
 <view class='footer' hover-class="none">
 <view class='footer-box f-box'>
   <view class='f-item f-box f-justify-content-center footer-btn f-s32 bg-green c-white' bindtap='addImgRouter' hover-class="none">加入购物车</view>

customized/pages/boxMade/boxMade.js

@@ -160,12 +160,14 @@ Page({
   },
   addImgRouter() {
     console.log('添加图片');
+    wx.setStorageSync('box',this.data.box)
     wx.navigateTo({
       url: '/customized/pages/boxMade/boxMadeImg/boxMadeImg?id=' + this.data.isActive,
     })
   },
   addFontRouter() {
     console.log('添加文字');
+    wx.setStorageSync('box', this.data.box)
     wx.navigateTo({
       url: '/customized/pages/boxMade/boxMadeFont/boxMadeFont?id=' + this.data.isActive,
     })

customized/pages/boxMade/boxMadeFont/boxMadeFont.js

@@ -39,6 +39,7 @@ Page({
     animationData: {}, //旋转动画
     imgAnimationData: {}, // 图片的旋转
     imgTouch:{},
+    box:{},
   },
 
   /**
@@ -89,6 +90,9 @@ Page({
    * 生命周期函数--监听页面显示
    */
   onShow: function () {
+    this.setData({
+      box: wx.getStorageSync('box')
+    })
     this.getDataTouch(this)
   },
 

customized/pages/boxMade/boxMadeFont/boxMadeFont.wxml

@@ -4,7 +4,7 @@
   <!-- <canvas canvas-id='madeContent' class='made-content'></canvas> -->
   <view class='made-img-box'>
     <image src='{{obverseImgObject[isActive]}}'></image>
-    <made-solid prop-position="{{dataPositionObj}}" prop-size="{{propSize}}">
+    <made-solid prop-box="{{box}}" prop-position="{{dataPositionObj}}" prop-size="{{propSize}}">
       <view class='f-box f-align-items-center f-justify-content-center made-prompt' style='text-align:center' wx:if="{{!fontTouch.fontSize && !imgTouch.src}}">{{fontTouch.fontContent}}</view>
       <view class='made-box'>
         <!-- img -->

customized/pages/boxMade/boxMadeImg/boxMadeImg.js

@@ -36,6 +36,7 @@ Page({
       scale: 1, // 图片宽高比例
       angle: 0, // 旋转度数
     },
+    box:{},
     fontTouch:{},//文字对象
     fontAnimationData:{},
   },
@@ -92,6 +93,9 @@ Page({
    */
   onShow: function () {
     let that = this;
+    that.setData({
+      box:wx.getStorageSync('box')
+    })
     that.getImgList();
     that.getDataTouch(that)
   },

customized/pages/boxMade/boxMadeImg/boxMadeImg.wxml

@@ -2,7 +2,7 @@
   <view class='made-content'>
     <view class='made-img-box'>
       <image class='made-image' src='{{obverseImgObject[imgTouch.isActive]}}'></image>
-      <made-solid prop-position="{{dataPositionObj}}" prop-size="{{propSize}}">
+      <made-solid prop-box="{{box}}" prop-position="{{dataPositionObj}}" prop-size="{{propSize}}">
         <view class='f-box f-align-items-center f-justify-content-center made-prompt' wx:if="{{!madeStatic}}">{{fontContent}}</view>
         <view class='made-box'>
           <!-- img -->