feat: textPaint

miniprogram/app.json

@@ -1,5 +1,5 @@
 {
-    "pages": ["pages/index/index", "pages/logs/logs"],
+    "pages": ["pages/index/index", "pages/logs/logs", "demoPages/textPaint/textPaint"],
     "window": {
         "navigationBarTextStyle": "black",
         "navigationStyle": "custom"
@@ -15,5 +15,6 @@
     },
     "componentFramework": "glass-easel",
     "sitemapLocation": "sitemap.json",
-    "lazyCodeLoading": "requiredComponents"
+    "lazyCodeLoading": "requiredComponents",
+    "enablePullDownRefresh": false
 }

miniprogram/demoPages/textPaint/textPaint.js

@@ -0,0 +1,54 @@
+Page({
+    data: {
+        showModal: false,
+        texts: ['', '', '', ''],
+    },
+
+    onReady: function () {
+        this.drawCircles();
+    },
+
+    drawCircles: function () {
+        const ctx = wx.createCanvasContext('myCanvas');
+        const { texts } = this.data;
+
+        // 绘制4个圆圈
+        for (let i = 0; i < 4; i++) {
+            const x = 50 + i * 100;
+            const y = 50;
+            ctx.beginPath();
+            ctx.arc(x, y, 40, 0, 2 * Math.PI);
+            ctx.setFillStyle('white');
+            ctx.fill();
+            ctx.setStrokeStyle('black');
+            ctx.stroke();
+
+            if (texts[i]) {
+                ctx.setFillStyle('black');
+                ctx.setFontSize(20);
+                ctx.setTextAlign('center');
+                ctx.setTextBaseline('middle');
+                ctx.fillText(texts[i], x, y);
+            }
+        }
+
+        ctx.draw();
+    },
+
+    showInput: function () {
+        this.setData({ showModal: true });
+    },
+
+    updateText: function (e) {
+        const index = e.currentTarget.dataset.index;
+        const value = e.detail.value;
+        const { texts } = this.data;
+        texts[index] = value;
+        this.setData({ texts });
+    },
+
+    confirmInput: function () {
+        this.setData({ showModal: false });
+        this.drawCircles();
+    },
+});

miniprogram/demoPages/textPaint/textPaint.json

@@ -0,0 +1,7 @@
+{
+    "navigationBarTitleText": "文本绘制 示例",
+    "navigationBarBackgroundColor": "#d2e7d8",
+    "homeButton": true,
+    "backgroundColor": "#e8eddb",
+    "enablePullDownRefresh": false
+}

miniprogram/demoPages/textPaint/textPaint.wxml

@@ -0,0 +1,13 @@
+<view class="container">
+    <canvas canvas-id="myCanvas" style="width: 100%; height: 100vh;"></canvas>
+    <button class="input-button" bindtap="showInput">输入文本</button>
+    <view wx:if="{{showModal}}" class="modal">
+        <view class="modal-content">
+            <input placeholder="输入第一个文本" bindinput="updateText" data-index="0" />
+            <input placeholder="输入第二个文本" bindinput="updateText" data-index="1" />
+            <input placeholder="输入第三个文本" bindinput="updateText" data-index="2" />
+            <input placeholder="输入第四个文本" bindinput="updateText" data-index="3" />
+            <button bindtap="confirmInput">确认</button>
+        </view>
+    </view>
+</view>

miniprogram/demoPages/textPaint/textPaint.wxss

@@ -0,0 +1,34 @@
+.container {
+    position: relative;
+}
+
+canvas {
+    width: 100%;
+    height: 100vh;
+}
+
+.input-button {
+    position: absolute;
+    bottom: 20px;
+    right: 20px;
+    z-index: 10;
+}
+
+.modal {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-color: rgba(0, 0, 0, 0.5);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.modal-content {
+    background-color: white;
+    padding: 20px;
+    border-radius: 10px;
+    width: 80%;
+}

miniprogram/pages/index/index.json

@@ -1,5 +1,7 @@
 {
-  "usingComponents": {
+    "navigationBarTitleText": "首页",
-    "navigation-bar": "/components/navigation-bar/navigation-bar"
+    "navigationBarBackgroundColor": "#d2e7d8",
-  }
+    "homeButton": true,
-}
+    "backgroundColor": "#e8eddb",
+    "enablePullDownRefresh": false
+}

miniprogram/pages/index/index.less

@@ -1,61 +1,33 @@
 /**index.less**/
 page {
-  height: 100vh;
+    height: 100vh;
-  display: flex;
+    display: flex;
-  flex-direction: column;
+    flex-direction: column;
-}
-.scrollarea {
-  flex: 1;
-  overflow-y: hidden;
 }
 
