renyt/canvas
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

1

Browse Source
This commit is contained in:
renyt 2025-05-08 11:17:46 +08:00
parent 9635facb16
commit 4242018a6d
28 changed files with 145 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
pages.json
View File

@ -1,11 +1,17 @@
{
"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
{
"path": "pages/index/step2",
"style": {
"navigationBarTitleText": "fu"
}
},{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "uni-app"
}
}
],
"globalStyle": {
"navigationBarTextStyle": "black",

25
pages/index/index.vue
View File

@ -1,22 +1,22 @@
<template>
<view>
<!-- 定义canvas画布 // 设置canvas大小为200x200像素 -->
<canvas canvas-id="canvas" id="canvas" style="width: 200px; height: 200px;"></canvas>
<canvas canvas-id="canvas" id="canvas" style="width: 200px; height: 200px;border: 1px solid red;" :width="canvasWidth" :height="canvasHeight"></canvas>
<!-- 添加一个按钮，用于触发绘图 -->
<button @click="handleDraw()">点击绘制圆形</button>
<button @click="handleDraw">点击绘制圆形</button>
</view>
</template>
<script setup>
import {
ref
} from 'vue'
import { ref, onMounted } from 'vue'
const canvasWidth = ref(200) // 动态设置Canvas宽度
const canvasHeight = ref(200) // 动态设置Canvas高度
// 定义绘图函数
function draw() {
const ctx = uni.createCanvasContext('canvas') // 创建canvas绘图上下文
// 绘制外圆
ctx.beginPath() // 开始路径
ctx.arc(100, 100, 80, 0, Math.PI * 2) // 在坐标(100, 100)处绘制半径为80的圆形
@ -28,19 +28,26 @@
ctx.arc(100, 100, 75, 0, Math.PI * 2) // 在相同中心点(100, 100)，但半径为60的圆形
ctx.setFillStyle('white') // 设置填充颜色为白色
ctx.fill() // 填充以“清除”内部区域，形成环形
ctx.draw() // 将上述所有操作提交到canvas进行渲染
ctx.draw(false, setTimeout(()=>{
console.log(3)
},300))
// ctx.draw(true) // 将上述所有操作提交到canvas进行渲染
}
// 按钮点击事件处理函数
const handleDraw = () => {
console.log('111111');
draw(); // 调用绘图函数
console.log('222222222');
}
onMounted(() => {
// 确保在组件挂载后可以获取到Canvas元素
})
</script>
<style scoped>
/* 样式部分 */
button {
margin-top: 10px;
/* 给按钮设置一些上边距以避免过于紧凑 */
}
</style>

17
pages/index/step2.vue Normal file
View File

@ -0,0 +1,17 @@
<template>
<view>
<indexstep2></indexstep2>
</view>
</template>
<script setup>
import indexstep2 from "./index.vue"
import {
ref
} from 'vue'
</script>
<style scoped>
</style>

1
unpackage/dist/dev/.sourcemap/mp-weixin-devtools/index.js.map vendored Normal file
View File

@ -0,0 +1 @@
{"version":3,"names":["canvasWidth","common_vendor","ref","canvasHeight","draw","ctx","index","createCanvasContext","beginPath","arc","Math","PI","setFillStyle","fill","setTimeout","__f__","handleDraw","onMounted"],"sources":["index.vue"],"sourcesContent":["<template>\n\t<view>\n\t\t<!-- 定义canvas画布 // 设置canvas大小为200x200像素 -->\n\t\t<canvas canvas-id=\"canvas\" id=\"canvas\" style=\"width: 200px; height: 200px;border: 1px solid red;\" :width=\"canvasWidth\" :height=\"canvasHeight\"></canvas>\n\n\t\t<!-- 添加一个按钮，用于触发绘图 -->\n\t\t<button @click=\"handleDraw\">点击绘制圆形</button>\n\t</view>\n</template>\n\n<script setup>\n\timport { ref, onMounted } from 'vue'\n\n\tconst canvasWidth = ref(200) // 动态设置Canvas宽度\n\tconst canvasHeight = ref(200) // 动态设置Canvas高度\n\n\t// 定义绘图函数\n\tfunction draw() {\n\t\tconst ctx = uni.createCanvasContext('canvas') // 创建canvas绘图上下文\n\t\t// 绘制外圆\n\t\tctx.beginPath() // 开始路径\n\t\tctx.arc(100, 100, 80, 0, Math.PI * 2) // 在坐标(100, 100)处绘制半径为80的圆形\n\t\tctx.setFillStyle('rgba(0, 0, 0, 1)') // 设置填充颜色为黑色，无透明度\n\t\tctx.fill() // 填充所创建的路径\n\t\t\n\t\t// 绘制内圆以形成环形效果\n\t\tctx.beginPath() // 开始新的路径\n\t\tctx.arc(100, 100, 75, 0, Math.PI * 2) // 在相同中心点(100, 100)，但半径为60的圆形\n\t\tctx.setFillStyle('white') // 设置填充颜色为白色\n\t\tctx.fill() // 填充以“清除”内部区域，形成环形\r\n\t\tthis.ctx.draw(false, setTimeout(()=>{\r\n\t\t console.log(3)\r\n\t\t},300))\r\n\t\t\t// ctx.draw(true) // 将上述所有操作提交到canvas进行渲染\r\n\t}\n\n\t// 按钮点击事件处理函数\n\tconst handleDraw = () => {\r\n\t\tconsole.log('111111');\n\t\tdraw(); // 调用绘图函数\r\n\t\tconsole.log('222222222');\n\t}\n\n\tonMounted(() => {\r\n\t\t// 确保在组件挂载后可以获取到Canvas元素\n\t})\n</script>\n\n<style scoped>\n\tbutton {\n\t\tmargin-top: 10px;\n\t}\n</style>"],"mappings":";;;;;;;IAaC,IAAMA,WAAA,GAAcC,aAAA,CAAGC,GAAA,CAAC,GAAG;IAC3B,IAAMC,YAAA,GAAeF,aAAA,CAAGC,GAAA,CAAC,GAAG;IAG5B,SAASE,KAAA,EAAO;MACf,IAAMC,GAAA,GAAMJ,aAAA,CAAAK,KAAA,CAAIC,mBAAA,CAAoB,QAAQ;MAE5CF,GAAA,CAAIG,SAAA,EAAW;MACfH,GAAA,CAAII,GAAA,CAAI,KAAK,KAAK,IAAI,GAAGC,IAAA,CAAKC,EAAA,GAAK,CAAC;MACpCN,GAAA,CAAIO,YAAA,CAAa,kBAAkB;MACnCP,GAAA,CAAIQ,IAAA,EAAM;MAGVR,GAAA,CAAIG,SAAA,EAAW;MACfH,GAAA,CAAII,GAAA,CAAI,KAAK,KAAK,IAAI,GAAGC,IAAA,CAAKC,EAAA,GAAK,CAAC;MACpCN,GAAA,CAAIO,YAAA,CAAa,OAAO;MACxBP,GAAA,CAAIQ,IAAA,EAAM;MACV,KAAKR,GAAA,CAAID,IAAA,CAAK,OAAOU,UAAA,CAAW,YAAI;QAChCb,aAAA,CAAAK,KAAA,CAAYS,KAAA,wCAAC;MAChB,GAAC,GAAG,CAAC;IAEN;IAGD,IAAMC,UAAA,GAAa,SAAbA,WAAA,EAAmB;MACxBf,aAAA,CAAAK,KAAA,CAAYS,KAAA,+CAAQ;MACpBX,IAAA;MACAH,aAAA,CAAAK,KAAA,CAAAS,KAAA,uCAAY,WAAW;IACvB;IAEDd,aAAA,CAAAgB,SAAA,CAAU,YAAM,CAEjB,CAAE","ignoreList":[]}

2
unpackage/dist/dev/.sourcemap/mp-weixin-devtools/pages/index/index.js.map vendored
View File

@ -1 +1 @@
{"version":3,"names":["draw","ctx","common_vendor","index","createCanvasContext","beginPath","arc","Math","PI","setFillStyle","setFillRule","fill","onMounted","wx","createPage","_sfc_main"],"sources":["index.vue","cGFnZXMvaW5kZXgvaW5kZXgudnVl"],"sourcesContent":["<template>\n\t<view>\n\t\t<canvas \n\t\t\tcanvas-id=\"canvas\" \n\t\t\tstyle=\"width: 100px; height: 100px;\"\n\t\t></canvas>\n\t</view>\n</template>\n\n<script setup>\nimport { onMounted } from 'vue'\n\nfunction draw() {\n\tconst ctx = uni.createCanvasContext('canvas')\n\n\tctx.beginPath()\n\tctx.arc(50, 50, 30, 0, Math.PI * 2, true)\n\tctx.arc(50, 50, 15, 0, Math.PI * 2, true)\n\tctx.setFillStyle('black')\n\tctx.setFillRule('evenodd') // 设置填充规则\n\tctx.fill()\n\n\tctx.draw()\n}\n\nonMounted(() => {\n\tdraw()\n})\n</script>\n\n<style scoped>\n</style>","import MiniProgramPage from 'C:/Users/hp/Desktop/app/canvas/pages/index/index.vue'\nwx.createPage(MiniProgramPage)"],"mappings":";;;;;;;IAYA,SAASA,KAAA,EAAO;MACf,IAAMC,GAAA,GAAMC,aAAA,CAAAC,KAAA,CAAIC,mBAAA,CAAoB,QAAQ;MAE5CH,GAAA,CAAII,SAAA,EAAW;MACfJ,GAAA,CAAIK,GAAA,CAAI,IAAI,IAAI,IAAI,GAAGC,IAAA,CAAKC,EAAA,GAAK,GAAG,IAAI;MACxCP,GAAA,CAAIK,GAAA,CAAI,IAAI,IAAI,IAAI,GAAGC,IAAA,CAAKC,EAAA,GAAK,GAAG,IAAI;MACxCP,GAAA,CAAIQ,YAAA,CAAa,OAAO;MACxBR,GAAA,CAAIS,WAAA,CAAY,SAAS;MACzBT,GAAA,CAAIU,IAAA,EAAM;MAEVV,GAAA,CAAID,IAAA,EAAM;IACX;IAEAE,aAAA,CAAAU,SAAA,CAAU,YAAM;MACfZ,IAAA,EAAM;IACP,CAAC;;;;;;AC1BDa,EAAA,CAAGC,UAAA,CAAWC,SAAe","ignoreList":[]}
{"version":3,"names":["wx","createPage","index","MiniProgramPage"],"sources":["cGFnZXMvaW5kZXgvaW5kZXgudnVl"],"sourcesContent":["import MiniProgramPage from 'C:/Users/hp/Desktop/app/canvas/pages/index/index.vue'\nwx.createPage(MiniProgramPage)"],"mappings":";;;;AACAA,EAAA,CAAGC,UAAA,CAAWC,KAAA,CAAeC,eAAA","ignoreList":[]}

2
unpackage/dist/dev/.sourcemap/mp-weixin/app.js.map vendored
View File

@ -1 +1 @@
{"version":3,"file":"app.js","sources":["App.vue","main.js"],"sourcesContent":["<script>\r\n\texport default {\r\n\t\tonLaunch: function() {\r\n\t\t\tconsole.log('App Launch')\r\n\t\t},\r\n\t\tonShow: function() {\r\n\t\t\tconsole.log('App Show')\r\n\t\t},\r\n\t\tonHide: function() {\r\n\t\t\tconsole.log('App Hide')\r\n\t\t}\r\n\t}\r\n</script>\r\n\r\n<style>\r\n\t/*每个页面公共css */\r\n</style>\n","import App from './App'\n\n// #ifndef VUE3\nimport Vue from 'vue'\nimport './uni.promisify.adaptor'\nVue.config.productionTip = false\nApp.mpType = 'app'\nconst app = new Vue({\n ...App\n})\napp.$mount()\n// #endif\n\n// #ifdef VUE3\nimport { createSSRApp } from 'vue'\nexport function createApp() {\n const app = createSSRApp(App)\n return {\n app\n }\n}\n// #endif"],"names":["uni","createSSRApp","App"],"mappings":";;;;;;AACC,MAAK,YAAU;AAAA,EACd,UAAU,WAAW;AACpBA,kBAAAA,MAAA,MAAA,OAAA,gBAAY,YAAY;AAAA,EACxB;AAAA,EACD,QAAQ,WAAW;AAClBA,kBAAAA,MAAY,MAAA,OAAA,gBAAA,UAAU;AAAA,EACtB;AAAA,EACD,QAAQ,WAAW;AAClBA,kBAAAA,MAAY,MAAA,OAAA,iBAAA,UAAU;AAAA,EACvB;AACD;ACIM,SAAS,YAAY;AAC1B,QAAM,MAAMC,cAAY,aAACC,SAAG;AAC5B,SAAO;AAAA,IACL;AAAA,EACD;AACH;AACC,YAAO,IAAA,MAAA,MAAA;;"}
{"version":3,"file":"app.js","sources":["App.vue","main.js"],"sourcesContent":["<script>\r\n\texport default {\r\n\t\tonLaunch: function() {\r\n\t\t\tconsole.log('App Launch')\r\n\t\t},\r\n\t\tonShow: function() {\r\n\t\t\tconsole.log('App Show')\r\n\t\t},\r\n\t\tonHide: function() {\r\n\t\t\tconsole.log('App Hide')\r\n\t\t}\r\n\t}\r\n</script>\r\n\r\n<style>\r\n\t/*每个页面公共css */\r\n</style>\n","import App from './App'\n\n// #ifndef VUE3\nimport Vue from 'vue'\nimport './uni.promisify.adaptor'\nVue.config.productionTip = false\nApp.mpType = 'app'\nconst app = new Vue({\n ...App\n})\napp.$mount()\n// #endif\n\n// #ifdef VUE3\nimport { createSSRApp } from 'vue'\nexport function createApp() {\n const app = createSSRApp(App)\n return {\n app\n }\n}\n// #endif"],"names":["uni","createSSRApp","App"],"mappings":";;;;;;;AACC,MAAK,YAAU;AAAA,EACd,UAAU,WAAW;AACpBA,kBAAAA,MAAA,MAAA,OAAA,gBAAY,YAAY;AAAA,EACxB;AAAA,EACD,QAAQ,WAAW;AAClBA,kBAAAA,MAAY,MAAA,OAAA,gBAAA,UAAU;AAAA,EACtB;AAAA,EACD,QAAQ,WAAW;AAClBA,kBAAAA,MAAY,MAAA,OAAA,iBAAA,UAAU;AAAA,EACvB;AACD;ACIM,SAAS,YAAY;AAC1B,QAAM,MAAMC,cAAY,aAACC,SAAG;AAC5B,SAAO;AAAA,IACL;AAAA,EACD;AACH;AACC,YAAO,IAAA,MAAA,MAAA;;"}

2
unpackage/dist/dev/.sourcemap/mp-weixin/common/vendor.js.map vendored
View File

File diff suppressed because one or more lines are too long

1
unpackage/dist/dev/.sourcemap/mp-weixin/index.js.map vendored Normal file
View File

@ -0,0 +1 @@
{"version":3,"file":"index.js","sources":["pages/index/index.vue"],"sourcesContent":["<template>\n\t<view>\n\t\t<!-- 定义canvas画布 // 设置canvas大小为200x200像素 -->\n\t\t<canvas canvas-id=\"canvas\" id=\"canvas\" style=\"width: 200px; height: 200px;border: 1px solid red;\" :width=\"canvasWidth\" :height=\"canvasHeight\"></canvas>\n\n\t\t<!-- 添加一个按钮，用于触发绘图 -->\n\t\t<button @click=\"handleDraw\">点击绘制圆形</button>\n\t</view>\n</template>\n\n<script setup>\n\timport { ref, onMounted } from 'vue'\n\n\tconst canvasWidth = ref(200) // 动态设置Canvas宽度\n\tconst canvasHeight = ref(200) // 动态设置Canvas高度\n\n\t// 定义绘图函数\n\tfunction draw() {\n\t\tconst ctx = uni.createCanvasContext('canvas') // 创建canvas绘图上下文\n\t\t// 绘制外圆\n\t\tctx.beginPath() // 开始路径\n\t\tctx.arc(100, 100, 80, 0, Math.PI * 2) // 在坐标(100, 100)处绘制半径为80的圆形\n\t\tctx.setFillStyle('rgba(0, 0, 0, 1)') // 设置填充颜色为黑色，无透明度\n\t\tctx.fill() // 填充所创建的路径\n\t\t\n\t\t// 绘制内圆以形成环形效果\n\t\tctx.beginPath() // 开始新的路径\n\t\tctx.arc(100, 100, 75, 0, Math.PI * 2) // 在相同中心点(100, 100)，但半径为60的圆形\n\t\tctx.setFillStyle('white') // 设置填充颜色为白色\n\t\tctx.fill() // 填充以“清除”内部区域，形成环形\r\n\t\tctx.draw(false, setTimeout(()=>{\r\n\t\t console.log(3)\r\n\t\t},300))\r\n\t\t\t// ctx.draw(true) // 将上述所有操作提交到canvas进行渲染\r\n\t}\n\n\t// 按钮点击事件处理函数\n\tconst handleDraw = () => {\r\n\t\tconsole.log('111111');\n\t\tdraw(); // 调用绘图函数\r\n\t\tconsole.log('222222222');\n\t}\n\n\tonMounted(() => {\r\n\t\t// 确保在组件挂载后可以获取到Canvas元素\n\t})\n</script>\n\n<style scoped>\n\tbutton {\n\t\tmargin-top: 10px;\n\t}\n</style>"],"names":["ref","uni","onMounted"],"mappings":";;;;;AAaC,UAAM,cAAcA,cAAG,IAAC,GAAG;AAC3B,UAAM,eAAeA,cAAG,IAAC,GAAG;AAG5B,aAAS,OAAO;AACf,YAAM,MAAMC,cAAAA,MAAI,oBAAoB,QAAQ;AAE5C,UAAI,UAAW;AACf,UAAI,IAAI,KAAK,KAAK,IAAI,GAAG,KAAK,KAAK,CAAC;AACpC,UAAI,aAAa,kBAAkB;AACnC,UAAI,KAAM;AAGV,UAAI,UAAW;AACf,UAAI,IAAI,KAAK,KAAK,IAAI,GAAG,KAAK,KAAK,CAAC;AACpC,UAAI,aAAa,OAAO;AACxB,UAAI,KAAM;AACV,UAAI,KAAK,OAAO,WAAW,MAAI;AAC3BA,sBAAAA,MAAY,MAAA,OAAA,+BAAA,CAAC;AAAA,MAChB,GAAC,GAAG,CAAC;AAAA,IAEN;AAGD,UAAM,aAAa,MAAM;AACxBA,oBAAAA,MAAY,MAAA,OAAA,+BAAA,QAAQ;AACpB;AACAA,oBAAAA,MAAA,MAAA,OAAA,+BAAY,WAAW;AAAA,IACvB;AAEDC,kBAAAA,UAAU,MAAM;AAAA,IAEjB,CAAE;;;;;;;;;;;;"}

2
unpackage/dist/dev/.sourcemap/mp-weixin/pages/index/index.js.map vendored
View File

@ -1 +1 @@
{"version":3,"file":"index.js","sources":["pages/index/index.vue","../../HBuilderX/plugins/uniapp-cli-vite/uniPage:/cGFnZXMvaW5kZXgvaW5kZXgudnVl"],"sourcesContent":["<template>\r\n\t<view>\r\n\t\t<!-- 定义canvas画布 // 设置canvas大小为200x200像素 -->\r\n\t\t<canvas canvas-id=\"canvas\" id=\"canvas\" style=\"width: 200px; height: 200px;\"></canvas>\r\n\r\n\t\t<!-- 添加一个按钮，用于触发绘图 -->\r\n\t\t<button @click=\"handleDraw()\">点击绘制圆形</button>\r\n\t</view>\r\n</template>\r\n\r\n<script setup>\r\n\timport {\r\n\t\tref\r\n\t} from 'vue'\r\n\r\n\t// 定义绘图函数\r\n\tfunction draw() {\r\n\t\tconst ctx = uni.createCanvasContext('canvas') // 创建canvas绘图上下文\r\n\r\n\t\t// 绘制外圆\r\n\t\tctx.beginPath() // 开始路径\r\n\t\tctx.arc(100, 100, 80, 0, Math.PI * 2) // 在坐标(100, 100)处绘制半径为80的圆形\r\n\t\tctx.setFillStyle('rgba(0, 0, 0, 1)') // 设置填充颜色为黑色，无透明度\r\n\t\tctx.fill() // 填充所创建的路径\r\n\t\t\r\n\t\t// 绘制内圆以形成环形效果\r\n\t\tctx.beginPath() // 开始新的路径\r\n\t\tctx.arc(100, 100, 75, 0, Math.PI * 2) // 在相同中心点(100, 100)，但半径为60的圆形\r\n\t\tctx.setFillStyle('white') // 设置填充颜色为白色\r\n\t\tctx.fill() // 填充以“清除”内部区域，形成环形\r\n\t\tctx.draw() // 将上述所有操作提交到canvas进行渲染\r\n\t}\r\n\r\n\t// 按钮点击事件处理函数\r\n\tconst handleDraw = () => {\r\n\t\tdraw(); // 调用绘图函数\r\n\t}\r\n</script>\r\n\r\n<style scoped>\r\n\t/* 样式部分 */\r\n\tbutton {\r\n\t\tmargin-top: 10px;\r\n\t\t/* 给按钮设置一些上边距以避免过于紧凑 */\r\n\t}\r\n</style>","import MiniProgramPage from 'C:/Users/hp/Desktop/app/canvas/pages/index/index.vue'\nwx.createPage(MiniProgramPage)"],"names":["uni"],"mappings":";;;;;AAgBC,aAAS,OAAO;AACf,YAAM,MAAMA,cAAAA,MAAI,oBAAoB,QAAQ;AAG5C,UAAI,UAAW;AACf,UAAI,IAAI,KAAK,KAAK,IAAI,GAAG,KAAK,KAAK,CAAC;AACpC,UAAI,aAAa,kBAAkB;AACnC,UAAI,KAAM;AAGV,UAAI,UAAW;AACf,UAAI,IAAI,KAAK,KAAK,IAAI,GAAG,KAAK,KAAK,CAAC;AACpC,UAAI,aAAa,OAAO;AACxB,UAAI,KAAM;AACV,UAAI,KAAM;AAAA,IACV;AAGD,UAAM,aAAa,MAAM;AACxB;IACA;;;;;;;;;ACnCF,GAAG,WAAW,eAAe;"}
{"version":3,"file":"index.js","sources":["../../HBuilderX/plugins/uniapp-cli-vite/uniPage:/cGFnZXMvaW5kZXgvaW5kZXgudnVl"],"sourcesContent":["import MiniProgramPage from 'C:/Users/hp/Desktop/app/canvas/pages/index/index.vue'\nwx.createPage(MiniProgramPage)"],"names":["MiniProgramPage"],"mappings":";;AACA,GAAG,WAAWA,MAAe,eAAA;"}

1
unpackage/dist/dev/.sourcemap/mp-weixin/pages/index/index2.js.map vendored Normal file
View File

@ -0,0 +1 @@
{"version":3,"file":"index2.js","sources":["../../HBuilderX/plugins/uniapp-cli-vite/uniPage:/QzovVXNlcnMvaHAvRGVza3RvcC9hcHAvY2FudmFzL3BhZ2VzL2luZGV4L2luZGV4LnZ1ZQ"],"sourcesContent":["import MiniProgramPage from 'C:/Users/hp/Desktop/app/canvas/pages/index/index.vue'\nwx.createPage(MiniProgramPage)"],"names":["MiniProgramPage"],"mappings":";;AACA,GAAG,WAAWA,MAAe,eAAA;"}

1
unpackage/dist/dev/.sourcemap/mp-weixin/pages/index/indexFu.js.map vendored Normal file
View File

@ -0,0 +1 @@
{"version":3,"file":"indexFu.js","sources":["pages/index/indexFu.vue","../../HBuilderX/plugins/uniapp-cli-vite/uniPage:/cGFnZXMvaW5kZXgvaW5kZXhGdS52dWU"],"sourcesContent":["<template>\r\n\t<view>\r\n\t<indexZi></indexZi>\r\n\t</view>\r\n</template>\r\n\r\n<script setup>\r\n\timport indexZi from \"./index.vue\" \r\n\timport {\r\n\t\tref\r\n\t} from 'vue'\r\n\r\n</script>\r\n\r\n<style scoped>\r\n\r\n</style>","import MiniProgramPage from 'C:/Users/hp/Desktop/app/canvas/pages/index/indexFu.vue'\nwx.createPage(MiniProgramPage)"],"names":["MiniProgramPage"],"mappings":";;;;;AAOC,MAAM,UAAU,MAAW;;;;;;;;;ACN5B,GAAG,WAAWA,SAAe;"}

1
unpackage/dist/dev/.sourcemap/mp-weixin/pages/index/step2.js.map vendored Normal file
View File

@ -0,0 +1 @@
{"version":3,"file":"step2.js","sources":["pages/index/step2.vue","../../HBuilderX/plugins/uniapp-cli-vite/uniPage:/cGFnZXMvaW5kZXgvc3RlcDIudnVl"],"sourcesContent":["<template>\r\n\t<view>\r\n\t<indexstep2></indexstep2>\r\n\t</view>\r\n</template>\r\n\r\n<script setup>\r\n\timport indexstep2 from \"./index.vue\" \r\n\timport {\r\n\t\tref\r\n\t} from 'vue'\r\n\r\n</script>\r\n\r\n<style scoped>\r\n\r\n</style>","import MiniProgramPage from 'C:/Users/hp/Desktop/app/canvas/pages/index/step2.vue'\nwx.createPage(MiniProgramPage)"],"names":["MiniProgramPage"],"mappings":";;;;;AAOC,MAAM,aAAa,MAAW;;;;;;;;;ACN/B,GAAG,WAAWA,SAAe;"}

1
unpackage/dist/dev/mp-weixin/app.js vendored
View File

@ -2,6 +2,7 @@
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const common_vendor = require("./common/vendor.js");
if (!Math) {
"./pages/index/step2.js";
"./pages/index/index.js";
}
const _sfc_main = {

1
unpackage/dist/dev/mp-weixin/app.json vendored
View File

@ -1,5 +1,6 @@
{
"pages": [
"pages/index/step2",
"pages/index/index"
],
"window": {

2
unpackage/dist/dev/mp-weixin/common/vendor.js vendored
View File

@ -7789,4 +7789,6 @@ exports._export_sfc = _export_sfc;
exports.createSSRApp = createSSRApp;
exports.index = index;
exports.o = o;
exports.onMounted = onMounted;
exports.ref = ref;
//# sourceMappingURL=../../.sourcemap/mp-weixin/common/vendor.js.map

40
unpackage/dist/dev/mp-weixin/index.js vendored Normal file
View File

@ -0,0 +1,40 @@
"use strict";
const common_vendor = require("./common/vendor.js");
const _sfc_main = {
__name: "index",
setup(__props) {
const canvasWidth = common_vendor.ref(200);
const canvasHeight = common_vendor.ref(200);
function draw() {
const ctx = common_vendor.index.createCanvasContext("canvas");
ctx.beginPath();
ctx.arc(100, 100, 80, 0, Math.PI * 2);
ctx.setFillStyle("rgba(0, 0, 0, 1)");
ctx.fill();
ctx.beginPath();
ctx.arc(100, 100, 75, 0, Math.PI * 2);
ctx.setFillStyle("white");
ctx.fill();
ctx.draw(false, setTimeout(() => {
common_vendor.index.__f__("log", "at pages/index/index.vue:32", 3);
}, 300));
}
const handleDraw = () => {
common_vendor.index.__f__("log", "at pages/index/index.vue:39", "111111");
draw();
common_vendor.index.__f__("log", "at pages/index/index.vue:41", "222222222");
};
common_vendor.onMounted(() => {
});
return (_ctx, _cache) => {
return {
a: canvasWidth.value,
b: canvasHeight.value,
c: common_vendor.o(handleDraw)
};
};
}
};
const MiniProgramPage = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["__scopeId", "data-v-1cf27b2a"]]);
exports.MiniProgramPage = MiniProgramPage;
//# sourceMappingURL=../.sourcemap/mp-weixin/index.js.map

30
unpackage/dist/dev/mp-weixin/pages/index/index.js vendored
View File

@ -1,30 +1,4 @@
"use strict";
const common_vendor = require("../../common/vendor.js");
const _sfc_main = {
__name: "index",
setup(__props) {
function draw() {
const ctx = common_vendor.index.createCanvasContext("canvas");
ctx.beginPath();
ctx.arc(100, 100, 80, 0, Math.PI * 2);
ctx.setFillStyle("rgba(0, 0, 0, 1)");
ctx.fill();
ctx.beginPath();
ctx.arc(100, 100, 75, 0, Math.PI * 2);
ctx.setFillStyle("white");
ctx.fill();
ctx.draw();
}
const handleDraw = () => {
draw();
};
return (_ctx, _cache) => {
return {
a: common_vendor.o(($event) => handleDraw())
};
};
}
};
const MiniProgramPage = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["__scopeId", "data-v-1cf27b2a"]]);
wx.createPage(MiniProgramPage);
const index = require("../../index.js");
wx.createPage(index.MiniProgramPage);
//# sourceMappingURL=../../../.sourcemap/mp-weixin/pages/index/index.js.map

