除了App模板通用的修改外,云智能App 2.X系列模板还支持的自定义内容,如更换主题色、配置UI菜单、对接天猫精灵等。

前提条件

  • 已完成App模板的源码下载。请参见创建自有App
  • 已安装iOS App的开发工具xcode。

修改说明

自定义iOS系列的App模板的操作主要分为修改颜色、修改图片、隐藏默认菜单等。

请您使用xcode打开App模板的源码,并根据以下方法自定义App。

  • 隐藏菜单

    如果您需要隐藏App中的某菜单,请进入待隐藏模块对应的目录后,修改参数对应的值。如下图所示。

    隐藏菜单
    说明 参数值为YES时表示显示菜单;为NO时表示隐藏菜单。
  • 修改图片

    如果您需要修改App中的某张图片,请进入待修改模块图片所对应的目录下,替换目录下的图片,如下图所示。

    顶部图标

    修改App图片时,您需要注意以下内容。

    • 本文档中提供的图片修改目录由父目录与子目录两部分组成。父目录可以修改,子目录不可以修改。
    • 子目录下一般存在多张图片,您都需要修改。
    • 修改App图片的建议您使用xcode工具操作,并确保图片的分辨率与原有图片的保持一致。
  • 修改颜色

    如果您需要修改App中的颜色,请进入待修改模块颜色所对应的目录下,修改参数对应的值,如下图所示。

    修改颜色示例
    说明 如果您需要修改App的主题色,请在./IMSiLopAppFactory/ModuleName_Config.h文件中,修改color_custom_action_def参数的值。

修改注册登录页

云智能2.X系列App模板的默认注册登录页如下图所示。

注册登录页

注册登录页面支持您修改以下内容。

  • 修改图片
    目的 操作父目录 替换子目录下图片(分辨率一致)
    修改背景图 ./IMSiLopAppFactory/Assets.xcassets/custom/ welcome_bg.imageset
    修改顶部图标 welcome_logo.imageset
  • 修改颜色
    目的 操作目录(或文件) 修改参数的值
    修改背景色 ./IMSiLopAppFactory/ModuleName_Config.h color_custom_login_background_def
    修改登录按钮的背景颜色 color_custom_login_background_def
    修改登录按钮文字的颜色 color_custom_login_text_def
    修改注册按钮边框的颜色 color_custom_register_background_border_def
    修改注册按钮文字颜色 color_custom_register_text_def
    标题颜色(欢迎使用...) color_custom_login_title_def
    说明 注册按钮的背景颜色为透明色,因此只能修改注册按钮的边框颜色。

修改App底部菜单

云智能2.X系列App模板的底部有三个菜单,分别为:家、智能、我的。如下图所示。

主菜单

App底部菜单支持您修改以下内容。

  • 隐藏菜单
    目的 操作目录(或文件) 修改参数的值
    隐藏菜单 ./IMSiLopAppFactory/ModuleName_Config.h switch_tabbar_home_def
    隐藏智能菜单 switch_tabbar_imtelligent_def
    隐藏我的菜单 switch_tabbar_me_def
  • 修改菜单的图标
    图标 是否选中状态 操作父目录 替换子目录下图片(分辨率一致)
    ./IMSiLopAppFactory/Assets.xcassets/custom/ tabbar_home_nomal.imageset
    tabbar_home_selected.imageset
    智能 tabbar_intelligent_normal.imageset
    tabbar_intelligent_selected.imageset
    我的 tabbar_mine_nomal.imageset
    tabbar_mine_selected.imageset
  • 修改颜色
    目的 操作目录(或文件) 修改参数的值
    修改选中菜单时的颜色(主菜单图片、文字的颜色) ./IMSiLopAppFactory/ModuleName_Config.h app_custom_home_tab_img_tint_def
    说明 该参数的值,会对图片的颜色进行强制渲染。例如配置为红色后,图片的颜色会变成红色。

修改家菜单页

云智能2.X系列App模板的默认家菜单页(即首页)的界面如下图所示。

首页

菜单页(即首页)支持修改以下内容。

  • 修改图片
    目的 操作父目录 替换子目录下图片(分辨率一致)
    修改背景图 ./IMSiLopAppFactory/Assets.xcassets/custom/ home_bg.imageset
    修改空列表背景图 home_noData.imageset
  • 修改颜色

    请您参照配置示例在./IMSiLopAppFactory/ModuleName_Config.h文件中修改菜单页中的颜色,详细参数请参见源码中的注释。修改方法请参见修改说明

修改智能菜单页

云智能2.X系列App模板的默认智能页如下图所示。

默认场景空态图

智能菜单页支持修改的内容包括:主题色、背景图、空列表背景图(列表为空时的背景图,即上图中加号位置的背景图)等。

  • 修改图片
    目的 操作父目录 替换子目录下图片(分辨率一致)
    修改背景图 ./IMSiLopAppFactory/Assets.xcassets/custom/ intelligent_home_bg.imageset
    修改自动化的空列表背景图 auto_empty.imageset
    修改场景的空列表背景图 scene_empty.imageset
  • 修改颜色

    请您参照配置示例在./IMSiLopAppFactory/ModuleName_Config.h文件中修改智能菜单页中的颜色,详细参数请参见源码中的注释。修改方法请参见修改说明

