ZOLOZZOLOZDOCS

为原生App SDK模式产品自定义UI

不同的移动应用有不同的设计风格，例如标题栏风格、按钮风格等。为了更好地适应您的应用程序的风格，ZOLOZ支持对指定组件的颜色和文案进行简单的UI自定义配置。本文介绍在原生App SDK模式下如何自定义ZOLOZ产品的UI。

步骤一：配置UI并导出配置文件

  1. 登录ZOLOZ门户。
    不同的站点和环境对应的ZOLOZ门户地址不同，请根据您的实际站点和环境选择登录地址。详细信息，请参见选择站点和环境。
  2. 在左侧导航栏，单击UI Configuration。
  3. 根据UI Configuration页面的配置选项，配置自定义内容。
  4. 配置完成后单击Export，将配置文件导出到本地。

步骤二：使用配置文件启动SDK

将步骤一生成的配置文件与ZOLOZ SDK集成，支持Android和iOS操作系统。下面介绍如何使用Android或iOS操作系统的配置文件启动SDK。

说明：如果您不是客户端开发人员，请将配置文件发送给您的客户端开发人员进行配置。

1.在项目中添加配置文件

您需要将配置文件添加到App运行时可以访问的项目目录中。

  • 如果是Android App，可以将配置文件添加到assets目录中。
  • 如果是iOS App，可以将配置文件添加到MainBundle目录中。

您也可以将配置文件存储到CDN服务器中，并在启动ZOLOZ SDK之前下载该配置文件。

2.设置配置文件的路径

在使用配置文件启动ZOLOZ SDK之前，您需要在ZLZRequest对象中指定配置文件的路径。

  • 如果是Android应用，请为CHAMELEON_CONFIG_PATH参数指定配置文件路径。
  • 如果是iOS应用，请为kZLZChameleonConfigKey参数指定配置文件路径。

下面两个示例分别展示了将名为UIConfig.zip的配置文件添加到Android和iOS应用的ZLZRequest对象中。

示例1：Android应用

copy
ZLZRequest request = new ZLZRequest();
request.bizConfig = new HashMap<>();
// Omit other configurations
// add configuration file path to bizConfig.
request.bizConfig.put(ZLZConstants.CHAMELEON_CONFIG_PATH, "UIConfig.zip");
return request;

示例2：iOS应用

copy
NSMutableDictionary *bizConfig = [NSMutableDictionary dictionary];
// Omit other configurations
// add configuration file path to bizConfig.
NSString* path = [[NSBundle mainBundle] pathForResource:@"UIConfig" ofType:@"zip"];
[bizConfig setObject:path forKey:kZLZChameleonConfigKey]
ZLZRequest *request = [[ZLZRequest alloc] initWithzlzConfig:clientConfig bizConfig:bizConfig];

关于构造ZLZRequest对象的更多信息，请参见原生App SDK模式。

3.配置多语言（可选）

ZOLOZ门户的UI配置页面支持配置多语言，为了使ZOLOZ SDK在启动时使用其中一种语言，您需要在ZLZRequest对象中为相关参数指定语言信息。ZOLOZ SDK将以指定的语言读取配置文件，并将其呈现在您的应用中。
例如，您在UI配置页面添加的语言为Chinese(Simplified)(zh-CN)，并希望SDK在您的Android或iOS应用中使用该语言，则需要指定LOCALE和kZLZLocaleKey参数的值。

  • 如果是Android应用，指定LOCALE参数的值为“zh-CN”，如示例3所示。
  • 如果是iOS应用，指定kZLZLocaleKey参数的值为“zh-CN”，如示例4所示。

LOCALE和kZLZLocaleKey参数的取值必须为language-Country格式。UI配置页面中提供的各个语言选项的取值，请参见语言相关的参数值格式。

说明：

  • 如果不配置LOCALE和kZLZLocaleKey参数，ZOLOZ SDK默认使用系统语言来匹配UI配置页面中配置的语言。
  • 如果为LOCALE和kZLZLocaleKey参数指定的语言以及系统语言都与UI配置页面中配置的语言不匹配，则ZOLOZ SDK直接使用其内置语言。

示例3：Android应用

copy
ZLZRequest request = new ZLZRequest();
request.bizConfig = new HashMap<>();
// Omit other configurations
// add LOCALE to bizConfig.
request.bizConfig.put(ZLZConstants.LOCALE, "zh-CN");
return request;

示例4：iOS应用

copy
NSMutableDictionary *bizConfig = [NSMutableDictionary dictionary];
// Omit other configurations
// add LOCALE to bizConfig.
[bizConfig setObject:@"zh-CN" forKey:kZLZLocaleKey]
ZLZRequest *request = [[ZLZRequest alloc] initWithzlzConfig:clientConfig bizConfig:bizConfig];