zoukankan      html  css  js  c++  java
  • uni-app知识点:条件编译#ifdef MP、HBuilder基座和自定义基座差别、去除顶部导航栏、手机桌面应用消息角标实现、APP应用图标配置及云端打包时的注意事项

    一、uni-app里的#ifdef MP是什么意思——条件编译

      uni-app官方文档传送门:条件编译(点我)

      在uni-app模版看到的#ifdef MP,这是什么鬼?对于学过C语言的童鞋并不陌生,因为这是条件编译语句

      为什么会出现在uni-app里呢?因为uni-app的特性:一份代码,多平台运行。没错,就是一套代码,可以在android、ios及各个小程序和h5上运行,因此为了代码简洁性引入的条件编译

      #ifdef   #ifndef  #endif,其实官网介绍的也很详细。我们看标准的语法

    // #ifdef %PLATFORM%
      %PLATFORM%为平台名称
      这里的内容只会编译在该平台
    // #endif

      可以看到其实以#ifdef开头 #endif结尾,但是注意一下就会发现前面双斜杠,这里是注释标记,也就是说在各个代码块里的注释不一样,注释标记就要切换掉,比如:

    js:  // #ifdef
    tag标签: <!--  #ifdef  -->
    css样式: /*  #ifdef  */

      解释一下各语句是什么意思

    #ifdef :       if defined  仅在某个平台编译

    #ifndef :     if not defined  在除里该平台的其他编译

    #endif :       end if 结束条件编译

    %PLATFORM%       需要编译的平台,上面的MP就是各个小程序的意思

      示例:如果只需要在微信小程序上编译某段代码的话

    // #ifdef MP-WEIXIN
        我是在微信小程序上才编译的代码
    // #endif

    二、HBuilder基座和自定义基座差别

    1、HBuilder基座介绍

    (1)点击菜单栏“运行”->“运行到手机或模拟器”,会在手机/模拟器上安装“HBuilder”应用(或者叫HBuilder基座),在应用开发过程中HBuilder/HBuilderX会将应用资源实时同步到基座并刷新,从而实时查看到修改效果。

    (2)这里的“HBuilder”应用(或者叫HBuilder基座)使用的是DCloud申请的第三方SDK配置,开发者设置的第三方SDK配置信息不会生效。如微信分享,分享后显示的来源一定是“HBuilder”。如果开发者希望自己申请的第三方SDK配置生效,则需(3) 在应用中调用uni-app原生插件也必须使用自定义基座。

    2、自定义基座介绍

    (1)自定义基座是使用开发者申请的第三方SDK配置生成的基座应用,用于HBuilder/HBuilderX开发应用时实时在手机/模拟器上查看运行效果

    (2)在HBuilder/HBuilderX中点击菜单栏“运行->运行到手机或模拟器->制作自定义基座”生成自定义基座安装包

    [HBuilder] 19:37:36.837 项目 SOURCE [__UNI__1E9A5AA]打自定义基座包成功:
        路径为: G:/liy/projects/uniapp/SOURCE/unpackage/debug/android_debug.apk
    选择菜单“运行->运行到手机或模拟器->运行基座选择->自定义基座”后再次运行项目,即可通过自定义基座查看日志
    注:自定义基座不可用于正式发布,其脱离HBuilderX无法更新应用资源

    (3)打包成功后需要点击菜单栏“运行->运行到手机或模拟器->运行基座选择->自定义基座”来开启自定义基座功能

    (4)点击菜单栏“运行”->“运行到手机或模拟器”,可实时在手机上查看运行效果

    3、查看基座版本号

    onReady:function(){
        // #ifdef APP-PLUS
        console.log("运行环境版本号(客户端uni-app的基座版本号):" + plus.runtime.uniVersion);
        console.log("应用基座版本号(客户端5+运行环境的版本号):" + plus.runtime.innerVersion);//格式为:[主版本号].[次版本号].[修订版本号].[编译代号]
        // #endif   
    },

    4、注意:使用自定义基座各种SDK配置才能生效, 但是使用自定义基座进行云端打包后,HX提示【自定义基座不可用于正式发布,其脱离HBuilderX无法更新应用资源】,手机安装打出来的包提示【当前应用运行在测试环境,发布正式版请打正式包】。

      原因是因为自定义基座和HBuilder自带基座都是用于开发调试。使用自定义基座开发调试uni-app原生插件后,不可直接将自定义基座apk作为正式版发布。云打包时若勾选了“自定义基座”,打出来的是测试包;应该重新提交云端打包(不能勾选“自定义基座”)生成正式版本,正式包的SDK配置会自动生效。

      打正式包取消勾选“自定义基座”。

    三、去除顶部导航栏

      比如启动页隐藏顶部导航栏,这个可能用到的场景有登录及一些单页面,话不多说直接上代码。

      在 pages.json 文件 style:{"app-plus":{"titleNView":false}} 即可实现单页面隐藏顶部导航的效果。

      同样是在pages.json里配置"app-plus":{"titleNView":false}即可实现全局隐藏导航栏

    {
      "path": "pages/video/video",
      "style": {
        "app-plus": {
          "titleNView": false
        }
      }
    }

    四、手机桌面应用消息角标实现

    // 使用 h5+ 实现
    // 设置数字
    plus.runtime.setBadgeNumber(8);
    // 清除数字
    plus.runtime.setBadgeNumber(0);

    五、app应用图标配置

      在manifest.json里去配置

      图中画红线的几点需要注意。

      选择了1024*1024的图片之后,点击自动生成所有图标并替换,那么下面的内容就会自动生成替换了,挺方便的。

      当然需要注意的是:云端打包应用图标配置注意事项

    1、iOS平台

    • 图标必须是直角,不要使用圆角图标,使用圆角appstore审核不会通过
    • 打包提交appstore时,必须配置1024*1024分辨率的appstore图标,云端打包机默认使用纯白色图标
    • 所有图标不要包含透明信息(alpha通道),否则提交appstore会报以下错误
    ERROR ITMS-90717: "Invalid App Store Icon. The App Store Icon in the asset catalog in 'HBuilder.app' 
    can't be transparent nor contain an alpha channel.
    "

      解决方案就是:导出png图标时去掉alpha通道即可

      更多应用图标相关信息,参考官方说明:https://developer.apple.com/design/human-interface-guidelines/ios/icons-and-images/app-icon/

    2、Android平台

      Android系统没有对图标进行限制,按照建议的分辨率配置即可,可以有透明区域,也可以是圆角图标。

      可能有些特殊ROM对图标有所要求,提交应用市场时注意看是否有要求说明。

    3、资源介绍

      AI智能logo设计:https://www.logosc.cn/

  • 相关阅读:
    abstract修饰方法总结
    linux tar.gz zip 解压缩 压缩命令
    html5视频播放
    Response.Redirect 打开新窗体的两种方法
    Gmail POP3设置
    加壳学习笔记(二)-汇编基础
    C#-异常处理:tyr,catch,finally ---ShinePans
    cocos2d jsb 打包 Android APK
    编写你自己的单点登录(SSO)服务
    一分钟制作U盘版BT3
  • 原文地址:https://www.cnblogs.com/goloving/p/14117469.html
Copyright © 2011-2022 走看看