Flutter云服务集成插件xinhuamm_xycloud的使用

Flutter云服务集成插件xinhuamm_xycloud的使用

新移云SDK插件

发布新版本流程

  1. 确保Android、iOS代码正常可跑通。
  2. 修改pubspec.yaml文件中的版本号。
  3. 运行检测命令：flutter packages pub publish --dry-run
  4. 运行发布命令：flutter packages pub publish
  5. flutter packages pub publish --server=https://pub.flutter-io.cn
  6. flutter packages pub publish --server=https://pub.dartlang.org
  7. 前往demo项目运行内部调试：demo

对接流程请查看对接文档

示例代码

import 'dart:ffi';

import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'dart:async';
import 'package:flutter/services.dart';
import 'package:xinhuamm_xycloud/xinhuamm_xycloud.dart';
import 'package:visibility_detector/visibility_detector.dart';

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

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

  [@override](/user/override)
  State<MyApp> createState() => _MyAppState();
}

final _xinhuammXycloudPlugin = XinhuammXycloud();

class _MyAppState extends State<MyApp> with SingleTickerProviderStateMixin {
  late TabController _tabController;

  [@override](/user/override)
  void initState() {
    super.initState();
    _tabController = TabController(length: 3, vsync: this);
    setCloudGlobalConfig();
    setCloudMethodCallHandler();
  }

  [@override](/user/override)
  void dispose() {
    print("生命周期：dispose");
    _tabController.dispose();
    super.dispose();
  }

  [@override](/user/override)
  void deactivate() {
    print("生命周期：deactivate");
    super.deactivate();
  }