-.userinfo {
+.scroll-view {
-  display: flex;
+    flex: 1;
-  flex-direction: column;
+    overflow-y: hidden;
-  align-items: center;
-  color: #aaa;
-  width: 80%;
 }
 
-.userinfo-avatar {
+.card {
-  overflow: hidden;
+    margin: 10px;
-  width: 128rpx;
+    padding: 10px;
-  height: 128rpx;
+    background-color: #fff;
-  margin: 20rpx;
+    border-radius: 10px;
-  border-radius: 50%;
+    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
-}
+    width: calc(33.33% - 20px);
+    /* Adjust width for three cards per row */
+    box-sizing: border-box;
+    /* Ensure padding and margin are included in the width */
+    display: inline-block;
+    /* Allow cards to sit next to each other */
+    vertical-align: top;
+    /* Align cards to the top */
 
-.usermotto {
+    .card-title {
-  margin-top: 200px;
+        font-size: 18px;
-}
+        font-weight: bold;
-.avatar-wrapper {
+        color: #333;
-  padding: 0;
+    }
-  width: 56px !important;
+}
-  border-radius: 8px;
-  margin-top: 40px;
-  margin-bottom: 40px;
-}
-
-.avatar {
-  display: block;
-  width: 56px;
-  height: 56px;
-}
-
-.nickname-wrapper {
-  display: flex;
-  width: 100%;
-  padding: 16px;
-  box-sizing: border-box;
-  border-top: .5px solid rgba(0, 0, 0, 0.1);
-  border-bottom: .5px solid rgba(0, 0, 0, 0.1);
-  color: black;
-}
-
-.nickname-label {
-  width: 105px;
-}
-
-.nickname-input {
-  flex: 1;
-}

miniprogram/pages/index/index.ts

@@ -1,43 +1,26 @@
-// index.ts
+Page({
-import callCloud from '../../base/callCloud';
+    data: {
-
+        cards: [
-// 获取应用实例
+            {
-Component({
+                key: 0,
-    data: {},
+                title: '文本绘制',
-    methods: {
+                url: '/demoPages/textPaint/textPaint',
-        test() {
+            },
-            console.log('1test');
+            {
-            this.getOpenId();
+                key: 1,
-        },
+                title: '文本绘制',
-        async getOpenId() {
+                url: '/demoPages/textPaint/textPaint',
-            const res = await callCloud('getOpenId');
+            },
-            console.log('res-----:', res);
+            {
-
+                key: 2,
-            // const areaIds = await callCloud('createArea');
+                title: '文本绘制',
-            // console.log('areaIds-----:', areaIds);
+                url: '/demoPages/textPaint/textPaint',
-
+            },
-            // const stationIds = await callCloud('createStation');
+            {
-            const reslut = await callCloud('createPDF');
+                key: 3,
-            console.log('reslut-----:', reslut);
+                title: '文本绘制',
-            // wx.cloud
+                url: '/demoPages/textPaint/textPaint',
-            //     .callFunction({
+            },
-            //         name: 'user',
+        ],
-            //         data: {
-            //             type: 'getOpenId',
-            //         },
-            //     })
-            //     .then((resp: Record<string, any>) => {
-            //         console.log('resp-----:', resp);
-            //         this.setData({
-            //             haveGetOpenId: true,
-            //             openId: resp.result.openid,
-            //         });
-            //         wx.hideLoading();
-            //     })
-            //     .catch((error: any) => {
-            //         console.log('error:', error);
-            //         wx.hideLoading();
-            //     });
-        },
     },
 });

miniprogram/pages/index/index.wxml

@@ -1,5 +1,11 @@
 <!--index.wxml-->
-<navigation-bar title="Weixin" back="{{false}}" color="black" background="#FFF"></navigation-bar>
+<scroll-view class="scroll-view" scroll-y type="list">
-<scroll-view class="scrollarea" scroll-y type="list">
+    <view 
-  <view bind:tap="test">测试点击</view>
+        class="card" 
+        x:for="{{cards}}" 
+        wx:for-item="card"
+        bindtap="tabCard" 
+        data-url="{{card.url}}">
+        <view class="card-title">{{card.title}}</view>
+    </view>
 </scroll-view>

package.json

@@ -13,7 +13,7 @@
         "eslint-config-prettier": "9.1.0",
         "eslint-plugin-prettier": "5.2.1",
         "globals": "^15.14.0",
-        "miniprogram-api-typings": "^4.0.2",
+        "miniprogram-api-typings": "^4.0.5",
         "prettier": "3.4.2",
         "typescript-eslint": "^8.18.1"
     }

project.config.json

@@ -20,11 +20,17 @@
         "minifyWXSS": true,
         "enhance": true,
         "showShadowRootInWxmlPanel": false,
-        "packNpmRelationList": [],
+        "packNpmRelationList": [
+            {
+                "packageJsonPath": "./package.json",
+                "miniprogramNpmDistDir": "./miniprogram/"
+            }
+        ],
         "ignoreUploadUnusedFiles": true,
         "compileHotReLoad": false,
         "skylineRenderEnable": true,
-        "es6": true
+        "es6": true,
+        "packNpmManually": true
     },
     "simulatorType": "wechat",
     "simulatorPluginLibVersion": {},