收藏
回答

小程序在安卓端和Windows10端显示异常

框架类型 问题类型 终端类型 微信版本 基础库版本
小程序 Bug 微信安卓客户端 Windows端 3.8.1.26 2.21.3

问题已解决,原因为translate、rotate属性各端适配不同,详情见下方评论。

-------------------------------分割线-----------------------------------------------------

我个人使用uniapp框架开发的微信小程序(开源地址:Github仓库)出现开发者工具中显示正常,iOS端也基本正常(除了动画有点闪动),而安卓端(测试机型:红米Note8、小米11Ultra)则其中的sa-menu组件出现显示错位(见下图),sa-area组件出现点击判定错位的情况。

已尝试:

  1. 修改sa-menu组件中动态调整的各个尺寸变量为静态的px单位变量;
  2. 移除sa-menu组件中transition属性;

均无法解决问题,且无任何变化

最后一次编辑于  2023-02-03
回答关注问题邀请回答
收藏

2 个回答

  • Gna
    Gna
    2023-02-03

    已排查出问题所在,为translaterotatescale这些变换函数必须放在transform属性中使用,否则会出现在微信PC端微信安卓端、某些浏览器中(例如安卓端chrome浏览器)不生效的情况。

    详情可见个人博客文章:小程序开发务必使用transform包裹translate、rotate、scale属性

    2023-02-03
    有用
    回复
  • 任性༄🍎
    任性༄🍎
    2023-01-30

    看数字和+-,感觉是字体问题,导致父级元素宽高不同,中间的元素旋转没有以中心点旋转导致错位

    用图片代替文字应该就能解决

    2023-01-30
    有用
    回复
登录 后发表内容