tcmpp_flutter 2.0.8 copy "tcmpp_flutter: ^2.0.8" to clipboard
tcmpp_flutter: ^2.0.8 copied to clipboard

TCMPP Flutter SDK.

TCMPP Flutter Plugin #

TCMPP Flutter Plugin is a Flutter plugin to provide access for TCMPP SDK in Flutter. For details of TCMPP, see: https://www.tencentcloud.com/products/tcmpp. This quick guide shows how to setup and use TCMPP Flutter Plugin.

Add TCMPP Flutter Plugin #

Add TCMPP core plugin from Pub.dev #

  1. Add dependecy

    To add plugin from pub.dev, open the pubspec.yaml file located inside the app folder, and add tcmpp_flutter: ${version} under dependencies. image-20240422150143401

  2. Install dependecy

  • From the terminal: Run flutter pub get.
  • From VS Code: Click Get Packages located in right side of the action ribbon at the top of pubspec.yaml indicated by the Download icon.
  • From Android Studio/IntelliJ: Click Pub get in the action ribbon at the top of pubspec.yaml.

For details how to add Flutter plugins or packages, see Use packages & plugins

Add assets for TCMPP configuration files #

Get TCMPP configuration file from your TCMPP web console #

  1. Get appcation ID / bundle ID of your Android / iOS application.
  • For Android, in your Flutter project, open android > app > build.gradle, application id can be found in android > defaultConfig section.

image-20240422153054592

  • For iOS, in your Flutter project, open iOS > Runner.xcodeproj > project.pbxproj, search for PRODUCT_BUNDLE_IDENTIFIER.

image-20240422154058326

  1. Create Flutter Application on TCMPP web console.

    1. Login the Tencent Cloud Mini Program Platform Console and click 'Overview' in the left-hand navigation bar.
    2. On the Overview page, click Access Application.
    3. In the pop-up window for creating an application, fill in informations for your application.
    4. For Intergration platform section, check both iOS platfrom & Android Platform. Then fill application ID / bundle ID you got in the package name field.

    7226c27b-45c6-4e22-8936-d4ed7678cae7

    1. Click next, download Android / iOS configuration file in the new page.

    3e06ebf3-0034-4302-834d-acf91e144bf4

Add configuration file #

  1. Put TCMPP configuration file someware in your flutter project.

  2. Add a file named "tcmpp-plugin-settings.json" in your project's root.

  3. Edit pubspec.yaml file and add flutter assets for files mentioned above.

  4. Specify the path to TCMPP configuration file in "tcmpp-plugin-settings.json".

SDK settings #

In the tcmpp-plugin-settings.json file, you can choose to configure settings of your SDK.

For Android:

field name type function
configAssetsName string TCMPP android configuration file path
debug bool enable SDK debug

For iOS:

field name type function
configAssetsName string TCMPP iOS configuration file path
debug bool enable SDK debug
logEnable bool enable SDK log

For common:

field name type function
appName string Host app name, mainly used for copyright prompts in mini-program
appVersion string Host app version, mainly used for copyright prompts in mini-program

Platform specific #

For Android platform #

  1. Open android > app directory, edit build.gradle file.

  2. In android > defaultConfig section, change minSdkVersion to no less than 21.

image-20240419181348211

minSdkVersion 21
  1. In android > defaultConfig section, add packagingOptions.

image-20240419181539243

packagingOptions {
   pickFirst 'lib/arm64-v8a/libc++_shared.so'
   pickFirst 'lib/armeabi/libc++_shared.so'
   pickFirst 'lib/armeabi-v7a/libc++_shared.so'
   pickFirst 'lib/arm64-v8a/libmarsxlog.so'
   pickFirst 'lib/armeabi/libmarsxlog.so'
   pickFirst 'lib/armeabi-v7a/libmarsxlog.so'
   pickFirst 'lib/arm64-v8a/libv8jni.so'
}

For iOS platform #

Add source

In the Podfile file in the iOS directory, add source:

source 'https://e.coding.net/tcmpp-work/tcmpp/tcmpp-repo.git'
source 'https://github.com/CocoaPods/Specs.git'

Execute pod install

cd to iOS directory,execute pod install:

pod install

TCMPP Flutter APIs #

Usage #

  1. To use TCMPP APIs, import 'package:tcmpp_flutter/tcmpp_flutter.dart'.

    image-20240419182106686

  2. Then create a TcmppFlutter object and use it to call TCMPP APIs.

    image-20240419182158294

APIs #

Future<void> startMiniAppWithId(String appId, MiniStartOptions? options)

Start a mini program with given appId

  • appId: The app id of mini program
  • options: Start options of this mini program

Future<void> startMiniAppWithLink(String link, MiniStartOptions? options)

Start a mini program with given link

  • link: The uri link to start
  • options: Start options of this mini program

Future<ScanResult?> scan()

Start a new page to scan for mini program QR code and start mini program

Future<List<AppInfo>?> getRecentList()

Get a list of recent opened mini programs

Future<List<AppInfo>?> searchMiniApp(String keyword,
   {int pageIndex = 0, int pageSize = 0})

Search for online mini programs with given keyword

  • keyWord: Keyword of mini program to search
  • pageIndex: Page to return if pageSize has a none-zero value, which means paging is enabled.
  • pageSize: The max size of a page returned by server. When set to 0, paging willl be disabled.

Future<void> stopMiniApp(String appId)

Stop mini program with given app ID

  • appId: The app id of mini program.

Future<void> stopAllMiniApp()

Stop all running mini programs

Future<void> deleteMiniAppCache(String appId,
   {int appVerType = 0, String? version})

Remove all local data of mini program with given ID

  • appId: the app id of mini program
  • appVerType: type of mini program
  • version: version of mini program to remove

Future<AppInfo?> currentMiniApp()

Return information for current foreground running mini program

Classes #

MiniStartOptions

class MiniStartOptions {
  /// entry path of mini program
  String? entryPath;

  /// is always update mini program when start
  bool? isForceUpdate;

  /// string param passed to mini program when start
  String? params;
}

ScanResult

class ScanResult {
  /// result string of qrcode or barcode contains
  String? result;

  /// the type of code
  String? scanType;

  /// charset of result string
  String? charset;
}

AppInfo

class AppInfo {
  /// MiniProgram id
  String appId;

  /// MiniProgram package type (release, dev, etc.). See [AppVerType]
  int appVerType;

  /// MiniProgram version
  String version;

  /// MiniProgram name
  String? name;

  /// MiniProgram icon url
  String? iconUrl;

  /// MiniProgram description
  String? appIntro;

  /// Developer of MiniProgram
  String? appDeveloper;

  /// MiniProgram release time
  int time;
}

AppVerType

/// Consts for MiniProgram package type. see[AppInfo]
class AppVerType {
  static const int online = 0;
  static const int develop = 1;
  static const int preview = 2;
  static const int experience = 3;
}

Documents #

For more information about usage and APIs of TCMPP Flutter plugin, see Accessing with Flutter