  [@override](/user/override)
  void activate() {
    print("生命周期：activate");
    super.activate();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('新移云SDK Flutter原生插件'),
          actions: [
            IconButton(
              icon: const Icon(Icons.qr_code_scanner), // 图片按钮的图标
              onPressed: () {
                openScanPage();
              },
            ),
          ],
        ),
        body: WillPopScope(
          onWillPop: () async {
            bool handled = await _xinhuammXycloudPlugin.onBackPressed();
            return !handled;
          },
          child: Center(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              children: [
                Container(
                  margin: const EdgeInsets.all(6.0),
                  child: ElevatedButton(
                    onPressed: () {
                      // 按钮被点击时的操作
                      openCloudPage();
                    },
                    style: ElevatedButton.styleFrom(
                      backgroundColor: Colors.blue, // 按钮的背景颜色
                      textStyle: TextStyle(color: Colors.white), // 文本颜色
                      padding: EdgeInsets.fromLTRB(16.0, 10, 16, 10), // 内边距
                      shape: RoundedRectangleBorder(
                        borderRadius: BorderRadius.circular(8.0), // 圆角
                      ),
                    ),
                    child: Text(
                      '打开新移云页面', // 按钮文本
                      style: TextStyle(
                        fontSize: 18.0, // 字体大小
                      ),
                    ),
                  ),
                ),
                const Text('内嵌新移云页面，下面实现tabbar，用于处理生命周期同步问题'),

                Expanded(
                    child: Column(
                  children: [
                    // 自定义Tab布局
                    Container(
                      color: Colors.blue,
                      child: TabBar(
                        controller: _tabController,
                        tabs: [
                          Tab(text: 'Tab 1'),
                          Tab(text: 'Tab 2'),
                          Tab(text: 'Tab 3'),
                        ],
                      ),
                    ),
                    // Tab对应的内容
                    Expanded(
                      child: TabBarView(
                        controller: _tabController,
                        children: [
                          // Center(child: Text('内容 1')),
                          // getXYCloudFlutterWebView(),
                          MyTabContent(key: UniqueKey()),
                          Center(child: Text('内容 2')),
                          Center(child: Text('内容 3')),
                        ],
                      ),
                    ),
                  ],
                ))
              ],
            ),
          ),
        ),
      ),
    );
  }

  void handleScanResult(String scanResult) async {
    bool handled = await _xinhuammXycloudPlugin.handleScanResult(scanResult);
    if (handled) {
      print("sdk内部已处理，外部无需处理");
    } else {
      print("sdk内部未处理，外部需处理");
    }
  }

  void openScanPage() async {
    String scanResult = await _xinhuammXycloudPlugin.openScanPage();
    print("扫码结果：$scanResult");
  }

  void openCloudPage() {
    _xinhuammXycloudPlugin.openCloudPage(
        // 'https://liveh5-xhyd.cn3x.com.cn/statics/xhmm-live-h5/index.html#/?liveId=8&amp;siteId=8fb4b96c99b743119ffc8748539de765'
        // "http://10.0.20.14:5762/?showStatusBar=2"
        // "https://yc.market.xinhuamm.net/statics/cloud-application-o2o-user-h5/pages/meal-card/home?showStatusBar=2&amp;isHideBack=1"
        // "https://xuancheng.market.xinhuamm.net/statics/cloud-application-o2o-user-h5/?isSpecialMall=1&amp;hideTopView=1&amp;nory=1"
        "https://activity.platform.xinhuaapp.com/statics/out-sdk-test/#/?lesscode=a4207fac62ef4540853b62b50dc721a2"
        // "https://yc.market.xinhuamm.net/statics/cloud-application-o2o-user-h5?nory=1"
        );
  }

  void setCloudGlobalConfig() {
    _xinhuammXycloudPlugin.setCloudGlobalConfig({
      "appId": "ec445803d2e14f82a20ecf38259a58da", // 宜昌正式配置，调试用
      "appKey": "4128955854b4421f943915aa1e730b4d",
      "appSecret": "a6a34bf1ce4b4d0ca84723aebd93e39c",
      "weixinSchemeUrl": "微信支付协议",
      "appUrlScheme": "支付宝支付协议",
      "userAgent": "xinhuamm",
      "themeColor": "#f38242",
      "showNavigationBar": false,
      "isDebug": true
    });
  }

  void setCloudMethodCallHandler() {
    _xinhuammXycloudPlugin.setCloudMethodCallHandler((call) {
      print("客户端调用Flutter端方法:${call.method}&gt;&gt;&gt;参数：${call.arguments}");
      if ("login" == call.method) {
        print("打开登录页");
        Completer<dynamic> completer = Completer<dynamic>();
        // 打开登录页面，注释代码也请仔细查看

        // openLoginPage((String userId) {
        //   // 回调函数，处理登录成功后的逻辑
        //   print("用户登录成功，userId: $userId");
        //   completer.complete({
        //     "userId": "userId",
        //     "userPhone": "userPhone"
        //   });
        //   // 登录取消或登录失败后的逻辑也请回调执行completer，传空即可
        // });

        // 等待Completer完成，将其Future返回
        return completer.future;
      } else if ("getUserInfo" == call.method) {
        // 获取用户标识，判断用户是否登录或切换用户
        /* {
          "userId":"用户标识",
        } */
        print("获取用户标识");
        return Future.value({"userId": 123456, "userPhone": "18511650453"});
        // return Future.value({"userId": "cmj", "userPhone": "17858939680"});
      } else if ("getToken" == call.method) {
        // 获取免登接口请求参数。返回：json字符串
        /* {
          "token":"用户token",
        } */
        print("获取免登信息");
        return Future.value({
          "token": "bfd49b86-7f60-44e0-a87a-9a005e4f8aa2",
          // "token": "用户token",
        });
      } else if ("share" == call.method) {
        // 调用分享功能，call中带有分享参数:
        /* {
        "title":"分享标题",
        "description":"分享摘要",
        "imageUrl":"分享图片",
        "url":"分享链接",
        "platform":"0" //0 -&gt; @"朋友圈" ,1-&gt;@"微信好友",2-&gt;@"微博",3-&gt;@"QQ好友",4-&gt;@"QQ空间",5-&gt;@"钉钉"
        } */
        String title = call.arguments['title'];
        String description = call.arguments['description'];
        String imageUrl = call.arguments['imageUrl'];
        String url = call.arguments['url'];
        String platform = call.arguments['platform'];
      } else if ("openMini" == call.method) {
        // 打开微信小程序，call中带有小程序信息：code&amp;path
        String code = call.arguments['code'];
        String path = call.arguments['path'];
        print("打开小程序");
      }
      return Future.value(null);
    });
  }
}

