Microsoft AI: Mobile Emotion Recognition Application | MSDEVBUILD
source link: https://www.msdevbuild.com/2020/02/microsoft-ai-xamarin-emotion-recognition-Cognitive-Services.html
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
Microsoft AI: Mobile Emotion Recognition Application
LabelsAzure Cognitive Services MicrosoftAI Xamarin.Forms
Microsoft Cognitive Services offers awesome APIs and services for developers to create more intelligent applications. You can add interesting features, like people's emotions and video detection, face, speech, and vision recognition and speech and language understanding into your application.
The Emotion API takes a facial expression in an image stream as an input and returns confidence levels across a set of emotions for each face in the image like anger, contempt, disgust, fear, happiness, neutral, sadness, and surprise, in a facial expression
Where to implement
In this blog, we can learn about how to implement Emotion Recognition in Xamarin.Forms with Microsoft Cognitive Services.
Getting Started with the Emotion API
Step 1: Click here for Generate Subscriber Key and Click on Create
Step 2: You can agree the terms and Microsoft privacy statement > select the country and click on Next
Step 3: Login with Microsoft /LinkedIn /Facebook /Github for create your API
Step 4: You login and subscribe you should see the keys and the below information on available your subscriptions
We will use emotion API key in the following Xamarin application. before that we can test the API key
Test on Your Emotion Key
Create New Xamarin Forms Application
If you already installed VS on your machine, Open Visual Studio > Create New Xamarin Forms application like below
Solution will create with all the platform and PCL project
In this solution, we are going to create demo application for Article review automate based on the emotion.
Camera in Xamarin. Forms
Right Click on Solution > Type “xam.plugin” in the search box > Select all the project (PCL, iOS, Android and UWP) > Click on Install
Emotion Nuget Package
UI Design
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:DevEnvExeEmotion"
x:Class="DevEnvExeEmotion.MainPage">
<StackLayout Margin="20">
<StackLayout Orientation="Horizontal" Padding="30" HorizontalOptions="CenterAndExpand" >
<StackLayout x:Name="emotion">
<Label Text="Reader is :" FontSize="Large"/>
<Label x:Name="emotionResultLabel" FontSize="Large" />
</StackLayout>
<Button Text="Share Your FeedBack" Clicked="OnFeedBackClicked"></Button>
</StackLayout>
<Image x:Name="image" Source="article.png" />
<ActivityIndicator x:Name="activityIndicator" />
</StackLayout>
</ContentPage>
public partial class MainPage : ContentPage
{
EmotionServiceClient emotionClient;
MediaFile photo;
public MainPage()
{
InitializeComponent();
emotion.IsVisible = false;
emotionClient = new EmotionServiceClient("7f495be5faf643adbeead444d5b79a13");
}
For capture image, write the following code
public async Task CaptureImage()
{
await CrossMedia.Current.Initialize();
emotion.IsVisible = false;
// Take photo
if (CrossMedia.Current.IsCameraAvailable || CrossMedia.Current.IsTakePhotoSupported)
{
photo = await CrossMedia.Current.TakePhotoAsync(new StoreCameraMediaOptions
{
SaveToAlbum = false
});
}
else
{
await DisplayAlert("No Camera", "Camera unavailable.", "OK");
}
}
For Recognize emotion, write the following code
public async Task Recognizeemotion()
{
try
{
if (photo != null)
{
using (var photoStream = photo.GetStream())
{
Emotion[] emotionResult = await emotionClient.RecognizeAsync(photoStream);
if (emotionResult.Any())
{
// Emotions detected are happiness, sadness, surprise, anger, fear, contempt, disgust, or neutral.
emotionResultLabel.Text = emotionResult.FirstOrDefault().Scores.ToRankedList().FirstOrDefault().Key;
emotion.IsVisible = true;
}
photo.Dispose();
}
}
}
catch (Exception ex)
{
Debug.WriteLine(ex.Message);
}
}
{
//capture image
await CaptureImage();
((Button)sender).IsEnabled = false;
// Recognize emotion
await Recognizeemotion();
((Button)sender).IsEnabled = true;
}
Run the Application
Select the iOS /Android /Windows and install into the device and click on ‘Share your Feedback ‘button
Summary
or reload the browserDisable in this text fieldEditEdit in GingerEdit in Ginger×
Recommend
-
102
facepaint Dynamic style values for css-in-js. import { css } from 'emotion' import facepaint from 'facepaint' const mq = facepaint([ '@media(min-width: 420px)', '@media(min-width: 920px)', '@media(min-width: 1120px...
-
45
Out of the box, React allows you to style components directly with the style property. It’s accepts an object of style properties and for most use cases, it’s more than sufficient. As a single property, t...
-
46
README.md
-
39
Image Credit: B-rina Recognizing human emotio...
-
31
Classifying Conversations using Graphs Kevin Shen
-
6
More with Gruut: Use the Microsoft Bot Framework to analyze emotion with the Azure Face API In this post, we use the Azure Face API to...
-
3
Why emotion recognition AI can’t reveal how we feel New research exposes the flaws in emotion recognition
-
5
城会玩之微软 Emotion Recognition
-
6
May 2, 2022 ...
-
4
Microsoft will halt sale of emotion-reading tech and limit access to face recognition tools...
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK