{"id":24642,"date":"2020-09-07T11:51:52","date_gmt":"2020-09-07T11:51:52","guid":{"rendered":"https:\/\/www.inogic.com\/blog\/?p=24642"},"modified":"2020-09-11T11:40:21","modified_gmt":"2020-09-11T11:40:21","slug":"how-to-use-text-recognizer-in-canvas-app","status":"publish","type":"post","link":"https:\/\/www.inogic.com\/blog\/2020\/09\/how-to-use-text-recognizer-in-canvas-app\/","title":{"rendered":"How to use Text Recognizer in Canvas App"},"content":{"rendered":"

Introduction:<\/strong><\/h2>\n

Microsoft AI builder<\/strong> comes with many amazing features and can be integrated with Power Platforms. We have seen in our previous blog<\/a> how to use barcode scanner control in Power Apps. In today\u2019s blog, we will explore how to integrate Microsoft AI builder Text Recognizer<\/strong> in Canvas App. Here, we must have AI Builder License enabled to use Text Recognizer<\/strong> in Canvas App.<\/p>\n

Let\u2019s consider a scenario where a person wants to send daily notes to all the students according to the class. Now the person will open the Canvas App, upload the images in text recognizer control, select the class from the drop down and hit the \u2018Send Email\u2019 button to send the notes to all the students of the class selected from the drop down. For this, first you have to create a custom entity \u2018Student\u2019 in Dynamics 365 CRM which contains Name, Email and Class of the student as shown in the below screenshot:<\/p>\n

\"Text<\/a><\/p>\n

Now to send daily notes to all the students, follow the steps given below:<\/p>\n

1. Create a Canvas App and click on AI Builder<\/strong> to add a Text Recognizer<\/strong> Control as shown in the below screenshot:<\/p>\n

\"Text<\/a><\/p>\n

2. Now add a Drop Down Input <\/strong>and add the below formula in Item<\/strong> property of drop down so that the drop down will show a list of classes:<\/p>\n

\"Text<\/a>\"Text<\/a><\/p>\n

3. Now add HTML Text <\/strong>to show the text obtained from Text Recognizer so that the user can verify the text and send the email.<\/strong><\/p>\n

\"Text<\/a><\/p>\n

To see the text, <\/strong>set the HTMLText <\/strong>property as shown in the below screenshot:<\/p>\n

Formula on HTMLText Property<\/strong>: Concat(TextRecognizer.Results,Text & “<br>”)<\/p>\n

In the above formula, the Concat function concatenates strings obtained from the Text Recognizer result and prints each text in the next line using the <br> tag of HTML.<\/p>\n

\"Text<\/a><\/p>\n

4. You can add \u2018Office365Outlook<\/strong>\u2019 connector to send the email message which will contain text extracted from Text Recognizer<\/strong> control as shown in the below screenshot:<\/p>\n

\"Text<\/a><\/p>\n

5. Add Student<\/strong> data source from Common Data Service in the Canvas App to send an email from the Student Data as shown in the below screenshot:<\/p>\n

\"Text<\/a><\/p>\n

6. Add a \u2018Send Email<\/strong>\u2019 button and for the onSelect<\/strong> property of the button, add the below formula to filter student records depending on the class and send emails to them.<\/p>\n

ForAll(<\/strong><\/p>\n

\u00a0\u00a0\u00a0 Filter(<\/strong><\/p>\n

\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 Students,<\/strong><\/p>\n

\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 ClassDropdown.Selected.Text exactin Class<\/strong><\/p>\n

\u00a0\u00a0\u00a0 ),<\/strong><\/p>\n

\u00a0\u00a0\u00a0 Office365Outlook.SendEmail(<\/strong><\/p>\n

\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 Email,<\/strong><\/p>\n

\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 “Notes – ” & Today(),<\/strong><\/p>\n

\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 TextHtmlText.HtmlText<\/strong><\/p>\n

\u00a0\u00a0\u00a0 )<\/strong><\/p>\n

)<\/strong><\/p>\n

The above formula will filter the Student<\/strong> records depending upon the Class<\/strong> selected in the dropdown and for each student record, an email is sent containing the text obtained from Text Recognizer.<\/p>\n

\"Text<\/a><\/p>\n

7. Now let\u2019s run the app, upload an image in the Text Recognizer<\/strong> control and send an email to the student as shown in the below screenshot:<\/p>\n

\"Text<\/a><\/p>\n

Conclusion: <\/strong><\/h2>\n

In this way, we can add\u00a0Text Recognizer<\/strong> in Canvas App to get text from images by using\u00a0Text Recognizer<\/strong> control.<\/p>\n","protected":false},"excerpt":{"rendered":"

Introduction: Microsoft AI builder comes with many amazing features and can be integrated with Power Platforms. We have seen in our previous blog how to use barcode scanner control in Power Apps. In today\u2019s blog, we will explore how to integrate Microsoft AI builder Text Recognizer in Canvas App. Here, we must have AI Builder\u2026 Read More »<\/a><\/span><\/p>\n","protected":false},"author":13,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[1954],"tags":[1867,245,545],"class_list":["post-24642","post","type-post","status-publish","format-standard","hentry","category-canvas-apps","tag-canvas-app","tag-canvas-app-in-dynamics365-crm","tag-dynamics-365-crm"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/posts\/24642","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/users\/13"}],"replies":[{"embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/comments?post=24642"}],"version-history":[{"count":0,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/posts\/24642\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/media?parent=24642"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/categories?post=24642"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/tags?post=24642"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}