标签：

使用 uni.createCanvasContext 的 drawImage 方法时，可以通过一些计算来实现图片的自适应宽高。下面是一个示例代码，展示了如何根据图片的原始宽高以及目标容器的宽高，计算出适合展示图片的宽高和位置。

// 获取图片的原始宽高
const imageInfo = uni.getImageInfo({
  src: '图片路径'
});

// 目标容器的宽高
const containerWidth = 400; // 替换成实际容器的宽度
const containerHeight = 300; // 替换成实际容器的高度

// 缩放比例
const scale = Math.min(containerWidth / imageInfo.width, containerHeight / imageInfo.height);

// 计算图片的实际宽高
const imageWidth = imageInfo.width * scale;
const imageHeight = imageInfo.height * scale;

// 计算图片在容器中的位置
const x = (containerWidth - imageWidth) / 2;
const y = (containerHeight - imageHeight) / 2;

// 创建画布上下文
const ctx = uni.createCanvasContext('canvas-id');

// 绘制图片
ctx.drawImage('图片路径', x, y, imageWidth, imageHeight);

// 在调用 drawImage 方法之后，可以通过以下代码将画布上下文绘制到指定的 canvas 上
ctx.draw();

在上述示例中，首先使用 uni.getImageInfo 方法获取图片的原始宽高，然后计算缩放比例以及图片的实际宽高和位置。最后，使用 drawImage 方法将图片绘制到画布上，并通过 draw 方法将画布上下文绘制到指定的 canvas 上。

标签：
来源：

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。