UWP Key Phrase Extraction Using Cognitive Service Text Anaytics API

Before reading this article, please go through the following articles.

Introduction To Universal Windows Platform (UWP) App Development Using Windows 10 And Visual Studio 2015
Getting Started With Microsoft Azure Cognitive Services - Text Analytics API

Microsoft Cognitive Services (formerly Project Oxford) are a set of APIs, SDKs and services available to developers to make their applications more intelligent, engaging and discoverable. Microsoft Cognitive Services expands on Microsoft’s evolving portfolio of machine learning APIs and enables developers to easily add intelligent features. Microsoft Cognitive Services let you build apps with powerful algorithms using just a few lines of code. They work across devices and platforms such as iOS, Android, and Windows, keep improving, and are easy to set up.

Text Analytics API, as described by Microsoft, is designed to detect sentiment, key phrases, topics, and language from your text.

Reading this article, you can learn how to do Cognitive Text Analytics API – Key Phrase Extraction in Universal Windows apps development with Azure, XAML and Visual C#.

The following important tools are required for developing UWP,

Windows 10 (Recommended)
Visual Studio 2015 Community Edition (It is a free software available online)
Cognitive Service Text Analytics API Key (using azure Getting Started With Microsoft Azure Cognitive Services - Text Analytics API)

Now we can discuss step by step App development.

Step 1

