想开发一款定制手机壳的小程序,大概的流程就是用户选择机型--> 选择图片编辑图片(缩放,移动,旋转操作)--->导出成品。 一般的做法都是在 canvas 里面 先把摄像头图片 drawImage,再操作导入的图片最后导出图片,现在在画摄像头遇到的问题是无法定位摄像头的坐标值。 研究过线上的类似产品,以 iPhone X 手机壳为例,我抓包看后端返回的数据格式如下:
{
template_id: 93,
phone_id: 10186,
choose_phone_w: 71,
choose_phone_h: 143.6,
corner_radius: 10,
color_resource: {
canva_margin_h: -2,
canva_margin_w: -2,
material_cover_img: "/img/8tkh2hfmwn10186.png",
material_cover_mask: "/img/drzqq1i1eh10186.png",
status: 1,
has_side: 0,
color_id: 11
},
bg_img: "/img/uxetw10186.png",
shapes: [
{
x: -23.75,
y: -53.55,
w: 13.25,
h: 28,
url: "/img/xxsza10186.png",
shadow_url: "/img/syhe810186.png"
}
]
}
其中-23.75 和-53.55 应该是 iPhone X 摄像头的坐标?但是看了实际 iPhonex 摄像头的尺寸肯定不对。 所以想请教-23.75 和-53.55 应该是 iPhone X 摄像头的坐标吗?如果是的,对应到手机里面摄像头的坐标该如何计算?