class MyTabContent extends StatefulWidget {
  const MyTabContent({Key? key}) : super(key: key);

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

class _MyTabContentState extends State<MyTabContent>
    with AutomaticKeepAliveClientMixin {
  bool isVisible = false;

  [@override](/user/override)
  Widget build(BuildContext context) {
    super.build(context); // 保持状态的关键

    return VisibilityDetector(
      key: Key("XYCloudFlutterWebView"),
      onVisibilityChanged: (visibilityInfo) {
        isVisible = visibilityInfo.visibleFraction > 0.0;
        _xinhuammXycloudPlugin.notifyCloudPageVisibility(isVisible);
        print("是否显示$isVisible");
      },
      child: getXYCloudFlutterWebView(),
    );
  }

  [@override](/user/override)
  bool get wantKeepAlive => true;
}

Widget getXYCloudFlutterWebView() {
  print("getXYCloudFlutterWebView");
  const String viewType = 'XYCloudFlutterWebView';
  const String url =
      // 'https://xuancheng.market.xinhuamm.net/statics/cloud-application-o2o-user-h5/?isSpecialMall=1&amp;hideTopView=1&amp;nory=1';
      // 'https://yc.market.xinhuamm.net/statics/cloud-application-o2o-user-h5/pages/meal-card/home?showStatusBar=1&amp;isHideBack=1';
  'https://yc.market.xinhuamm.net/statics/cloud-application-o2o-user-h5?nory=1&amp;service_flag=o2o_half_screen';
  const Map<String, dynamic> creationParam = {'url': url};
  const MessageCodec creationParamsCodec = StandardMessageCodec();
  if (defaultTargetPlatform == TargetPlatform.android) {
    return const AndroidView(
      viewType: viewType,
      creationParams: creationParam,
      creationParamsCodec: creationParamsCodec,
    );
  } else if (defaultTargetPlatform == TargetPlatform.iOS) {
    return const UiKitView(
      viewType: viewType,
      creationParams: creationParam,
      creationParamsCodec: creationParamsCodec,
    );
  }
  return Container();
}

更多关于Flutter云服务集成插件xinhuamm_xycloud的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter云服务集成插件xinhuamm_xycloud的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


xinhuamm_xycloud 是一个用于 Flutter 应用程序的云服务集成插件。它提供了与云服务（如文件存储、数据库、用户认证等）的集成功能，使开发者能够轻松地在 Flutter 应用中使用云服务。

以下是如何在 Flutter 项目中使用 xinhuamm_xycloud 插件的基本步骤：

1. 添加依赖

首先，你需要在 pubspec.yaml 文件中添加 xinhuamm_xycloud 插件的依赖。

dependencies:
  flutter:
    sdk: flutter
  xinhuamm_xycloud: ^1.0.0  # 请根据实际情况填写版本号

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

2. 初始化云服务

在使用插件之前，通常需要初始化云服务。你可以在 main.dart 或应用程序的入口文件中进行初始化。

import 'package:xinhuamm_xycloud/xinhuamm_xycloud.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  
  // 初始化云服务
  await XinhuammXycloud.initialize(
    appId: 'your_app_id',
    apiKey: 'your_api_key',
    // 其他配置参数
  );

  runApp(MyApp());
}

3. 使用云服务功能

xinhuamm_xycloud 插件提供了多种云服务功能，如文件上传、数据库操作、用户认证等。以下是一些常见的使用示例：

3.1 文件上传

import 'package:xinhuamm_xycloud/xinhuamm_xycloud.dart';

Future<void> uploadFile() async {
  try {
    File file = File('path/to/your/file');
    String fileUrl = await XinhuammXycloud.uploadFile(file);
    print('File uploaded successfully: $fileUrl');
  } catch (e) {
    print('Failed to upload file: $e');
  }
}

3.2 数据库操作

import 'package:xinhuamm_xycloud/xinhuamm_xycloud.dart';

Future<void> saveData() async {
  try {
    await XinhuammXycloud.saveData(
      collection: 'users',
      data: {'name': 'John Doe', 'age': 30},
    );
    print('Data saved successfully');
  } catch (e) {
    print('Failed to save data: $e');
  }
}

3.3 用户认证

import 'package:xinhuamm_xycloud/xinhuamm_xycloud.dart';

Future<void> signIn() async {
  try {
    User user = await XinhuammXycloud.signInWithEmailAndPassword(
      email: 'user@example.com',
      password: 'password123',
    );
    print('User signed in: ${user.uid}');
  } catch (e) {
    print('Failed to sign in: $e');
  }
}
回到顶部