2
unpackage/dist/dev/mp-weixin/pages/index/index.wxml vendored
View File

@ -1 +1 @@
<view class="data-v-1cf27b2a"><canvas class="data-v-1cf27b2a" canvas-id="canvas" id="canvas" style="width:200px;height:200px"></canvas><button class="data-v-1cf27b2a" bindtap="{{a}}">点击绘制圆形</button></view>
<view class="data-v-1cf27b2a"><canvas class="data-v-1cf27b2a" canvas-id="canvas" id="canvas" style="width:200px;height:200px;border:1px solid red" width="{{a}}" height="{{b}}"></canvas><button class="data-v-1cf27b2a" bindtap="{{c}}">点击绘制圆形</button></view>

2
unpackage/dist/dev/mp-weixin/pages/index/index.wxss vendored
View File

@ -1,6 +1,4 @@
/* 样式部分 */
button.data-v-1cf27b2a {
margin-top: 10px;
/* 给按钮设置一些上边距以避免过于紧凑 */
}

4
unpackage/dist/dev/mp-weixin/pages/index/index2.js vendored Normal file
View File

@ -0,0 +1,4 @@
"use strict";
const index = require("../../index.js");
wx.createPage(index.MiniProgramPage);
//# sourceMappingURL=../../../.sourcemap/mp-weixin/pages/index/index2.js.map

