ソースを参照

文字旋转修改

wangyong 6 年 前
コミット
7750405fd9

+ 2 - 2
customized/pages/canvas/canvas.js

@@ -31,11 +31,11 @@ Page({
     ctx.textBaseline = 'top';
     // ctx.textAlign = "center";
     ctx.setFontSize(20);
-    let rotate = 50
+    let rotate = 0
     // ctx.translate(50,50)
     ctx.rotate(rotate * Math.PI / 180);
     // ctx.translate(50, 0)
-    ctx.fillText('王',20, 20);
+    ctx.fillText('王',0, 0);
     
     ctx.draw();
     ctx.restore()

+ 2 - 2
customized/pages/made/comb/comb.js

@@ -208,7 +208,7 @@ Page({
       simulationFont = wx.getStorageSync('simulationFont' + i);
       dataPositionObj = util.changeCup(i.toString()).dataPositionObj;
       const ctx = wx.createCanvasContext('comb-font'+i);
-      ctx.textBaseline = 'top';
+      // ctx.textBaseline = 'top';
       ctx.setFontSize(fontTouch.fontSize);
       ctx.setFillStyle(fontTouch.isColor);
       const metrics = ctx.measureText(fontTouch.fontContent)
@@ -216,7 +216,7 @@ Page({
       let movey = fontTouch.y + simulationFont.height / 2;
       ctx.translate(movex, movey);
       ctx.rotate(fontTouch.angle * Math.PI / 180);
-      ctx.fillText(fontTouch.fontContent, -metrics.width / 2, -simulationFont.height / 2);
+      ctx.fillText(fontTouch.fontContent, -metrics.width / 2, -simulationFont.height / 2 + simulationFont.height / 5 * 4);
       
       console.log(metrics,"文本的宽度")
       ctx.draw(false,function () {

+ 2 - 2
customized/pages/made/comb/comb.wxml

@@ -1,4 +1,4 @@
-<!-- <view style="position:fixed;top:999999999999999999999rpx;"> -->
+<view style="position:fixed;top:999999999999999999999rpx;">
   <!-- 正面 -->
   <canvas canvas-id="comb-canvas1" class="comb-content"></canvas>
   <canvas canvas-id='comb-img1' class='comb-img'></canvas>
@@ -15,7 +15,7 @@
   <canvas canvas-id="comb-canvas4" class="comb-content"></canvas>
   <canvas canvas-id='comb-img4' class='comb-img4'></canvas>
   <canvas canvas-id='comb-font4' class='comb-font4'></canvas>
-<!-- </view> -->
+</view>
 <view class='comb-view-img'>
   <image wx:for="{{buildSrcArray}}" mode="aspectFit" src='{{item}}'></image>
 </view>

+ 3 - 1
customized/pages/made/made.js

@@ -44,6 +44,7 @@ Page({
       fontContent:'',
       fontSize:'',
       height:'',
+      width:'',
     }
   },
 
@@ -262,7 +263,8 @@ Page({
     query.exec(function (res) {
       console.log(res, "获取font的宽高");
       that.setData({
-        'simulation.height': res[0].height
+        'simulation.height': res[0].height,
+        'simulation.width': res[0].width
       });
       wx.setStorageSync('simulationFont' + that.data.isActive, that.data.simulation);
     })

+ 1 - 1
customized/pages/made/made.wxml

@@ -54,7 +54,7 @@
 
 </view>
 
-<view class='font-height' style='font-size:{{simulation.fontSize}}px;position:fixed;top:999999999999999999999rpx;' id='simulation'>{{simulation.fontContent}}</view>
+<text class='font-height' style='font-size:{{simulation.fontSize}}px;position:fixed;top:999999999999999999999rpx;' id='simulation'>{{simulation.fontContent}}</text>
 
 
 <!-- <view style="position:fixed;top:999999999999999999999rpx;"> -->