微信小程序生成商品海报后适配问题解决方案

 时间:2024-10-12 21:27:31

1、小程序分享商品,生成商品海报后,适配出现如图问题

微信小程序生成商品海报后适配问题解决方案

2、查看微信官方仿瓤僭蚋资料,推荐开发微信小程序时设计师可以用 iPhone6 作为视觉稿的标准,因为iPhone6的换算比较符合习惯。

微信小程序生成商品海报后适配问题解决方案

3、微信小程序提供getSystemInfo(Object object)获取系统信息,可以利用这个官方API获取机型窗口的宽和高,然后根据自己的需求设置宽高比例。

微信小程序生成商品海报后适配问题解决方案

4、生成海报时,再Canvas画布上画内容时,将内容的坐标、宽高、字体大小换算成rpx单位,这样可以根据屏幕宽度进行自适应。

微信小程序生成商品海报后适配问题解决方案

5、对于文字的显示处理,是通过计算宽度之后,进行换行显示

微信小程序生成商品海报后适配问题解决方案

6、最后把所有的内容画出来,使用不同机型测试,显示正常,适配问题解决

微信小程序生成商品海报后适配问题解决方案微信小程序生成商品海报后适配问题解决方案
  • 怎么设置群公告
  • 脚气方系列一:自制土槿皮浸液
  • 怎样组织一场成功的展会?
  • 狗狗配种后多久之内吃避孕药管用
  • 宝马320i油泵继电器在什么位置
  • 热门搜索
    旅游点评网 美国拉斯维加斯旅游 十一旅游好去处 上海春秋旅游网 保定周边旅游景点 淮安旅游景点大全 埃及旅游局 广州旅游团 洛阳的旅游景点 养生旅游