Open Visual studio 2015 -> Start -> New Project-> Select Universal (under Visual C#->Windows)-> Blank App -> Give a suitable name for your app (UWPCogTextAnaly)->OK.

Microsoft

After choosing the target and minimum platform version that your app will support, the Project creates App.xaml and MainPage.xaml.

Step 2

Open (double click) the file MainPage.xaml in the Solution Explorer and add the Newtonsoft.Json reference in the project. Right click your project (UWPCogTextAnaly) and select "Manage NuGet Packages".

Microsoft

For adding Newtonsoft.Json reference, choose Browse and Search Newtonsoft.Json. Select the package and install it.

Reference is added to your project

Step 3

Add 2 TextBlock controls, change the name and text property for SampleText.

Add a Button Control, set the Name, and add the Edit icon for Listing Key Phrases.

Microsoft

Step 4

Add GridView Resources, using the code, mentioned below.

<Grid.Resources>
<CollectionViewSource x:Name="KeyPhraseResultsCol" Source="{x:Bind KeyPharseResults}" IsSourceGrouped="False" />
</Grid.Resources>

Add a GridView Control and set the ItemSource properties.

<GridView x:Name="gvKeyPhr" ItemsSource="{Binding Source={StaticResource KeyPhraseResultsCol}}" SelectionMode="None" IsItemClickEnabled="False" HorizontalAlignment="Left" Height="276" Margin="96,233,0,0" VerticalAlignment="Top" Width="1054">

Add the following code for GridView Item Template for Phrase list.

<GridView.ItemTemplate>
<DataTemplate>
<Border Background="AliceBlue" Width="330" Height="38" Margin="8">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto" />
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid Grid.Column="1" Margin="3,3,3,10">
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
</Grid.RowDefinitions>
<StackPanel Margin="0,0,0,-143">
<TextBlock TextWrapping="Wrap" Text="{Binding kpco.phrases}" Style="{StaticResource CaptionTextBlockStyle}" Height="28" />
</StackPanel>
</Grid>
</Grid>
</Border>
</DataTemplate>
</GridView.ItemTemplate>

Step 5

Add the Click Event method for Phrase find button.

Note

Automatically, the following code will be generated in XAML code view, while we are done in the design view.

<Page x:Class="UWPCogTextAnaly.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:UWPCogTextAnaly" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d">
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid.Resources>
<CollectionViewSource x:Name="KeyPhraseResultsCol" Source="{x:Bind KeyPharseResults}" IsSourceGrouped="False" />
</Grid.Resources>
<TextBlock x:Name="tblTitle" HorizontalAlignment="Left" Margin="324,73,0,0" TextWrapping="Wrap" Text="UWP Cognitive Service Text Analytics - Key Phrase Extraction Demo" VerticalAlignment="Top" FontWeight="Bold" FontSize="20" />
<TextBlock x:Name="tbltest" HorizontalAlignment="Left" Margin="46,166,0,0" TextWrapping="Wrap" Text="Sample Text : " VerticalAlignment="Top" FontWeight="Bold" FontSize="20" />
<TextBlock x:Name="tblText" HorizontalAlignment="Left" Height="36" Margin="178,166,0,0" TextWrapping="Wrap" Text="The manual transmission is a bit twitchy. Also, the vehicle is old-school" VerticalAlignment="Top" Width="748" FontSize="22" />
<Button x:Name="btnKeyPhrase" HorizontalAlignment="Left" Margin="952,170,0,0" VerticalAlignment="Top" Click="btnKeyPhrase_Click" RenderTransformOrigin="3.6,0.312" ToolTipService.ToolTip="Click to Key Phrase">
<SymbolIcon Symbol="Edit"></SymbolIcon>
</Button>
<GridView x:Name="gvKeyPhr" ItemsSource="{Binding Source={StaticResource KeyPhraseResultsCol}}" SelectionMode="None" IsItemClickEnabled="False" HorizontalAlignment="Left" Height="276" Margin="96,233,0,0" VerticalAlignment="Top" Width="1054">
<GridView.ItemTemplate>
<DataTemplate>
<Border Background="AliceBlue" Width="330" Height="38" Margin="8">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto" />
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid Grid.Column="1" Margin="3,3,3,10">
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
</Grid.RowDefinitions>
<StackPanel Margin="0,0,0,-143">
<TextBlock TextWrapping="Wrap" Text="{Binding kpco.phrases}" Style="{StaticResource CaptionTextBlockStyle}" Height="28" />
</StackPanel>
</Grid>
</Grid>
</Border>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
</Grid>
</Page>

Step 6

Add the following namespaces in Mainpage.xaml.cs for Key Phrases,

using System.Net.Http;
using System.Threading.Tasks;
using Newtonsoft.Json.Linq;
using System.Collections.ObjectModel;
using System.Net.Http.Headers;

Step 7

Add the Text Analytics Client keys use Azure service and generate it (For more information, please refer the article Getting Started With Microsoft Azure Cognitive Services - Text Analytics API).

Bing Text Analytics API - Key Phrase Extraction endpoint

https://westus.api.cognitive.microsoft.com/text/analytics/v2.0/keyPhrases?

Add the following code with Azure generated key for Bing Spell Check.

public class Keypharesec {
public string phrases {
get;
set;
}
}
public class Kpcol {
public Keypharesec kpco {
get;
set;
}
}
static string requestString;
public ObservableCollection < Kpcol > KeyPharseResults {
get;
set;
} = new ObservableCollection < Kpcol > ();
private async void btnKeyPhrase_Click(object sender, RoutedEventArgs e) {
var kp = await getKeyPhrase();
for (int i = 0; i < kp.Count(); i++) {
Keypharesec kc = kp.ElementAt(i);
KeyPharseResults.Add(new Kpcol {
kpco = kc
});
}
}
static async Task < IEnumerable < Keypharesec >> getKeyPhrase() {
List < Keypharesec > phrases = new List < Keypharesec > ();
var client = new HttpClient();
string language = "en";
string[] input = new string[] {
"The manual transmission is a bit twitchy. Also, the vehicle is old-school"
};
if (input != null) {
// Request body.
requestString = "{\"documents\":[";
for (int i = 0; i < input.Length; i++) {
requestString += string.Format("{{\"id\":\"{0}\",\"text\":\"{1}\", \"language\":\"{2}\"}}", i, input[i].Replace("\"", "'"), language);
if (i != input.Length - 1) {
requestString += ",";
}
}
requestString += "]}";
}
client.DefaultRequestHeaders.Add("Ocp-Apim-Subscription-Key", "<Your Key>");
var uri = "https://westus.api.cognitive.microsoft.com/text/analytics/v2.0/keyPhrases?";
HttpResponseMessage response;
byte[] byteData = System.Text.Encoding.UTF8.GetBytes(requestString);
using(var content = new ByteArrayContent(byteData)) {
content.Headers.ContentType = new MediaTypeHeaderValue("application/json");
response = await client.PostAsync(uri, content);
}
string content1 = await response.Content.ReadAsStringAsync();
if (!response.IsSuccessStatusCode) {
throw new Exception("Text Analytics failed. " + content1);
}
dynamic data = JObject.Parse(content1);
if (data.documents != null) {
for (int i = 0; i < data.documents.Count; i++) {
for (int j = 0; j < data.documents[i].keyPhrases.Count; j++) {
phrases.Add(new Keypharesec {
phrases = data.documents[i].keyPhrases[j]
});
}
}
}
return phrases;
}

Step 8

Deploy your app in Local Machine. The output of the UWPCogTextAnaly app is,

Microsoft

After clicking the Button

Microsoft

Summary

Now, you have successfully extracted the Key Phrases using Cognitive Service Text Analytics API, Azure, XAML AND C# with UWP environment.

If you are interested, please read the UWP Cognitive Service articles, mentioned below.

Before reading this article, please go through the following articles.

Windows 10 (Recommended)
Visual Studio 2015 Community Edition (It is a free software available online)
Cognitive Service Text Analytics API Key (using azure Getting Started With Microsoft Azure Cognitive Services - Text Analytics API)

<Grid.Resources>
<CollectionViewSource x:Name="KeyPhraseResultsCol" Source="{x:Bind KeyPharseResults}" IsSourceGrouped="False" />
</Grid.Resources>

Add a GridView Control and set the ItemSource properties.

<GridView x:Name="gvKeyPhr" ItemsSource="{Binding Source={StaticResource KeyPhraseResultsCol}}" SelectionMode="None" IsItemClickEnabled="False" HorizontalAlignment="Left" Height="276" Margin="96,233,0,0" VerticalAlignment="Top" Width="1054">

Add the following code for GridView Item Template for Phrase list.

<GridView.ItemTemplate>
<DataTemplate>
<Border Background="AliceBlue" Width="330" Height="38" Margin="8">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto" />
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid Grid.Column="1" Margin="3,3,3,10">
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
</Grid.RowDefinitions>
<StackPanel Margin="0,0,0,-143">
<TextBlock TextWrapping="Wrap" Text="{Binding kpco.phrases}" Style="{StaticResource CaptionTextBlockStyle}" Height="28" />
</StackPanel>
</Grid>
</Grid>
</Border>
</DataTemplate>
</GridView.ItemTemplate>

Step 5

Add the Click Event method for Phrase find button.

Note

Automatically, the following code will be generated in XAML code view, while we are done in the design view.

<Page x:Class="UWPCogTextAnaly.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:UWPCogTextAnaly" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d">
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid.Resources>
<CollectionViewSource x:Name="KeyPhraseResultsCol" Source="{x:Bind KeyPharseResults}" IsSourceGrouped="False" />
</Grid.Resources>
<TextBlock x:Name="tblTitle" HorizontalAlignment="Left" Margin="324,73,0,0" TextWrapping="Wrap" Text="UWP Cognitive Service Text Analytics - Key Phrase Extraction Demo" VerticalAlignment="Top" FontWeight="Bold" FontSize="20" />
<TextBlock x:Name="tbltest" HorizontalAlignment="Left" Margin="46,166,0,0" TextWrapping="Wrap" Text="Sample Text : " VerticalAlignment="Top" FontWeight="Bold" FontSize="20" />
<TextBlock x:Name="tblText" HorizontalAlignment="Left" Height="36" Margin="178,166,0,0" TextWrapping="Wrap" Text="The manual transmission is a bit twitchy. Also, the vehicle is old-school" VerticalAlignment="Top" Width="748" FontSize="22" />
<Button x:Name="btnKeyPhrase" HorizontalAlignment="Left" Margin="952,170,0,0" VerticalAlignment="Top" Click="btnKeyPhrase_Click" RenderTransformOrigin="3.6,0.312" ToolTipService.ToolTip="Click to Key Phrase">
<SymbolIcon Symbol="Edit"></SymbolIcon>
</Button>
<GridView x:Name="gvKeyPhr" ItemsSource="{Binding Source={StaticResource KeyPhraseResultsCol}}" SelectionMode="None" IsItemClickEnabled="False" HorizontalAlignment="Left" Height="276" Margin="96,233,0,0" VerticalAlignment="Top" Width="1054">
<GridView.ItemTemplate>
<DataTemplate>
<Border Background="AliceBlue" Width="330" Height="38" Margin="8">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto" />
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid Grid.Column="1" Margin="3,3,3,10">
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
</Grid.RowDefinitions>
<StackPanel Margin="0,0,0,-143">
<TextBlock TextWrapping="Wrap" Text="{Binding kpco.phrases}" Style="{StaticResource CaptionTextBlockStyle}" Height="28" />
</StackPanel>
</Grid>
</Grid>
</Border>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
</Grid>
</Page>