市场平台
作者 NativeScript.org
nativescript-zendesk-sdk
by dicksmith | v0.2.0
Zendesk SDK for NativeScript
npm i --save nativescript-zendesk-sdk

nativescript-zendesk-sdk

npm npm

使用 TypeScript 实现基本 Zendesk SDK 的 NativeScript 插件。它受到 nativescript-zendesk 的启发

安装

tns plugin add nativescript-zendesk-sdk

用法

遵循 Zendesk Embeddables 文档

[必做] 在 Zendesk Support 中配置一个应用

支持 SDK for Android / iOS

[必做] 初始化 SDK

支持 SDK for Android / iOS

export interface InitConfig {
    applicationId: string;
    zendeskUrl: string;
    clientId: string;
    userLocale?: string;
    coppaEnabled?: boolean;
    /** AnonUserIdentity object or JWT Token string */
    identity?: AnonUserIdentity | string;
}
import { ZendeskSdk } from "nativescript-zendesk-sdk";
...
const initConfig = {
    ...
}
ZendeskSdk.initialize(initConfig);

如果 identity: null，将创建一个新的匿名身份，但如果 identity 是未定义的，它必须在启动任何 Zendesk 视图/活动之前设置。

注意：初始化 Zendesk 时必须指定 applicationId、zendeskUrl 和 clientId，但区域设置、COPPA 合规模式和身份可以在以后设置/更改。

[必做] 设置身份（身份验证）

支持 SDK for Android / iOS

使用匿名身份进行身份验证
ZendeskSdk.setAnonymousIdentity();
使用匿名身份进行身份验证（带详细信息）
ZendeskSdk.setAnonymousIdentity({name: "name", email: "email"});
使用您的 JWT 端点进行身份验证
ZendeskSdk.setJwtIdentity("jwtUserIdentifier");

区域设置设置

支持 SDK for Android / iOS

SDK 用于静态字符串的区域设置将与 Android 应用配置或 iOS NSUserDefaults 匹配。（如上链接中所述，可以覆盖或添加缺失的语言）。

设置从 Zendesk 获取的任何动态内容的区域设置

ZendeskSdk.setUserLocale(localeCode);

配置请求

支持 SDK for Android / iOS

在打开帮助中心或创建请求之前，可以指定请求设置

显示帮助中心

支持 SDK for Android / iOS

默认用法

ZendeskSdk.showHelpCenter();

可选参数

export interface HelpCenterOptions {
    /** Default: false */
    categoriesCollapsedAndroid?: boolean;
    /** Default: true */
    conversationsMenuAndroid?: boolean;
    /** Default: true */
    conversationsMenuIos?: boolean;
    /** Default: false */
    showAsModalForIos?: boolean;
}
ZendeskSdk.showHelpCenter(options);

注意：Android 和 iOS 的 SDK 在本节中差异很大，因此某些选项仅适用于 iOS 或 Android。默认选择的是在两者之间提供最大一致性的选项

两者
showConversationMenuButtonFor(Android/Ios) [默认值 = true]

在导航栏中启用一个按钮，允许用户查看他们活动的请求/会话或开始一个新的请求。

仅 Android
showContactUsButtonForAndroid [默认值 = false]

这将在屏幕右下角显示一个额外的 (+) 按钮，类似于 Android 模板中的按钮。

在 Android SDK 中默认启用，但在此插件中默认禁用，以保持与 iOS 的一致性。

withCategoriesCollapsedForAndroid [默认值 = false]

这会将类别折叠到它们的标题中。Android 和 iOS 上的默认行为是显示每个类别的第一个 5 个，然后有选项进一步展开，如果还有更多的话。

仅限iOS
showAsModalForIos [默认 = false]

此功能将帮助中心显示为模态操作表。

筛选帮助中心

支持Android的SDK Android / iOS

根据原始SDK，一次只能使用一个筛选器。

按类别筛选

ZendeskSdk.showHelpCenterForCategoryIds(categoryIds, options);

按部分筛选

ZendeskSdk.showHelpCenterForLabelNames(labelNames, options);

按文章标签筛选

ZendeskSdk.showHelpCenterForSectionIds(sectionIds, options);

创建请求

ZendeskSdk.createRequest();

样式

支持Android的SDK Android / iOS

Android

通过 app/App_Resources/Android/AndroidManifest.xml 配置，详情请见此处。

简单样式

Zendesk提供了3种基本主题，可以使用或扩展

  • ZendeskSdkTheme.Light
  • ZendeskSdkTheme.Dark
  • ZendeskSdkTheme.Light
例如扩展PnpZendeskSdkTheme.DarkActionBar

