How to implement ML Kit Firebase on React Native app? - firebase

I am trying to build a simple app that takes a picture of a dog, and it tells me what breed of dog it is. I got the camera working on my reactnative app, and uploaded my custom TFlite model to my project on Firebase. Im not sure how to proceed as my next step. The Firebase ML documentation suggests that I can only do so with native code (ios/android) My next step is 'sending' the picture i took to the custom model on Firebase. Is this possible, if so, how? thanks

You can try this PR for ML Kit wrapper which adds support for image labeling https://github.com/a7medev/react-native-ml-kit/pull/21

Related

What is the meaning of 'iw' language code from firebase-ml-languageIdentifier? (flutter)

I'm trying to use the firebase ML language identifier. Whenever I type something in Hebrew, I get back the language code 'iw' instead of 'he'. I tried to look for the API or the meaning of the 'iw' code in the documentation, but couldn't find anything.
"iw" is an old code which was changed to "he" in 1989.
see https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes
We made some changes to Firebase ML Kit to better distinguish the on-device APIs from cloud based APIs. "ML Kit"(without firebase branding) contains all the on-device APIs. Here's the migration guide from firebase mlkit to mlkit.
In the standalone mlkit, we are using he instead of iw for Hebrew.

React Native Crashlytics Firebase

We are using firebase crashlytics in react native. But the problem is when the android app crashed, crashlytics give us android native code report. Not the react native code. That is obvious since it is already compiled to native code. But the thing is we are not able to map issues into react native code. Is there any mechanism to do this automatically or manually with the minimum human involvement?
Crash Analytics won't give you detailed report in javascript. Rather it would define the screen where it crashed and the devices/OS etc. You will have to figure the crash yourself. It will give you the crash report like :
com.facebook.soloader.SoLoader.doLoadLibraryBySoName (SoLoader.java)
com.facebook.soloader.SoLoader.assertInitialized (SoLoader.java)
com.facebook.soloader.SoLoader.assertInitialized (SoLoader.java)
com.facebook.soloader.SoLoader.assertInitialized (SoLoader.java)
com.facebook.react.bridge.ReactBridge.staticInit (ReactBridge.java)
com.facebook.react.bridge.NativeMap. (NativeMap.java)
com.facebook.react.jscexecutor.JSCExecutorFactory.create
(JSCExecutorFactory.java)
com.facebook.react.ReactInstanceManager$5.run
(ReactInstanceManager.java)
*You need to have a basic native knowledge or you can google these errors and know the root cause. Also, FYI Sentry can of great help to you as it records javascript error also. Also, A/c firebase latest version 6+ now records JS errors also*

how to implement mixpannel analytics in react native

i have to implement mixpannel analytics in one of my app.
i checked out Mixpannel officail site and react-native-mixpannel
but i'm struggling how to get started with it.
How to use it from scratch and what things i need for it like firebase
or not ?
Please suggest me some article or something else from where i can implement mixpannel anaylits to my react native app
Thanks
First of all did you use react-native init AwesomeProject or expo new?
With the first one you have access to the native code for iOS and Android.
For expo you have only the JavaScript files and you can't use this SDK.

Can we use mapcreator.here.com data with android sdk?

The area where our customers are using our application made with the here sdk contains mapping errors. We are using the mapcreator web application to fix the errors but the changes do not appear immediatelly in the application as they need to be reviewed before being integrated on the real map server.
Is there a way to export the mapcreator (unreviewed) maps in the map format the sdk is using so that changes would be reflected immediately ?
If not, how long does it take for changes in mapcreator to be reflected in the maps downloaded with MapLoader ?
Thank you
It will take sometime before the map creator data is propagated to our commercial maps.
However, you can use our MapRasterTile APIs to replace just the areas you are interested in with data from MapCreator. Please let us know if you require additional information or a sample.

how to implement Exif.PCL in xamarin forms?

I am trying to create a project in which picture is taken to upload from mobile camera, but when it is taken with front camera it rotates upside down (especially Android). I have read suggestions to use Exif.PCL nuget package but dont know how to implement the same. Can anybody help me out with this ?
Thanks
Background
I had the same problem in one of my apps. After trying different approaches I've found several problems with current implementations. Generally I use XLabs, which has media picking capabilities.
Issues
First of all it lacked support for scaling and autorotating images after they are taken. That's your question. So, first of all I had to implement some after-processing as soon as the image was picked.
Second, there are problems with Android and Xamarin.Forms due do how Activities are handled in Android. The way it works on Android is you launch CameraActivity or PhotoGalleryActivity which are actually hosted in a different application. Those Activities use substential amount of system memory, and due to this operating system will try to kill non-forground processes, including your app :) Workarround for this was completely implementing photo taking flow inside of my application by creating photo taking activities from scratch. Thus, I will never leave my app, and Android runtime will never kill my application.
Solution
Taking account all of this, I've implement my own flow of Image capturing. You can find the source code HERE. The basic architecture is following:
I've created IImageService, which has methods for picking images from camera or library.
public interface IImageService
{
Task<IImage> GetImageFromLibrary();
Task<IImage> GetImageFromCamera();
}
Then I've implemented this for iOS and Android separately and used dependency injection. For iOS I use XLabs implementation, cause it works as it should there are no problems with it. For Android I've created several activities to support picking images from Camera and Library: CameraActivity, PhotoGaleryActivity, which basically replace the native image picking activities.
After I pick the image I do scaling and rotating procedure. For iOS I've created UIImageToolbox static class which has GetScaledAndRotatedImage method. For Android it's BitmapToolbox static class which has GetScaledAndRotatedBitmap method.
In my sample application I've created ImageViewModel and ImagePage to demonstrate the usage of IImageService. It should be straightforward.
How to use the sample app?
Let me give a small remark. You can use only XLabs implementation for both iOS and Android and just use BitmapToolbox and UIImageToolbox to implement the scaling and rotation. And this is answer to your question. However, if you want your app to be stable on Android you need to go a little bit dipper.
Install all the necessary nuget packages to your Forms, Droid and iOS projects. You can find the packages that are used by sample application in packages.config file of each project
I use MvvmCross Messenger plugin for broadcast messaging, if you have alternative you can easily replace it. But if you want to use it, don't forget to register dependencies in your AppDelegate and MainActivity
DependencyService.Register();
Add necessary classes to your Forms, iOS and Android projects from sample application. You can use Resharper to fix namespaces for you.
For xaml files, if you drug and drop to forms project default build action and Custom Tool are set to wrong values. Thus click the xaml file, select properties set Build Action to Embedded Resource, and Custom Tool to MSBuild:UpdateDesignTimeXaml
For android project add necessary resources from drawable, drawable-xxhdpi, layout and values folders.
In grid_cell_photo_galery_item.axml file fix namespaces. Replace ImageSample.Droid.Views.SquareRelativeLayout by your namespace.
For Android, right click Android project, select properties, go to Android Manifest and add CAMERA, READ_EXTERNAL_STORAGE and WRITE_EXTERNAL_STORAGE permissions.
For Android, right click Android project, select properties, go to Advanced and set Max Heap Size to something like 1G, this is needed because PhotoGalaryActivity uses substantial amount of memory to display images and we need an increased heap size.
For iOS, don't forget to add dependency injection for MediaPicker in AppDelegate - DependencyService.Register<MediaPicker>();
That's all.

Resources