parent
6ded150933
commit
db770dea42
Binary file not shown.
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,5 @@
|
|||||||
|
App({
|
||||||
|
onLaunch () {
|
||||||
|
|
||||||
|
}
|
||||||
|
})
|
||||||
@ -0,0 +1,27 @@
|
|||||||
|
{
|
||||||
|
"pages":[
|
||||||
|
"pages/wxml/index",
|
||||||
|
"pages/index/index"
|
||||||
|
],
|
||||||
|
"window":{
|
||||||
|
"backgroundTextStyle":"light",
|
||||||
|
"navigationBarBackgroundColor": "#fff",
|
||||||
|
"navigationBarTitleText": "Wxml2Canvas",
|
||||||
|
"navigationBarTextStyle":"black"
|
||||||
|
},
|
||||||
|
|
||||||
|
"tabBar": {
|
||||||
|
"color": "#444444",
|
||||||
|
"selectedColor": "#000000",
|
||||||
|
"backgroundColor": "#ffffff",
|
||||||
|
"borderStyle": "black",
|
||||||
|
"position": "top",
|
||||||
|
"list": [{
|
||||||
|
"text": "wxml转canvas",
|
||||||
|
"pagePath": "pages/wxml/index"
|
||||||
|
}, {
|
||||||
|
"text": "配置生成",
|
||||||
|
"pagePath": "pages/index/index"
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,3 @@
|
|||||||
|
import Wxml2Canvas from './src/index';
|
||||||
|
|
||||||
|
export default Wxml2Canvas;
|
||||||
@ -0,0 +1,16 @@
|
|||||||
|
{
|
||||||
|
"name": "wxml2canvas",
|
||||||
|
"version": "1.0.1",
|
||||||
|
"description": "将wxml指定节点转换成canvas元素",
|
||||||
|
"main": "index.js",
|
||||||
|
"scripts": {
|
||||||
|
"test": "echo \"Error: no test specified\" && exit 1"
|
||||||
|
},
|
||||||
|
"keywords": [
|
||||||
|
"wxml2canvas",
|
||||||
|
"wxml",
|
||||||
|
"canvas"
|
||||||
|
],
|
||||||
|
"author": "wg",
|
||||||
|
"license": "ISC"
|
||||||
|
}
|
||||||
|
After Width: | Height: | Size: 15 KiB |
@ -0,0 +1 @@
|
|||||||
|
{}
|
||||||
@ -0,0 +1,10 @@
|
|||||||
|
<view class="share">
|
||||||
|
<canvas canvas-id="canvas1" class="share__canvas"></canvas>
|
||||||
|
<canvas canvas-id="canvas2" class="share__canvas"></canvas>
|
||||||
|
<canvas canvas-id="canvas4" class="share__canvas"></canvas>
|
||||||
|
<canvas canvas-id="canvas3" class="share__canvas"></canvas>
|
||||||
|
<canvas canvas-id="canvas5" class="share__canvas"></canvas>
|
||||||
|
<canvas canvas-id="canvas6" class="share__canvas"></canvas>
|
||||||
|
<canvas canvas-id="canvas7" class="share__canvas"></canvas>
|
||||||
|
<canvas canvas-id="canvas8" class="share__canvas share__canvas-long"></canvas>
|
||||||
|
</view>
|
||||||
@ -0,0 +1,18 @@
|
|||||||
|
.share{
|
||||||
|
width: 100vw;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.share__canvas {
|
||||||
|
width: 680rpx;
|
||||||
|
height: 420rpx;
|
||||||
|
background: #f0f0f0;
|
||||||
|
margin-bottom: 60rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.share__canvas-long {
|
||||||
|
height: 800rpx;
|
||||||
|
}
|
||||||
|
After Width: | Height: | Size: 15 KiB |
|
After Width: | Height: | Size: 4.1 KiB |
@ -0,0 +1,260 @@
|
|||||||
|
import Wxml2Canvas from '../../src/index';
|
||||||
|
|
||||||
|
Page({
|
||||||
|
data: {
|
||||||
|
imgs: []
|
||||||
|
},
|
||||||
|
|
||||||
|
onLoad (res) {
|
||||||
|
this.drawImage1();
|
||||||
|
|
||||||
|
setTimeout(() => {
|
||||||
|
this.drawImage2();
|
||||||
|
}, 300);
|
||||||
|
|
||||||
|
setTimeout(() => {
|
||||||
|
this.drawImage3();
|
||||||
|
}, 600)
|
||||||
|
|
||||||
|
setTimeout(() => {
|
||||||
|
this.drawImage4();
|
||||||
|
}, 900)
|
||||||
|
|
||||||
|
setTimeout(() => {
|
||||||
|
this.drawImage5();
|
||||||
|
}, 1200)
|
||||||
|
|
||||||
|
setTimeout(() => {
|
||||||
|
this.drawImage6();
|
||||||
|
}, 1500)
|
||||||
|
},
|
||||||
|
|
||||||
|
saveImage (evt) {
|
||||||
|
let index = evt.target.dataset.index;
|
||||||
|
|
||||||
|
wx.saveImageToPhotosAlbum({
|
||||||
|
filePath: this.data.imgs[index],
|
||||||
|
success(res) {
|
||||||
|
wx.showToast({
|
||||||
|
title: '保存成功',
|
||||||
|
icon: 'success'
|
||||||
|
})
|
||||||
|
},
|
||||||
|
fail () {
|
||||||
|
wx.showToast({
|
||||||
|
title: '保存失败',
|
||||||
|
icon: 'none'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
drawImage1 () {
|
||||||
|
let self = this;
|
||||||
|
this.drawImage1 = new Wxml2Canvas({
|
||||||
|
width: 340,
|
||||||
|
height: 210,
|
||||||
|
element: 'canvas1',
|
||||||
|
background: '#f0f0f0',
|
||||||
|
progress (percent) {
|
||||||
|
},
|
||||||
|
finish(url) {
|
||||||
|
let imgs = self.data.imgs;
|
||||||
|
imgs.push(url);
|
||||||
|
|
||||||
|
self.setData({
|
||||||
|
imgs
|
||||||
|
})
|
||||||
|
},
|
||||||
|
error (res) {
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
let data = {
|
||||||
|
list: [{
|
||||||
|
type: 'wxml',
|
||||||
|
class: '.share__canvas1 .draw_canvas',
|
||||||
|
limit: '.share__canvas1',
|
||||||
|
x: 0,
|
||||||
|
y: 0
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
|
||||||
|
this.drawImage1.draw(data);
|
||||||
|
},
|
||||||
|
|
||||||
|
drawImage2 () {
|
||||||
|
let self = this;
|
||||||
|
this.drawImage2 = new Wxml2Canvas({
|
||||||
|
width: 340,
|
||||||
|
height: 210,
|
||||||
|
element: 'canvas2',
|
||||||
|
background: '#f0f0f0',
|
||||||
|
progress (percent) {
|
||||||
|
},
|
||||||
|
finish(url) {
|
||||||
|
console.log(url)
|
||||||
|
let imgs = self.data.imgs;
|
||||||
|
imgs.push(url);
|
||||||
|
|
||||||
|
self.setData({
|
||||||
|
imgs
|
||||||
|
})
|
||||||
|
},
|
||||||
|
error (res) {
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
let data = {
|
||||||
|
list: [{
|
||||||
|
type: 'wxml',
|
||||||
|
class: '.share__canvas2 .draw_canvas',
|
||||||
|
limit: '.share__canvas2',
|
||||||
|
x: 0,
|
||||||
|
y: 0
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
|
||||||
|
this.drawImage2.draw(data);
|
||||||
|
},
|
||||||
|
|
||||||
|
drawImage3 () {
|
||||||
|
let self = this;
|
||||||
|
this.drawImage3 = new Wxml2Canvas({
|
||||||
|
width: 340,
|
||||||
|
height: 210,
|
||||||
|
element: 'canvas3',
|
||||||
|
background: '#f0f0f0',
|
||||||
|
progress (percent) {
|
||||||
|
// console.log(percent)
|
||||||
|
},
|
||||||
|
finish(url) {
|
||||||
|
let imgs = self.data.imgs;
|
||||||
|
imgs.push(url);
|
||||||
|
|
||||||
|
self.setData({
|
||||||
|
imgs
|
||||||
|
})
|
||||||
|
},
|
||||||
|
error (res) {
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
let data = {
|
||||||
|
list: [{
|
||||||
|
type: 'wxml',
|
||||||
|
class: '.share__canvas3 .draw_canvas',
|
||||||
|
limit: '.share__canvas3',
|
||||||
|
x: 0,
|
||||||
|
y: 0
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
|
||||||
|
this.drawImage3.draw(data);
|
||||||
|
},
|
||||||
|
|
||||||
|
drawImage4 () {
|
||||||
|
let self = this;
|
||||||
|
this.drawImage4 = new Wxml2Canvas({
|
||||||
|
width: 340,
|
||||||
|
height: 400,
|
||||||
|
element: 'canvas4',
|
||||||
|
background: '#f0f0f0',
|
||||||
|
progress (percent) {
|
||||||
|
// console.log(percent)
|
||||||
|
},
|
||||||
|
finish(url) {
|
||||||
|
let imgs = self.data.imgs;
|
||||||
|
imgs.push(url);
|
||||||
|
|
||||||
|
self.setData({
|
||||||
|
imgs
|
||||||
|
})
|
||||||
|
},
|
||||||
|
error (res) {
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
let data = {
|
||||||
|
list: [{
|
||||||
|
type: 'wxml',
|
||||||
|
class: '.share__canvas4 .draw_canvas',
|
||||||
|
limit: '.share__canvas4',
|
||||||
|
x: 0,
|
||||||
|
y: 0
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
|
||||||
|
this.drawImage4.draw(data);
|
||||||
|
},
|
||||||
|
|
||||||
|
drawImage5 () {
|
||||||
|
let self = this;
|
||||||
|
this.drawImage5 = new Wxml2Canvas({
|
||||||
|
width: 340,
|
||||||
|
height: 210,
|
||||||
|
element: 'canvas5',
|
||||||
|
background: '#f0f0f0',
|
||||||
|
progress (percent) {
|
||||||
|
// console.log(percent)
|
||||||
|
},
|
||||||
|
finish(url) {
|
||||||
|
let imgs = self.data.imgs;
|
||||||
|
imgs.push(url);
|
||||||
|
|
||||||
|
self.setData({
|
||||||
|
imgs
|
||||||
|
})
|
||||||
|
},
|
||||||
|
error (res) {
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
let data = {
|
||||||
|
list: [{
|
||||||
|
type: 'wxml',
|
||||||
|
class: '.share__canvas5 .draw_canvas',
|
||||||
|
limit: '.share__canvas5',
|
||||||
|
x: 0,
|
||||||
|
y: 0
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
|
||||||
|
this.drawImage5.draw(data);
|
||||||
|
},
|
||||||
|
|
||||||
|
drawImage6 () {
|
||||||
|
let self = this;
|
||||||
|
this.drawImage6 = new Wxml2Canvas({
|
||||||
|
width: 340,
|
||||||
|
height: 450,
|
||||||
|
element: 'canvas6',
|
||||||
|
background: '#f0f0f0',
|
||||||
|
progress (percent) {
|
||||||
|
// console.log(percent)
|
||||||
|
},
|
||||||
|
finish(url) {
|
||||||
|
let imgs = self.data.imgs;
|
||||||
|
imgs.push(url);
|
||||||
|
|
||||||
|
self.setData({
|
||||||
|
imgs
|
||||||
|
})
|
||||||
|
},
|
||||||
|
error (res) {
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
let data = {
|
||||||
|
list: [{
|
||||||
|
type: 'wxml',
|
||||||
|
class: '.share__canvas6 .draw_canvas',
|
||||||
|
limit: '.share__canvas6',
|
||||||
|
x: 0,
|
||||||
|
y: 0
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
|
||||||
|
this.drawImage6.draw(data);
|
||||||
|
}
|
||||||
|
});
|
||||||
@ -0,0 +1 @@
|
|||||||
|
{}
|
||||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,40 @@
|
|||||||
|
{
|
||||||
|
"description": "项目配置文件",
|
||||||
|
"packOptions": {
|
||||||
|
"ignore": []
|
||||||
|
},
|
||||||
|
"setting": {
|
||||||
|
"urlCheck": false,
|
||||||
|
"es6": true,
|
||||||
|
"postcss": true,
|
||||||
|
"minified": true,
|
||||||
|
"newFeature": true,
|
||||||
|
"autoAudits": false
|
||||||
|
},
|
||||||
|
"compileType": "miniprogram",
|
||||||
|
"libVersion": "2.6.2",
|
||||||
|
"appid": "",
|
||||||
|
"projectname": "wxml2canvas",
|
||||||
|
"debugOptions": {
|
||||||
|
"hidedInDevtools": []
|
||||||
|
},
|
||||||
|
"isGameTourist": false,
|
||||||
|
"condition": {
|
||||||
|
"search": {
|
||||||
|
"current": -1,
|
||||||
|
"list": []
|
||||||
|
},
|
||||||
|
"conversation": {
|
||||||
|
"current": -1,
|
||||||
|
"list": []
|
||||||
|
},
|
||||||
|
"game": {
|
||||||
|
"currentL": -1,
|
||||||
|
"list": []
|
||||||
|
},
|
||||||
|
"miniprogram": {
|
||||||
|
"current": -1,
|
||||||
|
"list": []
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
File diff suppressed because it is too large
Load Diff
Loading…
Reference in new issue