Flutter应用内消息插件karte_in_app_messaging的使用

Flutter应用内消息插件karte_in_app_messaging的使用

License

KARTE In-app Messaging for Flutter

一个用于Android和iOS的Flutter插件，以使用KARTE In-app Messaging API。 KARTE In-app Messaging包提供了一个简单的API用于应用内消息。

文档

开发指南位于：

许可证

Flutter KARTE In-app Messaging包在Apache 2.0许可证下发布。

您的使用受《KARTE 使用条款》约束。

示例代码

import 'dart:async';

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:karte_core/karte_core.dart';
import 'package:karte_in_app_messaging/karte_in_app_messaging.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  [@override](/user/override)
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  bool _isPresenting = false;

  [@override](/user/override)
  void initState() {
    super.initState();
    initPlatformState();
  }

  // 平台消息是异步的，因此我们在异步方法中初始化。
  Future<void> initPlatformState() async {
    bool isPresenting;
    // 平台消息可能会失败，因此我们使用try/catch来捕获PlatformException。
    try {
      isPresenting = await InAppMessaging.isPresenting;
    } on PlatformException {
      isPresenting = false;
    }

    // 如果小部件在异步平台消息传输期间从树中移除，则我们希望丢弃回复而不是调用setState来更新我们的非存在的外观。
    if (!mounted) return;

    setState(() {
      _isPresenting = isPresenting;
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('KARTE InAppMessaging 示例应用'),
        ),
        body: Center(
          child: Column(
            children: [
              Text('isPresenting:  $_isPresenting'),
              ElevatedButton(
                onPressed: () => initPlatformState(),
                child: Text("检查展示状态"),
              ),
              ElevatedButton(
                onPressed: () => InAppMessaging.dismiss(),
                child: Text("关闭当前消息"),
              ),
              ElevatedButton(
                onPressed: () => InAppMessaging.suppress(),
                child: Text("抑制消息展示"),
              ),
              ElevatedButton(
                onPressed: () => InAppMessaging.unsuppress(),
                child: Text("取消抑制"),
              ),
              ElevatedButton(
                onPressed: () => Tracker.view("popup"),
                child: Text("记录视图"),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

更多关于Flutter应用内消息插件karte_in_app_messaging的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter应用内消息插件karte_in_app_messaging的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然，以下是一个关于如何在Flutter应用中使用karte_in_app_messaging插件的示例代码。这个插件用于在应用内显示消息，提升用户体验。

首先，确保你已经在pubspec.yaml文件中添加了karte_in_app_messaging依赖：

dependencies:
  flutter:
    sdk: flutter
  karte_in_app_messaging: ^最新版本号

然后，运行flutter pub get来获取依赖。

接下来，在你的Flutter应用中初始化karte_in_app_messaging插件，并显示消息。以下是一个完整的示例：

main.dart

import 'package:flutter/material.dart';
import 'package:karte_in_app_messaging/karte_in_app_messaging.dart';

void main() {
  // 初始化 Karte In-App Messaging 插件
  KarteInAppMessaging.initialize(
    apiKey: '你的API_KEY', // 替换为你的Karte API Key
    userId: '用户ID', // 替换为你的用户ID
  );

  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  void initState() {
    super.initState();

    // 监听插件状态变化，例如消息显示、隐藏等事件
    KarteInAppMessaging.addListener((event) {
      if (event is KarteInAppMessagingEventDisplay) {
        print('Message displayed: ${event.message}');
      } else if (event is KarteInAppMessagingEventDismiss) {
        print('Message dismissed');
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter Karte In-App Messaging Demo'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'Check for in-app messages!',
            ),
            SizedBox(height: 20),
            ElevatedButton(
              onPressed: () async {
                // 手动触发检查是否有新的消息
                await KarteInAppMessaging.checkForMessages();
              },
              child: Text('Check for Messages'),
            ),
          ],
        ),
      ),
    );
  }
}

说明

  1. 初始化插件：在main函数中，调用KarteInAppMessaging.initialize方法初始化插件，传入你的API Key和用户ID。

  2. 监听事件：在MyHomePage的initState方法中，添加一个监听器来监听插件的状态变化事件，例如消息显示和隐藏事件。

  3. 手动触发检查：在UI中添加一个按钮，当用户点击按钮时，调用KarteInAppMessaging.checkForMessages方法手动触发检查是否有新的消息。

确保你已经按照Karte的文档要求配置了必要的后台服务，并且你的API Key和用户ID是有效的。

这个示例展示了如何在Flutter应用中集成和使用karte_in_app_messaging插件。你可以根据需要进一步自定义和扩展这个示例。

回到顶部