Flutter

Step 1: Integrate Flutter plugin

1.Config the pubspec.yaml file as follows

copy
rewards_flutter_widget:
    git:
      url: http://globaltech-git.alipay.com/aplus-mobile/rewards-widget-flutter-plugins.git
      ref: release/"LAST_VERSION"

2.Init

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

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {

  // Set multiple languages Initialize multiple languages
  Locale locale = const Locale('en', 'US');

  @override
  void initState() {
    super.initState();

    // init
    InitConfig initConfig = InitConfig(RewardsEnvironment.dev);
    RewardsPromoManager.init(initConfig);
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      initialRoute: '/',
      navigatorObservers: [RouteObserver()],
      localizationsDelegates: const [
        RewardsPromoManager.delegate,
        GlobalMaterialLocalizations.delegate,
        GlobalCupertinoLocalizations.delegate,
        GlobalWidgetsLocalizations.delegate
      ],
      supportedLocales: [...RewardsPromoManager.delegate.supportedLocales],
      // Set multiple languages
      locale: locale,
      home: HomePage(),
    );
  }
}

Multi-language description

The widget component supports the following languages,English is supported by default

  1. Korean (South Korea) ko / ko-KR

locale: const Locale('ko'), / locale: const Locale('ko', 'KR'),

  1. Thai (Thailand) th / th-TH

locale: const Locale('th'), / locale: const Locale('th', 'TH'),

  1. Bahasa Indonesia (Indonesia) id / id-ID

locale: const Locale('id'), / locale: const Locale('id', 'ID'),

  1. Chinese (Hong Kong, China) zh-HK

locale: const Locale('zh', 'HK'),

Step 2: Render widget in Flutter

copy
RewardsPromoWidget(
    positionId: widget.positionId,
    checkInStatusChange:(isSigned){//listen status change
      print("isSigned = " + isSigned.toString());
    }
)

Validate the integration

After you've finished the previous steps, notify Alipay+ team to configure the delivery content. When all the configuration work is done, you'll see the marketing content rendered in your app page.