{"id":24392,"date":"2020-08-13T13:07:35","date_gmt":"2020-08-13T13:07:35","guid":{"rendered":"https:\/\/www.inogic.com\/blog\/?p=24392"},"modified":"2020-08-13T13:37:17","modified_gmt":"2020-08-13T13:37:17","slug":"mixed-reality-solutions-with-power-apps-dynamics-365-crm-cds","status":"publish","type":"post","link":"https:\/\/www.inogic.com\/blog\/2020\/08\/mixed-reality-solutions-with-power-apps-dynamics-365-crm-cds\/","title":{"rendered":"Mixed Reality Solutions with Power Apps \/ Dynamics 365 CRM \/ CDS"},"content":{"rendered":"

In recent times Pokemon Go was a mixed reality game, it showed pokemon characters in your real surrounding using the camera of your mobile phone.<\/p>\n

And that kind of brought about ideas to present customers with the ability to view the products in their own surroundings that would help them try placing the objects in their environment and visualize it before making the decision.<\/p>\n

Designing Mixed Reality Solutions in the past has required specialized technical knowledge, but with the aim to democratize technology, Microsoft Power Apps now offers Mixed Reality Components that are ready to use for everyone without any development experience.<\/p>\n

Here I take an example of product images. The product details are stored in the Product entity available with Dynamics 365 CRM Sales and the images for the products have been stored in the notes section of the record.<\/p>\n

Let us start with placing a gallery component to list out all the products.<\/p>\n

Place the gallery control from the command bar.<\/p>\n

\"Mixed<\/p>\n

In the datasource of the gallery \u2013 choose Products (you may have to make a connection with Common Data Service (Current) connector, if you do not already have one).<\/p>\n

And choose the appropriate view from the Product entity that you want to use to list the products from.<\/p>\n

In the field selection list, we choose ID and Name to be displayed.<\/p>\n

\"Mixed<\/p>\n

Now once a user selects one of the products, we would like to display the images associated with the product. The images have been stored in the notes area of the record.<\/p>\n

To present this as a scrolling carousel, choose the horizontal gallery layout.<\/p>\n

\"Mixed<\/p>\n

Set the Data source of this gallery control to point to the notes of the selected product from the product gallery.<\/p>\n

\"Mixed<\/p>\n

To display the image, we set the source of the image control to the document field of the note.<\/p>\n

The files uploaded as notes are stored in base64 format in the document field.<\/p>\n

The image control support Data URI format. Data URI format is a combination of the mimetype of the file along with the base64 value.<\/p>\n

We get the base64 value from the document field, to this we concatenate the mimetype to generate the data uri.<\/p>\n

Concatenate(“data:image\/jpg;base64,”, ThisItem.Document)<\/p>\n

\"Mixed<\/p>\n

To get the navigation buttons to show up change the following settings of the gallery:<\/p>\n

\"Mixed<\/p>\n

Now we can see the images stored in notes in CDS within a gallery in a canvas app.<\/p>\n

To be able to visualize this image in your surrounding we now need to go ahead and add the Mixed Reality component.<\/p>\n

To see these components in your list in the canvas studio, make sure to enable the feature:<\/p>\n

File -> Settings -> Experimental Features -> Mixed Reality features.<\/p>\n

\"Mixed<\/p>\n

Once enabled, you should now see the following components available to add.<\/p>\n

\"Mixed<\/p>\n

Select the View in MR component and add it outside the Preview Gallery control as shown below:<\/p>\n

\"Mixed<\/p>\n

You can visualize the following types of data using the View in MR control:<\/p>\n