Flutter应用内购买插件flutter_in_app_purchase_helper的使用

发布于 1周前 作者 itying888 来自 Flutter

Flutter应用内购买插件flutter_in_app_purchase_helper的使用

概览

Flutter In-App Purchase Helper 提供了一个简洁的解决方案，用于将应用内购买功能集成到 Flutter 应用程序中。本文档概述了如何设置和有效使用该辅助工具。

特性
  • 使用动态产品 ID 初始化应用内购买。
  • 从应用商店获取可用的产品。
  • 处理购买流程并验证交易。
  • 易于使用的界面，可以方便地将应用内购买集成到任何 Flutter 小部件中。

如何使用

初始化 (initState)

初始化 FlutterInAppPurchaseHelper 并设置上下文，配置产品 ID 和成功及错误处理回调。

[@override](/user/override)
void initState() {
  super.initState();
  /// 初始化 (initState): 初始化 FlutterInAppPurchaseHelper 并设置产品 ID 和回调
  _flutterInAppPurchaseHelper = FlutterInAppPurchaseHelper();
  _flutterInAppPurchaseHelper.initialize(
    /// 在此处填写在 Play Console 或 App Store 中配置的产品 ID
    productIds: {'PRODUCT_ID_1', 'PRODUCT_ID_2'},
    onProductsFetched: (products) {
      setState(() {
        _products = products;
      });
    },
    /// 成功处理
    onPurchaseSuccess: (purchase) {
      ScaffoldMessenger.of(context).showSnackBar(
        const SnackBar(content: Text('Success')),
      );
    },
    /// 错误处理
    onPurchaseError: (error) {
      ScaffoldMessenger.of(context).showSnackBar(
        SnackBar(content: Text('Error: $error')),
      );
    },
  );
}

Initialization Example Initialization Example

计划选择 (_togglePlanSelection)

处理计划的选择和取消选择。

/// 切换计划
/// 处理计划的选择和取消选择
void _togglePlanSelection(String planTitle) {
  setState(() {
    if (_selectedPlan == planTitle) {
      _selectedPlan = null;
    } else {
      _selectedPlan = planTitle;
    }
  });
}

Plan Selection Example

获取和显示产品 (fetchAndShowProducts)

从商店检索产品信息，并在 UI 中显示它们，确保准确的价格和详细信息。

/// 获取和显示产品
/// 使用 FlutterInAppPurchaseHelper 从商店检索产品信息并在 UI 中显示
for (var prod in _products)
  PlanCard(
    title: prod.title,
    description: prod.description,
    isActive: _selectedPlan == prod.title,
    isRecommended: true,
    icon: Icons.workspaces_filled,
    onTap: () {
      setState(() {
        productDetails = prod;
      });
      _togglePlanSelection(prod.title);
    },
  )

Fetching Products Example

购买按钮

当用户选择一个计划时，通过 _flutterInAppPurchaseHelper.buyProduct 函数触发购买，并根据购买情况处理错误。

/// 购买按钮
/// 当用户选择一个计划时，通过 _flutterInAppPurchaseHelper.buyProduct 触发购买
bottomNavigationBar: Padding(
  padding: const EdgeInsets.all(16),
  child: ElevatedButton(
    onPressed: () {
      if (_selectedPlan == null) {
        ScaffoldMessenger.of(context).showSnackBar(
          const SnackBar(content: Text('Please select a plan.')),
        );
      } else {
        _flutterInAppPurchaseHelper.buyProduct(
          productDetails,
          (error) {
            ScaffoldMessenger.of(context).showSnackBar(
              SnackBar(content: Text('Error: $error')),
            );
          },
        );
      }
    },
    child: const Text('Select Plan'),
  ),
)

Purchase Button Example

完整示例代码

import 'package:flutter/material.dart';
import 'package:flutter_in_app_purchase_helper/flutter_in_app_purchase_helper.dart';
import 'package:in_app_purchase/in_app_purchase.dart';

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

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

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const PaymentScreen(),
    );
  }
}

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

  [@override](/user/override)
  _PaymentScreenState createState() => _PaymentScreenState();
}

