首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

微信小程序 折叠屏兼容

最近维护了将近的一年的微信小程序(某知名企业),突然提出要兼容折叠屏,这款小程序主要功能一些图表汇总展示,也就是专门给一些领导用的,也不知道为啥领导们为啥突然喜欢用折叠屏手机了,一句话需求,苦的还是咱们程序员...,但没办法,谁让甲方是爸爸呢,硬着头皮改吧,好在最后解决了,因为是甲方内部使用的小程序,这里不便贴图,但有官方案例图片,以供参考查看了微信官网大屏适配响应显示区域变化启用大屏模式从小程序基础库版本 2.21.3...这也太简单了,但后面证明我想简单了,主要有两大问题:1 尺寸不同的情况下内容展示效果兼容问题2 预览版和体验版 大屏模式冷启动会生效,但热启动 和 菜单中点击重新进入小程、授权操作,会失效变成窄屏解决尺寸问题因为...随后参考了官方的文档 小程序大屏适配指南和自适应布局,方案对于微信小程序原生开发是可行的,但这个项目用的 uni-app开发的,虽然uni-app 也有对应的响应式布局组件,再加上我是个比较爱偷懒的人(...,让我一度怀疑腾讯也这么拉跨还好issues 区一位大神有解决办法 感兴趣的老铁可以去瞅瞅另外 微信小程序开发工具需要取消这两项,最后当项目跑起来后我还挺开心,模拟器上没有问题,但用真机预览的时候我啥眼了

35010
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    微信 H5 页面兼容性解决方案

    最近给公司微信公众号,写了微信h5业务页面,总结分享一下前端开发过程中的几个兼容性坑,项目直接拿的公司页面,所以下文涉及图片都模糊处理了。...1、ios端兼容input光标高度 问题详情描述:input输入框光标,在安卓手机上显示没有问题,但是在苹果手机上 当点击输入的时候,光标的高度和父盒子的高度一样。...但如果该元素已经在浏览器窗口的可见区域内,则不会发生滚动 5、Vue中路由使用hash模式,开发微信H5页面分享时在安卓上设置分享成功,但是ios的分享异常 问题详情描述: ios当前页面分享给好友,...【该方法未验证】 题外话: 如果能用小程序写的页面,尽量上小程序吧,H5开发在微信开发者工具里看页面效果可能看不出问题,因为不能唤起软键盘。...最后: 微信H5页面其实很多知识,登陆授权,jssdk授权,这里就只做了分享,当然还有上传图片、微信支付等功能,都可能会遇到坑,以上几个坑也是比较常遇到的,如果有更好的解决方案的话,欢迎在留言区分享 作者

    3.3K30

    【微信篇】21个微信相关经典问题集锦-微信小程序、微信公众号、微信广告和微信运营

    宋星的“数据驱动营销与运营”的知识星球,第5期精华问答汇总——微信专题。 本期汇总整理与微信相问题包括:微信小程序、微信公众号、微信广告和微信运营四个方面的21个精华问答,与大家分享。...1 微信小程序 Q1:【评估】引流能力 宋老师您好,对于最近很火的微信小程序和它的引流能力您觉得怎么样呢? “ 回答:小程序刚出来的时候,知乎有人找我回答。...其次,微信全站内容发布和传播分析,理论上可以接受定期爬取搜狗的微信搜索接口来获得数据。...比如我有做教育的客户,微信朋友圈的广告表现仅仅是很一般。但是我做摄影的特别大的客户,就特别依赖于微信的广告。...4 微信运营 Q20:【运营】效果评估 您好,宋老师。 请问如何衡量B2B公司的微信运营效果? 有没有查看某个行业平均微信公众号的关注数及帖子的浏览量?

    9K30

    如何创建一个兼容「微信小程序」的Web框架:WIN

    从微信小程序开始内测时,很多人(也包括我)都在考虑这样的问题:「微信小程序」正在让Web走向封闭。...我的第一反应是:创建一个兼容「微信小程序」的Web框架——它即可以在微信上运行,也可以在Web上,还有作为一个混合应用运行。 在微信web开发者工具里,它封装了足够多的细节。...因为「微信小程序」的框架是叫MINA,所以让我们称呼这个框架为WINV。 设计构思 基本的设计点有: 兼容微信小程序的语法——它并没有多少复杂的语法。...只是简单的Virtual DOM操作,以及事件绑定 尽可能兼容大部分的微信API,兼容所有的微信API几乎是不可能的。 提供一个Virtual DOM转换的混合应用插件。...顺便吐槽一句,微信小程序自带的hello world不是标准的hello world。

    1.1K50

    微信小程序自定义导航栏兼容适配所有机型

    目前小程序已在前端占了一席之地,最近公司项目上用的就是小程序开发,由于功能及页面不是很多,所以直接原生开发,毕竟坑可能会少点,在开发过程中,小程序自带导航栏和客户的设计稿导航栏排在一起,感觉很别扭,因此要求去掉微信的自带导航栏...,微信提供了这方面的api,接下来我们就实操。...1.获取导航栏高度及按钮位置 微信提供了获取导航栏高度的Api和胶囊按钮位置的Api // 系统信息 const systemInfo = wx.getSystemInfoSync(); // 胶囊按钮位置信息...// 胶囊到顶部距离 height // 胶囊的高度 right // 胶囊距离右边的距离 通过这几个参数,我们可以计算出状态栏的高度,微信胶囊所占的高度...menuButtonInfo.right; this.globalData.menuHeight = menuButtonInfo.right; } 在onLaunch中调用,因为我这个项目是所有的导航都不用微信自带的

    2.5K1110

    月活8.89亿背后:微信工程师细数兼容测试经验

    一 微信最关注的质量问题 兼容性测试覆盖的环节众多,微信优先选取核心的环节进行测试。并把必测的环节尽量以自动化,云端化的方式实现。那么,哪些问题属于高优先级?...二 对症下药,提前发现问题 上面提及的兼容性问题,出现任何一种情况都是极其严重。微信团队根据同行的积累和历史经验,针对不同的问题,做不同的测试。...3、机型覆盖——云端化测试 兼容性测试根本还是要覆盖机型,微信团队在做一些自动化方案目的就是为了在多种机器上并行执行。原先,微信团队用来做自动化的机型数量较少。...现在兼容性测试迁移到WeTest平台上,测试基于WeTest给微信搭建的私有云平台进行,同时公有云的机型作为补充。 至此,微信团队实现了机型管理云端化,设备覆盖也有了实质性提升。 ?...功能自动化测试迁入WeTest平台 针对功能适配兼容性测试,微信团队也把H5适配兼容性测试和部分高优先级自动化用例迁移到WeTest平台上。

    74830

    月活8.89亿背后:微信工程师细数兼容测试经验

    一、微信最关注的质量问题 兼容性测试覆盖的环节众多,微信优先选取核心的环节进行测试。并把必测的环节尽量以自动化,云端化的方式实现。那么,哪些问题属于高优先级?...二、对症下药,提前发现问题 上面提及的兼容性问题,出现任何一种情况都是极其严重。微信团队根据同行的积累和历史经验,针对不同的问题,做不同的测试。...3、机型覆盖——云端化测试 兼容性测试根本还是要覆盖机型,微信团队在做一些自动化方案目的就是为了在多种机器上并行执行。原先,微信团队用来做自动化的机型数量较少。...现在兼容性测试迁移到WeTest平台上,测试基于WeTest给微信搭建的私有云平台进行,同时公有云的机型作为补充。 至此,微信团队实现了机型管理云端化,设备覆盖也有了实质性提升。...功能自动化测试迁入WeTest平台 针对功能适配兼容性测试,微信团队也把H5适配兼容性测试和部分高优先级自动化用例迁移到WeTest平台上。

    3.2K00

    微信H5页面兼容性解决方案

    点击上方蓝字关注,关注后还可加入「前端交流群」共同进步 作者:codercao https://juejin.im/post/5d47d2eff265da03f77e4e3a 最近给公司微信公众号,写了微信...h5业务页面,总结分享一下前端开发过程中的几个兼容性坑,项目直接拿的公司页面,所以下文涉及图片都模糊处理了。...font-size: 28px; //line-height: 88px; padding-top: 20px; padding-bottom: 20px; }} 2、ios端微信...【该方法未验证】 题外话: 如果能用小程序写的页面,尽量上小程序吧,H5开发在微信开发者工具里看页面效果可能看不出问题,因为不能唤起软键盘。...最后: 微信H5页面其实很多知识,登陆授权,jssdk授权,这里就只做了分享,当然还有上传图片、微信支付等功能,都可能会遇到坑,以上几个坑也是比较常遇到的,如果有更好的解决方案的话,可以联系我哦。

    3.5K43

    微信公众号-微信接口

    接入微信公众平台开发,开发者需要按照如下步骤完成: 填写服务器配置 验证服务器地址的有效性 依据接口文档实现业务逻辑 填写服务器配置 说明:现在选择提交肯定是验证token失败,因为还需要完成代码逻辑...t=sandbox/login 验证服务器地址的有效性 开发者提交信息后,微信服务器将发送GET请求到填写的服务器地址URL上,GET请求携带四个参数 原理 开发者通过检验signature对请求进行校验...sha1加密 开发者获得加密后的字符串可与signature对比,标识该请求来源于微信 搭建Django服务 创建Django工程并添加应用 修改配置文件settings.py ALLOWED_HOSTS...">'sunck' # 把参数放到list中排序后合成一个字符串,再用sha1加密得到新的字符串与微信发来的...39.107.226.105/index/ 注意:此时无需输入8080端口,默认使用80端口请求Nginx服务,Nginx再将请求转发给DJango服务 公众平台点击提交 自有公众号开发: 微信测试平台

    12.3K10

    微信支付之微信退款

    ---- 官方文档 无论刷卡支付、微信公众号支付、扫码支付、H5支付、APP支付等都有申请退款API并且接口一样,本篇文章就拿刷卡支付中的申请退款API文档举例 应用场景 当交易发生之后一段时间内,由于买家或者卖家的原因需要退款时...,卖家可以通过退款接口将支付款退还给买家,微信支付将在收到退款请求并且验证成功之后,按照退款规则将支付款按原路退到买家帐号上。...注意事项 交易时间超过一年的订单无法提交退款 微信支付退款支持单笔交易分多次退款,多次退款需要提交原支付订单的商户订单号和设置不同的退款单号。申请退款总金额不能超过订单金额。...即每秒钟正常的申请退款请求次数不超过150次 错误或无效请求频率限制:6qps,即每秒钟异常或错误的退款申请请求不超过6次 每个支付订单的部分退款次数不能超过50次 下载证书 参考安全规范-3.商户证书 下载:微信商户平台...[CDATA[4200000100201801133414066940]]> 微信支付、支付宝支付博客专栏 如有疑问欢迎留言交流讨论

    8.4K11

    微信支付来了,微信App来了,微信能力来了

    1、几乎所有榜样都是大企业,中小企业缺席:很多与微信有合作历史,大企业在微信探索方面,有队伍也有资源。微信对于开放异常谨慎,张弛有度,依然是“找先进、树典型”的思路在引导微信App产业良性发展。...万众瞩目的微信支付能力如何开放,审核规则是什么?微信只表态,微信支付接口审核严格,现在早期审核流程未来会不断完善。开放已是必然的,就看何时了。...由于安全要求高,就算有阿里的虎视眈眈,微信也得小心翼翼。 接下来微信还计划将语音识别接口开放给微信之外的App。...微信支付影响的不只是手机支付宝本身。通过微信支付盘活腾讯电商系,让淘宝店主纷纷入驻微信或者易迅开店,直接动阿里的基业。...新能力:百度、高德和迅飞被影响,微信内的接口调用需求是微信的 微信接下来会将语音识别能力开放给微信之外的App。同时还会提供语义识别能力开放。

    6.3K60

    完美适配最新微信小程序隐私协议开发指南,兼容uniapp版本

    前一阵微信小程序官方发布了一个用户隐私保护指引填写说明,说是为了规范开发者的用户个人信息处理行为,保障用户合法权益,小程序、插件中涉及处理用户个人信息的开发者,均需补充相应用户隐私保护指引。...逛开发者社区很多人在吐槽这个东西,按照现在的实现方式微信完全可以自己在它的框架层实现,非得让开发者多此一举搞个弹窗再去调它的接口通知它。...privacy.json { "component":true, "usingComponents":{} } uniapp版本 uniapp 版本也可以直接用上面的代码,新建的 privacy 组件放到微信小程序对应的...wxcompnents 目录下,这个目录下是可以直接放微信小程序原生的组件代码的,因为目前只有微信小程序有这个东西,后期还可能随时会更改,所以没必要再额外去封装成 vue 组件了。...-- #endif --> 注意uniapp官方目前还没有来适配微信这,目前开发调试 usePrivacyCheck 这个设置放到 page.json 文件里无效的

    93930

    微信开发--微信公众号(一)

    工具: 微信公众号,新浪云(还有云豆 ? ),SourceTree 准备: 开通一个微信测试号并关注(毕竟不是测试号我们没有那么多权限啦.)...微信公众平台开发者文档--接入指南 1.在新浪云服务器的仓库里新建PHP文件,右键url访问,复制url地址在 微信测试账号的 接口配置信息里,Token 随便起一个 (好记的)名字 2.配置PHP文件并上传服务器...,配置按照 微信公众号开发者文档 接入指南,第一步已经在第一条完成 3, 第二步 下载PHP示例代码,解压打开PHP文件夹下的 sha1.php 文件, 修改文件信息如下: 微信公众平台开发者文档--自定义菜单--自定义菜单创建接口 8. 新建一个PHP文件,我取名 menu.php ,此文件用来自定义菜单,代码示例: 微信客户端发来的消息后,服务器要返回什么样的数据.

    21.1K32
    领券