16
unpackage/dist/dev/mp-weixin/pages/index/indexFu.js vendored Normal file
View File

@ -0,0 +1,16 @@
"use strict";
require("../../common/vendor.js");
if (!Math) {
indexZi();
}
const indexZi = () => "./index2.js";
const _sfc_main = {
__name: "indexFu",
setup(__props) {
return (_ctx, _cache) => {
return {};
};
}
};
wx.createPage(_sfc_main);
//# sourceMappingURL=../../../.sourcemap/mp-weixin/pages/index/indexFu.js.map

6
unpackage/dist/dev/mp-weixin/pages/index/indexFu.json vendored Normal file
View File

@ -0,0 +1,6 @@
{
"navigationBarTitleText": "fu",
"usingComponents": {
"index-zi": "./index"
}
}

1
unpackage/dist/dev/mp-weixin/pages/index/indexFu.wxml vendored Normal file
View File

@ -0,0 +1 @@
<view><index-zi u-i="51b35b8e-0" bind:__l="__l"></index-zi></view>

0
unpackage/dist/dev/mp-weixin/pages/index/indexFu.wxss vendored Normal file
View File

16
unpackage/dist/dev/mp-weixin/pages/index/step2.js vendored Normal file
View File

@ -0,0 +1,16 @@
"use strict";
require("../../common/vendor.js");
if (!Math) {
indexstep2();
}
const indexstep2 = () => "./index2.js";
const _sfc_main = {
__name: "step2",
setup(__props) {
return (_ctx, _cache) => {
return {};
};
}
};
wx.createPage(_sfc_main);
//# sourceMappingURL=../../../.sourcemap/mp-weixin/pages/index/step2.js.map

6
unpackage/dist/dev/mp-weixin/pages/index/step2.json vendored Normal file
View File

@ -0,0 +1,6 @@
{
"navigationBarTitleText": "fu",
"usingComponents": {
"indexstep2": "./index"
}
}

1
unpackage/dist/dev/mp-weixin/pages/index/step2.wxml vendored Normal file
View File

@ -0,0 +1 @@
<view><indexstep2 u-i="41bebd5e-0" bind:__l="__l"></indexstep2></view>

0
unpackage/dist/dev/mp-weixin/pages/index/step2.wxss vendored Normal file
View File