class _PaymentScreenState extends State<PaymentScreen> {
  late FlutterInAppPurchaseHelper _flutterInAppPurchaseHelper;
  String? _selectedPlan;
  late ProductDetails productDetails;
  List<ProductDetails> _products = [];

  [@override](/user/override)
  void initState() {
    super.initState();
    /// 初始化 (initState): 初始化 FlutterInAppPurchaseHelper 并设置产品 ID 和回调
    _flutterInAppPurchaseHelper = FlutterInAppPurchaseHelper();
    _flutterInAppPurchaseHelper.initialize(
      /// 在此处填写在 Play Console 或 App Store 中配置的产品 ID
      productIds: {'PRODUCT_ID_1', 'PRODUCT_ID_2'},
      onProductsFetched: (products) {
        setState(() {
          _products = products;
        });
      },
      /// 成功处理
      onPurchaseSuccess: (purchase) {
        ScaffoldMessenger.of(context).showSnackBar(
          const SnackBar(content: Text('Success')),
        );
      },
      /// 错误处理
      onPurchaseError: (error) {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(content: Text('Error: $error')),
        );
      },
    );
  }

  [@override](/user/override)
  void dispose() {
    /// 释放服务
    _flutterInAppPurchaseHelper.dispose();
    super.dispose();
  }

  /// 切换计划
  /// 处理计划的选择和取消选择
  void _togglePlanSelection(String planTitle) {
    setState(() {
      if (_selectedPlan == planTitle) {
        _selectedPlan = null;
      } else {
        _selectedPlan = planTitle;
      }
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: SingleChildScrollView(
        child: Padding(
          padding: const EdgeInsets.all(16),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              const SizedBox(height: 20),
              // 替换为你的实际图像小部件
              const Text(
                '请选择适合您的 BetterMeal AI 计划：月度或年度，并解锁个性化营养见解以改善健康。',
                textAlign: TextAlign.center,
                style: TextStyle(fontSize: 16, color: Colors.grey),
              ),
              const SizedBox(height: 40),
              Container(
                color: Colors.white,
                margin: const EdgeInsets.all(2),
                child: Column(
                  children: [
                    /// 获取和显示产品
                    /// 使用 FlutterInAppPurchaseHelper 从商店检索产品信息并在 UI 中显示
                    for (var prod in _products)
                      PlanCard(
                        title: prod.title,
                        description: prod.description,
                        isActive: _selectedPlan == prod.title,
                        isRecommended: true,
                        icon: Icons.workspaces_filled,
                        onTap: () {
                          setState(() {
                            productDetails = prod;
                          });
                          _togglePlanSelection(prod.title);
                        },
                      )
                  ],
                ),
              ),
              const SizedBox(height: 16),
            ],
          ),
        ),
      ),
      /// 购买按钮
      /// 当用户选择一个计划时，通过 _flutterInAppPurchaseHelper.buyProduct 触发购买
      bottomNavigationBar: Padding(
        padding: const EdgeInsets.all(16),
        child: ElevatedButton(
          onPressed: () {
            if (_selectedPlan == null) {
              ScaffoldMessenger.of(context).showSnackBar(
                const SnackBar(content: Text('Please select a plan.')),
              );
            } else {
              _flutterInAppPurchaseHelper.buyProduct(
                productDetails,
                (error) {
                  ScaffoldMessenger.of(context).showSnackBar(
                    SnackBar(content: Text('Error: $error')),
                  );
                },
              );
            }
          },
          child: const Text('Select Plan'),
        ),
      ),
    );
  }
}

class PlanCard extends StatelessWidget {
  const PlanCard({
    super.key,
    required this.title,
    required this.description,
    required this.isActive,
    required this.isRecommended,
    required this.icon,
    required this.onTap,
  });

  final String title;
  final String description;
  final bool isActive;
  final bool isRecommended;
  final IconData icon;
  final VoidCallback onTap;