app/App_Resources/Android/AndroidManifest.xml

    
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    ...>
    <application
        ...>
        <activity android:name="com.zendesk.sdk.support.SupportActivity"
                  android:theme="@style/MyZendeskSdkTheme.DarkActionBar"/>

        <activity android:name="com.zendesk.sdk.feedback.ui.ContactZendeskActivity"
                  android:theme="@style/MyZendeskSdkTheme.DarkActionBar"/>

        <activity android:name="com.zendesk.sdk.support.ViewArticleActivity"
                  android:theme="@style/MyZendeskSdkTheme.DarkActionBar"/>

        <activity android:name="com.zendesk.sdk.requests.RequestActivity"
                  android:theme="@style/MyZendeskSdkTheme.DarkActionBar"/>

        <activity android:name="com.zendesk.sdk.requests.ViewRequestActivity"
                  android:theme="@style/MyZendeskSdkTheme.DarkActionBar"/>
    </application>
</manifest>

app/App_Resources/Android/values/styles.xml

<?xml version="1.0" encoding="utf-8"?>
<resources xmlns:android="http://schemas.android.com/apk/res/android">
...
    <style name="PnpZendeskSdkTheme.DarkActionBar" parent="ZendeskSdkTheme.Light.DarkActionBar">
        <item name="colorPrimary">@color/ns_primary</item>
        <item name="colorPrimaryDark">@color/ns_primaryDark</item>
        <item name="colorAccent">@color/ns_accent</item>
        <item name="android:actionMenuTextColor">@color/ns_blue</item>
    </style>
</resources>
<style name="YourLightTheme" parent="ZendeskSdkTheme.Light">
...
</style>
<style name="YourDarkTheme" parent="ZendeskSdkTheme.Dark">
...
</style>
<style name="YourLightTheme.DarkActionBar" parent="ZendeskSdkTheme.Light.DarkActionBar">
...
</style>

iOS

import { isIOS } from 'tns-core-modules/platform';

...

if ( isIOS ) {
    UINavigationBar.appearance().tintColor = new Color('#00FFFF').ios;
    UINavigationBar.appearance().barTintColor = new Color('#FF00FF').ios;
    UINavigationBar.appearance().titleTextAttributes =
        <NSDictionary<string, any>>NSDictionary.dictionaryWithObjectForKey(
            new Color('#FFFF00').ios,
            NSForegroundColorAttributeName);
}

const iOSTheme: ZendeskIosThemeSimple = {
    primaryTextColor:          '#FF0000',
    secondaryTextColor:        '#00FF00',
    primaryBackgroundColor:    '#0000FF',
    secondaryBackgroundColor:  '#00FFFF',
    emptyBackgroundColor:      '#FF00FF',
    metaTextColor:             '#FFFF00',
    separatorColor:            '#884444',
    inputFieldTextColor:       '#448844',
    inputFieldBackgroundColor: '#444488',
    fontName:                  'Courier',
    boldFontName:              'Cochin-BoldItalic',
};
ZendeskSdk.setIosTheme(iOSTheme);

前3种颜色主要用于“新工单”屏幕的ActionBar/StatusBar，因为帮助中心使用的是常规NativeScript设置的默认ActionBar/StatusBar颜色。

这些设置可能会影响整个应用程序，但常规NativeScript视图会忽略它们，但可能会影响其他第三方视图。您可能需要将它们设置与应用程序其余部分使用的相同。

主题对象内的设置只会影响Zendesk。

贡献

项目已包含Typings和iOS元数据，以便更容易使用。
Typings使用以下方式自动生成
https://github.com/NativeScript/android-dts-generator
https://docs.nativescript.cn/runtimes/ios/how-to/Use-Native-Libraries
尽管需要对类型进行一些手动更改，例如注释掉类型并将它们设置为any，因为NativeScript负责处理诸如NSArray和java.util.List之类的转换。
当前Typings/metadata是使用版本[email protected]和``[email protected]`的Zendesk和Zendesk Provider SDKs生成的。

正在转储Typings...

iOS

从 src/

pod repo update
TNS_TYPESCRIPT_DECLARATIONS_PATH="$(pwd)/typings" npm run demo.ios
cp typings/x86_64/objc\!Zendesk* typings/
Android

从项目根目录

cd android
./gradlew clean
./gradlew getDeps

cd lib
jar xf sdk-1.11.0.1.aar
mv classes.jar used-zendesk-sdk.jar
jar xf sdk-providers-1.11.0.1.aar
mv classes.jar used-zendesk-providers-sdk.jar

rm -rf */
find . -type f ! -iname "used-zendesk-*" -delete
cd ../..

rm -rf out/
java -jar ../android-dts-generator/dts-generator/build/libs/dts-generator.jar -input \
    android/lib/used-zendesk-sdk.jar \
    && mv out/android.d.ts src/typings/java\!ZendeskSDK.d.ts;
java -jar ../android-dts-generator/dts-generator/build/libs/dts-generator.jar -input \
    android/lib/used-zendesk-providers-sdk.jar \
    && mv out/android.d.ts src/typings/java\!ZendeskProviderSDK.d.ts;