小程序兼容ios
2018-09-03 10:39:28 CrazyCourt 阅读数 857

1.margin在IOS中失效 
在页面中元素使用margin值,在某些IOS设备下会出现失效的情况,而安卓机则正常显示,此问题暂无直接的解决方案,当前使用空DIV控制间距。 
2.fixed定位问题 
整个页面的fixed定位,在ios下下拉会触发下拉事件,但是没有动画效果。Android就能正常运行 
flex中使用 绝对定位,ios出现严重错位,导致父级元素也会变成绝对定位,Android能达到理想效果 
总而言之 == 解决问题 诱导 : https://developers.weixin.qq.com/community/develop/doc/000e8a5b09c4a09559e67aae65b800?highLine=%25E6%25A0%25B7%25E5%25BC%258F%25E5%2585%25BC%25E5%25AE%25B9
3.absolute定位问题 
①使用absolute定位,并且宽带设置了100% 并且设置了padding就会导致屏幕宽度溢出,出现页面左右可以移动的bug,模拟器上是没有问题,但是真机上是有这个问题的。这个问题让我调试并痛苦了许久 
②使用absolute并且当前元素是flex容器这种情况在Ios下面布局不会起到左右,会出现所有元素转换成了absloute并且文字错位 
③总而言之 尽量不用 absolute 
4. word-spacing在button中的问题 
有时候在使用大按钮的时候两个字中间希望有段间距,但是目前没有找到能使用的占位符,所以使用了的word-spacing加空格 这个方法来设置文字的间距,但是在iPhone6s 上两个字中间一个空格的时候整体会向右偏,必须设置两个空格。 
5.相同代码存在效果差异 
6.不同机型显示有差异 

2018-09-30 11:08:32 skyblacktoday 阅读数 108

对参数进行MD5加密注意事项:

       参数中若有带小数点的number,将其转成string型传输,否则ios转化出错,与后台程序不一致,但在安卓中是正常的。

例:

{
    content:"哈哈哈"
    latitude:22.53332
    longitude:113.93041
    location:"我的小店"
    member_id:123051
}

上面的参数写法在安卓系统内,前端MD5加密和后端MD5加密都是一个结果,但是在ios上就不是一样的,这也是在我做小程序时排除多次才发现的,最后改为:

{
    content:"哈哈哈"
    latitude:"22.53332"
    longitude:"113.93041"
    location:"我的小店"
    member_id:123051
}

就可以了。就是小数点的问题。

 

 

 

2019-06-20 18:04:11 qq_34543252 阅读数 35

今天写的小程序的时候遇到一个很奇怪的问题,这里记录一下,下次遇到同样的问题就可以快速的结局了
参考链接: https://blog.csdn.net/qq_33237207/article/details/80761480

在这里插入图片描述

在这里插入图片描述

问题具体的是如上这样在ios上显示的不兼容,在ios和pc上调试都是可以正常的显示的


that.leftTimer(responseData.doneTime.replace(/-/g, '/'))
leftTimer这是自己封装的一个倒数计时的插件,后期会写在博里面
responseData.doneTim 是后台返回给我的一个时间,时间的格式类似是 2019-06-19 13:22:23 这样的格式
在这里我们必须要转化成 2019/06/19 13:22:23 的形式,在ios上才可以完美的兼容
2019-01-24 15:54:39 qq_30109365 阅读数 684

本篇文章记录的是小程序兼容的ios 6.7.7 ,plus, x及xs等等,最后方式设计人员应该看懂的设计方式(会了才能开发设计搞…)

第一、各个iphone的尺寸

绝对是帮你解决各种问题的表,对应微信开发工具去设置,还用什么测试机,省省省。

在这里插入图片描述
在这里插入图片描述

第二、考虑各种iPhone x的留海底部,安全区域

真正的代码放着了
界面没有用rpx 用的是 px. 所以我这里就没乘2了,
下面的49是底部有个按钮
1.带x的 都有刘海,注意底部,安全区域。
2.xr是特殊的x, 他是@2x的图,
3.我们开发在设计界面上,概率尺寸就行,分辨是和对应的iphone版本换图才会用到,

wx.getSystemInfo({     //获取窗口信息  设置筛选的高度
      success: function (res) {
        console.log(res)
        var heightNum = res.windowHeight
        that.setData({
          heightbox : heightNum 
        })
        if (res.model.indexOf('iPhone XR') != -1) {    //这个比较特殊
          heightNum = heightNum - 49 - 34;
          that.setData({
            scrollHeight: heightNum,
            paddingb: 34
          });
        } else if (res.model.indexOf('Plus') != -1){
          heightNum = heightNum - 49;
          that.setData({
            scrollHeight: heightNum,
          });

        } else if (res.model.indexOf('iPhone X') != -1){
          heightNum = heightNum - 49 - 34;
          that.setData({
            scrollHeight: heightNum,
            paddingb: 34
          });
        } else {
          heightNum = heightNum - 49;
          that.setData({
            scrollHeight: heightNum,
          });
        }
      }

在这里插入图片描述
放一张开发图
在这里插入图片描述

例外有人通过分辨率来设计宽高,这里我就不指手画脚,因为我没有试过(着急解决问题),后面试试!
放一个简单的demo

wx.getSystemInfo({
      success: function (res) {
        that.setData({
          //动态根据手机分辨率来计算内容的高度(屏幕总高度-顶部筛选栏的高度)
          contentHeight: (res.windowHeight - 72 * res.screenWidth / 750)
        });
      }
    });

3.设计人员请看

对设计稿有详细的了解描述

在这里插入图片描述

2018-10-27 10:06:00 weixin_33910434 阅读数 24

wxs文件代码: 

module.exports = {
  munFormat: function (num, dig = 2) {
    return num.toFixed(dig);
  },
  dateFormat: function (strDate, format = "yyyy-MM-dd hh:mm:ss") {
    // 解决ios出现NaN问题
    var realDate = strDate ? getDate(strDate.replace(getRegExp('-', 'g'), '/')) : getDate();
    var regYear = getRegExp("(y+)", "i");
    var date = [
      ["M+", realDate.getMonth() + 1],
      ["d+", realDate.getDate()],
      ["h+", realDate.getHours()],
      ["m+", realDate.getMinutes()],
      ["s+", realDate.getSeconds()],
      ["q+", Math.floor((realDate.getMonth() + 3) / 3)],
      ["S+", realDate.getMilliseconds()],
    ];
    var reg1 = regYear.exec(format);
    if (reg1) {
      format = format.replace(reg1[1], (realDate.getFullYear() + '').substring(4 - reg1[1].length));
    }
    for (var i = 0; i < date.length; i++) {
      var reg2 = getRegExp("(" + date[i][0] + ")").exec(format);
      if (reg2) {
        format = format.replace(reg2[1], reg2[1].length == 1 ? v : ("00" + date[i][1]).substring(("" + date[i][1]).length));
      }
    }
    return format;
  }
};

小程序 wepy使用方法:

<template>
  <view>{{wxs.munFormat(1.234, 1)}}KM</view>
  <view>{{wxs.dateFormat('2018-10-24 23:23:23', 'hh:mm')}}</view>
</template>
<script>
import wepy from 'wepy';
import wxs from '../wxs/index.wxs';
export default class home extends wepy.page {
  wxs = { wxs };
}

 

转载于:https://my.oschina.net/kaikai1/blog/2253205

没有更多推荐了,返回首页