修改我的菜单页

云智能2.X系列App模板的默认我的菜单页如下图所示。

我的菜单页

我的菜单页中支持修改以下内容。

  • 修改功能列表
    • 隐藏功能列表
      目的 操作目录(或文件) 修改参数的值
      隐藏小组件 ./IMSiLopAppFactory/ModuleName_Config.h switch_me_appExtension_def
      隐藏智能日志 switch_me_imtelligentLog_def
      隐藏意见反馈 switch_me_feedback_def
      隐藏设置 switch_me_setting_def
      隐藏关于 switch_me_about_def
      隐藏更多服务 switch_me_thirdParty_def
      说明 我的菜单页中,个人信息编辑、消息中心、设备共享,三个功能模块不支持隐藏。
    • 修改功能列表的图标

      您可以修改我的菜单页中各项功能列表的图标。

      目的 操作父目录 替换子目录下图片(分辨率一致)
      修改默认头像 ./IMSiLopAppFactory/Assets.xcassets/custom/ mine_default_headIcon.imageset
      修改小组件的图标 mine_widget.imageset
      修改意见反馈的图标 mine_feedback.imageset
      修改消息中心的图标 mine_message.imageset
      修改智能日志的图标 mine_log.imageset
      修改设备共享的图标 mine_share.imageset
      修改更多服务的图标 mine_servers.imageset
      修改设置的图标 mine_setting.imageset
      修改关于的图标 mine_about.imageset
  • 自定义设置页面

    您除了可以隐藏整个设置功能,还可以分别隐藏设置的子功能。

    设置页面
    目的 操作目录(或文件) 修改参数的值
    隐藏固件升级 ./IMSiLopAppFactory/ModuleName_Config.h switch_me_setting_language_def
    隐藏语言 switch_me_setting_ota_def
  • 自定义关于页面 关于页

    您除了可以隐藏整个关于功能,还可以分别隐藏关于的子功能。

    目的 操作目录(或文件) 修改参数的值
    隐藏当前版本 ./IMSiLopAppFactory/ModuleName_Config.h switch_me_about_version_def
    隐藏去评分 switch_me_about_score_def
    隐藏隐私权政策 url_mine_about_privacy_policy_def
    隐藏服务协议 url_mine_about_service_agreement_def
    隐藏开源软件使用协议 switch_me_about_openSource_def
    说明 隐藏隐私权政策隐藏服务协议的参数值默认为空,即App页面不显示。如果您需要配置相关内容,请参见本文档下方修改登录的服务协议的内容来配置。
  • 自定义更多服务页面

    更多服务中主要展示对接的三方平台,仅对接天猫精灵的源码开源。如果您想对接更多三方平台,可自行对接。对接天猫精灵的详细对接操作请参见自有App接入天猫精灵教程

    更多服务
    说明 对接三方平台时,为保证页面可以正常跳转,请勿修改以下代码。其中IMSSmartSpeakerAccess表示我的 > 更多服务的模块名称,IMSThirdPartyListViewController表示模块的入口类。
    + (void)load {
        NSURL *url = [NSURL URLWithString:@"ilopapp://thirdParty/list"];
        [[IMSRouterService sharedService] registerURL:url withHandler:[self class]];
    }
    
    + (UIViewController *)controllerWithParams:(NSDictionary *)params {
        IMSThirdPartyListViewController *thirdVC = [[IMSThirdPartyListViewController alloc] init];
        thirdVC.hidesBottomBarWhenPushed = YES;
    
        thirdVC.imageArray = params[@"imageArray"];
        return thirdVC;
    }

修改登录的服务协议

云智能App的我的 > 关于页面中默认有三个法律协议,分别是:隐私权政策、服务协议、开源软件使用协议。其中隐私权政策和服务协议在登录App时会自动弹出,如下图所示。

服务协议

云智能2.X系列App模板的法律声明及隐私权政策软件服务协议默认为隐藏,即登录App时不会弹出上图服务协议的页面。如果您希望登录App后弹出该页面,请根据以下步骤配置服务协议,服务协议为URL格式。

  1. 进入工程的./IMSiLopAppFactory/ModuleName_Config.h文件。
  2. 修改url_app_use_service_agreement_def参数的值。
    • 参数值为空时,隐藏服务协议页面。
    • 参数值不为空时,账号登录App后,弹出服务协议页面。
    示例代码如下:
    #define url_app_use_service_agreement_def @"http://xxxxxx"
     //登录后弹出服务协议页面,页面的URL为https://xxxxxx
  3. (可选)当参数值不为空时,处理页面跳转事件。

    服务协议页面包含“软件服务协议”、“法律声明及隐私权政策”、“同意”、“不同意”四个事件。请根据以下示例修改事件的URL。

    • 软件服务协议

      URL中需包含agree-software,例如http://x.xxx.com/agree-software.html?visibility=undefined&navbarHide=true

    • 法律声明及隐私权政策

      URL中需包含legalNotice,例如http:/x.xxxx.xxx/legalNotice.html?visibility=undefined&navbarHide=true

    • 同意

      URL中需包含action=agree,例如http://xxx.xxx.com/privacy?action=agree

    • 不同意

      URL中需包含action=disagree,例如http://xxx.xxx.com/privacy?action=disagree