  [@override](/user/override)
  Widget build(BuildContext context) {
    return InkWell(
      onTap: onTap,
      child: Stack(
        children: [
          Card(
            elevation: isActive ? 10 : 8,
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(16),
              side: BorderSide(
                color: isActive ? Colors.green : Colors.transparent,
                width: 2,
              ),
            ),
            child: ListTile(
              shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.circular(16),
              ),
              title: Row(
                children: [
                  Icon(
                    icon,
                    color: Colors.amber,
                  ),
                  const SizedBox(width: 10),
                  Expanded(
                    child: Text(
                      title,
                      overflow: TextOverflow.ellipsis,
                    ),
                  ),
                ],
              ),
            ),
          ),
          if (isActive) Container(),
          if (isRecommended) Container(),
        ],
      ),
    );
  }
}

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

Harmonyos Next教程
1 回复

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


当然，下面是一个关于如何使用 flutter_in_app_purchase_helper 插件在 Flutter 应用中实现应用内购买的代码案例。这个插件简化了 Google Play 和 Apple App Store 的应用内购买流程。

首先，确保在 pubspec.yaml 文件中添加依赖：

dependencies:
  flutter:
    sdk: flutter
  flutter_in_app_purchase_helper: ^x.y.z  # 请替换为最新版本号

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

接下来，在你的 Flutter 应用中实现应用内购买。以下是一个基本示例，展示了如何初始化购买服务、获取产品列表、购买产品以及处理购买结果。

1. 初始化购买服务

在你的主应用文件中（例如 main.dart），初始化 IAPHelper：

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

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

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  late IAPHelper _iapHelper;

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

  void _initIAP() async {
    _iapHelper = IAPHelper();
    await _iapHelper.init();

    // 获取产品列表
    List<String> productIds = ['product_id_1', 'product_id_2'];  // 替换为你的产品ID
    await _iapHelper.fetchProducts(productIds);

    // 监听购买更新
    _iapHelper.purchaseUpdatedStream.listen((purchaseUpdatedEvent) {
      // 处理购买更新事件
      _handlePurchaseUpdated(purchaseUpdatedEvent);
    });
  }

  void _handlePurchaseUpdated(PurchaseUpdatedEvent event) {
    if (event.purchaseDetails.status == PurchaseStatus.purchased) {
      // 购买成功
      print('Purchase successful: ${event.purchaseDetails.productID}');
    } else if (event.purchaseDetails.status == PurchaseStatus.error) {
      // 购买失败
      print('Purchase failed: ${event.purchaseDetails.error!.message}');
    }
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('In-App Purchase Example'),
        ),
        body: Center(
          child: ElevatedButton(
            onPressed: () {
              _buyProduct('product_id_1');  // 替换为你想购买的产品ID
            },
            child: Text('Buy Product'),
          ),
        ),
      ),
    );
  }

  void _buyProduct(String productId) async {
    try {
      Product? product = _iapHelper.products.firstWhere((p) => p.id == productId);
      if (product != null) {
        PurchaseParam purchaseParam = PurchaseParam(
          productDetails: product,
          applicationUserName: null,
          sandboxTesting: true,  // 仅用于测试，发布时设置为 false
        );

        await _iapHelper.buyProduct(purchaseParam);
      } else {
        print('Product not found: $productId');
      }
    } catch (e) {
      print('Error buying product: $e');
    }
  }
}

2. 配置应用内购买产品

在 Google Play 和 Apple App Store 中配置你的应用内购买产品，确保产品 ID 与代码中的 product_id_1 和 product_id_2 匹配。

3. 处理购买结果

在 _handlePurchaseUpdated 方法中处理购买结果。例如，当用户成功购买产品时，你可以解锁应用中的某些功能或发送服务器验证购买。

4. 测试购买流程

在测试阶段，确保在 Android 上使用测试账户，在 iOS 上启用沙盒测试。

注意事项

  • 应用内购买验证：在实际应用中，购买成功后通常需要验证购买收据，以防止欺诈。这通常涉及将购买收据发送到你的服务器，并由服务器与 Apple 或 Google 的服务器进行验证。
  • 用户隐私：处理用户购买信息时，请遵守相关的隐私政策和法规。

这个示例展示了如何使用 flutter_in_app_purchase_helper 插件在 Flutter 应用中实现基本的应用内购买功能。根据你的应用需求，你可能需要扩展和自定义这个基础代码。

回到顶部