|
前言
canvas是微信小程序中最常用的组件之一，可以实现图片裁剪、压缩等多种功能。但是实现这些功能的前提之一是用canvas绘制图片，但是由于微信官方的辣鸡文档，总是要有坑需要踩，其中最常见的就是使用drawImage这个API绘制图片时经常出现的图片缩放问题。
解决思路
首先给定一个canvas宽度 （假定为窗口宽度），然后根据所要绘制的图片计算出图片的高宽比，再使用窗口高度（除去导航栏，状态栏剩下的部分）乘以图片高宽比得到画布高度，计算公式如下：
c
a
n
v
a
s
_
w
i
d
t
h
=
w
i
n
d
o
w
_
w
i
d
t
h
c
a
n
v
a
s
_
h
e
i
g
h
t
=
w
i
n
d
o
w
_
h
e
i
g
h
t
∗
i
m
a
g
e
_
h
e
i
g
h
t
i
m
a
g
e
_
w
i
d
t
h
canvas\_width=window\_width \\ canvas\_height=window\_height * \frac{image\_height}{image\_width}
canvas_width=window_widthcanvas_height=window_height∗image_widthimage_height
代码实现
|