Flutter插件tfx的介绍与使用

Flutter插件tfx的介绍与使用

概述

TensorFlow Lite Flutter 插件提供了简单、灵活且快速的 Dart API，用于在 Flutter 应用中集成 TFLite 模型。此插件允许开发者轻松地将 TensorFlow Lite 模型嵌入到 Flutter 应用程序中。

iOS 配置

在 iOS 平台上使用 tfx 插件时，需要对 Podfile 进行一些配置。以下是 Podfile 的示例代码：

# Podfile
post_install do |installer|
  installer.pods_project.targets.each do |target|
    flutter_additional_ios_build_settings(target)
    # 设置最低支持的 iOS 版本为 12.0
    target.build_configurations.each do |config|
      config.build_settings['IPHONEOS_DEPLOYMENT_TARGET'] = '12.0'
    end
  end
end

完整示例代码

以下是一个完整的示例代码，展示了如何在 Flutter 中使用 tfx 插件进行文本分类任务。

示例代码：main.dart

// 导入必要的库
import 'package:flutter/cupertino.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:tfx/tflite.dart'; // 引入 tflite 插件
import 'package:tfx_example/classifier.dart'; // 自定义分类器

void main() {
  runApp(MyApp()); // 启动应用
}

// 主应用类
class MyApp extends StatelessWidget {
  const MyApp({super.key});

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomePage(), // 设置主页
      theme: ThemeData.light().copyWith(
        pageTransitionsTheme: PageTransitionsTheme(
          builders: <TargetPlatform, PageTransitionsBuilder>{
            TargetPlatform.android: CupertinoPageTransitionsBuilder(),
            TargetPlatform.iOS: CupertinoPageTransitionsBuilder(),
          },
        ),
      ),
    );
  }
}

// 主页类
class HomePage extends StatelessWidget {
  const HomePage({super.key});

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('TFLite'), // 设置标题
      ),
      body: ListView(
        children: <Widget>[
          // 初始化按钮
          ListTile(
            title: Text('init'),
            onTap: () {
              TFLite.init(); // 初始化 TFLite
            },
          ),
          // 获取运行时版本按钮
          ListTile(
            title: Text('runtimeVersion'),
            onTap: () {
              if (kDebugMode) {
                print(TFLite.runtimeVersion()); // 打印运行时版本
              }
            },
          ),
          // 文本分类按钮
          ListTile(
            title: Text('Text classification'),
            onTap: () {
              Navigator.of(context).push<void>(
                CupertinoPageRoute<void>(
                  builder: (BuildContext context) => ClassifierPage(),
                ),
              );
            },
          ),
        ],
      ),
    );
  }
}

// 分类页面类
class ClassifierPage extends StatefulWidget {
  const ClassifierPage({super.key});

  [@override](/user/override)
  State<StatefulWidget> createState() {
    return _ClassifierPageState();
  }
}

class _ClassifierPageState extends State<ClassifierPage> {
  late final TextEditingController _controller = TextEditingController();
  final Classifier _classifier = Classifier()..init();
  final List<Widget> _children = [];

  [@override](/user/override)
  void dispose() {
    _controller.dispose();
    _classifier.dispose();
    super.dispose();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Text classification'), // 设置标题
      ),
      body: ListView.builder(
        itemCount: _children.length,
        itemBuilder: (BuildContext context, int index) {
          return _children[index]; // 显示已分类的结果
        },
      ),
      bottomNavigationBar: BottomAppBar(
        child: Padding(
          padding: MediaQuery.of(context).viewInsets,
          child: Row(
            children: <Widget>[
              Expanded(
                child: TextField(
                  decoration: InputDecoration(hintText: 'Write some text here'), // 输入提示
                  controller: _controller,
                ),
              ),
              TextButton(
                child: Text('Classify'), // 分类按钮
                onPressed: () async {
                  final String text = _controller.text; // 获取输入文本
                  await _classifier.init(); // 初始化分类器
                  final List<double> prediction = await _classifier.classify(text); // 进行分类预测
                  setState(() {
                    _children.add(Dismissible(
                      key: GlobalKey(),
                      onDismissed: (DismissDirection direction) {},
                      child: Card(
                        child: Container(
                          padding: EdgeInsets.all(16),
                          color: prediction[1] > prediction[0] ? Colors.lightGreen : Colors.redAccent, // 根据结果设置颜色
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: <Widget>[
                              Text(
                                'Input: $text', // 显示输入文本
                                style: TextStyle(fontSize: 16),
                              ),
                              Text('Output:'), // 输出结果
                              Text('   Positive: ${prediction[1]}'), // 正面概率
                              Text('   Negative: ${prediction[0]}'), // 负面概率
                            ],
                          ),
                        ),
                      ),
                    ));
                    _controller.clear(); // 清空输入框
                  });
                },
              ),
            ],
          ),
        ),
      ),
    );
  }
}