React Native 的 TensorFlow Lite 组件

这是 flutter_tflite 移植的 React Native 版本，使用最新的 TensorFlow Lite 1.12.0。支持：

• 图像检测
• 目标识别（可选 SSD MobileNet 或 Tiny YOLOv2）

项目地址：https://github.com/shaqian/tflite-react-native

yolo.jpg

---

安装

npm install tflite-react-native --save
react-native link react-native-ssh-sftp

• iOS 端 TensorFlow Lite 需要用 Pod 安装，按以下步骤初始化后安装：

1. 初始化 Pod 文件:

   cd ios
   pod init
   

2. 打开 Podfile 添加:

   target '[your project's name]' do
       pod 'TensorFlowLite', '1.12.0'
   end
   

3. 安装:

   pod install
   

手动 Link

react-native link 不好使的情况试一下手动添加：

iOS

1. 打开 XCode 的 project navigator，右击 Libraries ➜ Add Files to [项目名称]
2. 找到 node_modules ➜ tflite-react-native 然后选择 TfliteReactNative.xcodeproj
3. 打开 XCode 的 project navigator，选中你的项目，添加 libTfliteReactNative.a 到项目的 Build Phases ➜ Link Binary With Libraries

Android

1. 打开 android/app/src/main/java/[...]/MainApplication.java
   - 添加 import com.reactlibrary.TfliteReactNativePackage; 到文件开头的 imports 中
   - 添加 new TfliteReactNativePackage() 到 getPackages() 方法的列表中
2. 在 android/settings.gradle 中添加以下内容 :

   include ':tflite-react-native'
   project(':tflite-react-native').projectDir = new File(rootProject.projectDir,   '../node_modules/tflite-react-native/android')
   

3. 在 android/app/build.gradle 文件的 dependencies 中添加:

   compile project(':tflite-react-native')
   

---

添加模型到项目

iOS

打开 XCode， 右击项目文件夹，点击 Add Files to "项目名称"...，选择模型文件和标签文件。

Android

1. 打开 Android Studio，右击 app 文件夹，然后 New > Folder > Assets Folder。点击 Finish 后生成 assets 文件夹。

2. 将模型和标签文件复制到 app/src/main/assets。

3. 打开 android/app/build.gradle，在 android 块中加入以下设定。

    aaptOptions {
        noCompress 'tflite'
    }

---

使用方法介绍

初始化

import Tflite from 'tflite-react-native';

let tflite = new Tflite();

导入模型和标签

tflite.loadModel({
  model: 'models/mobilenet_v1_1.0_224.tflite',// 模型文件，必填
  labels: 'models/mobilenet_v1_1.0_224.txt',  // 标签文件，必填
  numThreads: 1,                              // 线程数，默认为 1
},
(err, res) => {
  if(err)
    console.log(err);
  else
    console.log(res);
});

图像检测

tflite.runModelOnImage({
  path: imagePath,  // 图像文件地址，必填
  imageMean: 128.0, // mean，默认为 127.5
  imageStd: 128.0,  // std，默认为 127.5
  numResults: 3,    // 返回结果数，默认为 5
  threshold: 0.05   // 可信度阈值，默认为 0.1
},
(err, res) => {
  if(err)
    console.log(err);
  else
    console.log(res);
});

• 输出格式：

{
  index: 0,
  label: "person",
  confidence: 0.629
}

目标检测:

• SSD MobileNet

tflite.detectObjectOnImage({
  path: imagePath,
  model: 'SSDMobileNet',
  imageMean: 127.5,
  imageStd: 127.5,
  threshold: 0.3,       // 可信度阈值，默认为 0.1
  numResultsPerClass: 2,// 单个类别的返回结果数， 默认为 5
},
(err, res) => {
  if(err)
    console.log(err);
  else
    console.log(res);
});

• Tiny YOLOv2

tflite.detectObjectOnImage({
  path: imagePath,
  model: 'YOLO',
  imageMean: 0.0,
  imageStd: 255.0,
  threshold: 0.3,        // 可信度阈值，默认为 0.1
  numResultsPerClass: 2, // 单个类别的返回结果数， 默认为 5
  anchors: [...],        // 默认为 [0.57273,0.677385,1.87446,2.06253,3.33843,5.47434,7.88282,3.52778,9.77052,9.16828]
  blockSize: 32,         // 默认为 32 
},
(err, res) => {
  if(err)
    console.log(err);
  else
    console.log(res);
});

• 输出格式：

{
  detectedClass: "hot dog",
  confidenceInClass: 0.123,
  rect: {
    x: 0.15,
    y: 0.33,
    w: 0.80,
    h: 0.27
  }
}

完整的例子

https://github.com/shaqian/tflite-react-native/tree/master/example