微信小程序canvas横屏签名

微信小程序的Canvas API可以用于创建各种图形效果，包括绘制图片、文字和自定义路径等。如果你想要实现横屏签名功能，你可以按照以下步骤操作：

1. **设置页面布局**：在`app.json`文件中配置支持横竖屏显示，然后在对应的wxml文件里设置视图容器为可滚动的，并允许用户旋转屏幕。

{
  "window": {
    "minimumWidth": "750",
    "minimumHeight": "812",
    "styles": {
      "window": {
        "flexDirection": "column"
      }
    },
    "orientation": "both"
  }
}

2. **初始化Canvas**：在`Page`组件的`onLoad`或适当生命周期函数中，获取`canvas`元素并设置宽高比为适应横屏。

Page({
  canvasRef: null,
  onLoad: function() {
    this.canvasRef = wx.createSelectorQuery().select('#myCanvas').fields({
      node: true
    }).exec()[0];
    // 设置默认宽高比
    this.canvasRef.style.width = '100%';
    this.canvasRef.style.height = 'auto';
  },
  onResize: function(e) {
    let ratio = window.innerWidth / window.innerHeight;
    this.canvasRef.style.width = `${ratio}px`;
    this.canvasRef.style.height = `${1 / ratio}px`;
  }
})

3. **监听屏幕旋转**：使用`wx.onWindowResize`监听窗口大小变化，调整canvas的宽高比以适应横屏。

4. **绘制用户签名**：使用`wx.createContext`获取绘图上下文，监听用户的触控事件（如touchstart, touchmove, touchend），在canvas上实时绘制用户的手势。

5. **保存或分享签名**：当用户完成签名后，可以将canvas的内容转换为base64编码的图片数据，然后保存到本地相册或通过API发送给服务器。