cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
haniel
Level 8

Truly No-Code Solution for Saving Photos from PowerApps using Flow

I've recently been working on a project that requires saving photos taken by PowerApps to either OneDrive, SharePoint, or any other system that can be connected to using PowerApps or Flow for that matter.  There are some great examples available on the web, such as Paul Culmsee's video from down under on How to Save  Photos from PowerApps to SharePoint via Flow that doesn't use any code but does require you to fiddle around with REST API calls, which is not everyone's cup of tea.  Still, I wasn't convinced that life needs to be this difficult.  There surely had to be easier way to store a photo from PowerApps.

 

Well, after some trial and error, I finally came up with a very simple solution that does exactly that.  Here's how it goes.

 

Creating the PowerApp Form

To show you how to build this solution, you only need two controls - a Camera and a Gallery

 

 

 

PowerApps.png

 

Camera

The camera control, MyCamera, is used to capture the photo from your device's camera.  Once captured, it gets stored in the Gallery for further processing.  The only property you need to set is the OnSelect, which is invoked when you click on the camera control.

 

Collect(PhotoGallery,{Photo:MyCamera.Photo,Title:Text(Now(), DateTimeFormat.UTC)})

 

What the line above does is Collect (or save) the photo from MyCamera and store it in PhotoGallery.  The new photo entry in the PhotoGallery should have the same photo as in MyCamera and the title of the photo should be set to Coordinated Universal Time (UTC).

 

Gallery

The PhotoGallery can be any gallery type.  Once you add it to the screen, make sure to change the Data source to point to PhotoGallery because that is where the camera saves the photos into (see Camera configuration above).

 

GalleryDataSource.png

 

 

 

Next, select the SaveImage icon and from the Action ribbon at the top, select Flows and create a new Flow.  At this point, we switch over to Flow, but will return shortly to finish one last step for your new PowerApp.

 

Flow

Once you log in, Flow will automatically start a new Flow.  The trigger will automatically be set to PowerApps.  As an action you now need to select the destination you want to save the photo to.  I decided to use my OneDrive for Business and created a folder called PowerApps Photos ahead of time.  So the action I chose was OneDrive for Business - Create file.

 

Flow.PNG

 

 

 

In the flow, you will need to click on the File Content field and then Ask in PowerApps to create a parameter for the flow.  Repeat the same step for all the parameters you need.  Now if you try to save the mage content as it is provided from PowerApps, you will notice that it's actually plain text.  The reason is that the gallery stores the images in a Data URI schema.  To get the actual image format, you need to convert it to binary using the dataUriToBinary() function.  Therefore, the File Content field should be set to the following Expression:

 

dataUriToBinary(triggerBody()['Createfile_FileContent'])

Save you flow (I used the name SavePhoto for mine) and return to your PowerApp.

 

Finishing the Solution

Now, select the SaveImage icon inside the MyGallery and set the OnSelect property to

 

SavePhoto.Run(Title,Photo)

This command tells PowerApp to invoke the SavePhoto flow and pass it the title of the images for the file name and the photo as the content).

 

Here are the settings of the PowerApps controls once more

Control

Name

Property

Value

Camera

MyCamera

OnSelect

Collect(PhotoGallery,
{Photo:MyCamera.Photo,
Title:Text(Now(), DateTimeFormat.UTC)})

Gallery

MyGallery

Data

PhotoGallery

Image

CapturedImage

 

 

Label

CapturedTitle

 

 

Icons

SaveImage

OnSelect

SavePhoto.Run(CapturedImage.Image)

 

Good luck!

60 REPLIES 60
paul_culmsee
Level 8

Re: Truly No-Code Solution for Saving Photos from PowerApps using Flow

Thanks for the shout-out and agree that this is a great technique. You can also send an entire gallery this way by using the concatenate function.

 

The reason I moved away from this approach, is that the DataURI method doesn't work for the native camera control, and if I recall the PowerApps studio for windows saves the photos as blob references, not data URI... 

 

That said, if you are using the native camera control this is definitely the recommended approach...

 

 

regards

 

Paul

jsarnold
Level 8

Re: Truly No-Code Solution for Saving Photos from PowerApps using Flow

I am excited to try this!! 

 

Thank you for the detailed write up! 

 

haniel
Level 8

Re: Truly No-Code Solution for Saving Photos from PowerApps using Flow

HI @paul_culmsee,

 

Thanks for the feedabck and sorry for misspelling your name.  I fixed it Smiley Happy

 

The different controls that offer similar functionality can be a bit confusing to some uses, especially because the result is not getting stored in the same format.

 

That said, there's always more than one way to solve a problem.  Glad to be able to build on your experience and offer some thoughts of my own.

 

Regards,

sassyx65
Level: Powered On

Re: Truly No-Code Solution for Saving Photos from PowerApps using Flow

Just what I needed!  Thank you so much for taking the time to research and share.

Highlighted
Super User
Super User

Re: Truly No-Code Solution for Saving Photos from PowerApps using Flow

Hi @haniel,

 

Great write up! This is just what I was looking for. I am getting some problems though.. I copied you completely to test it before implementing it into my app. Everything is good up until the saving part. It doesnt save because the OnSelect of my SaveImage icon says "Invalid number of arguments." I'm not sure if I should be putting "SavePhoto.Run(Title,Photo)" or "

SavePhoto.Run(CapturedImage.Image)" for OnSelect, but neither work. I know my flow is working because I ran it and it create a blank .jpg file. Any help would be appreciated, thanks.

Super User
Super User

Re: Truly No-Code Solution for Saving Photos from PowerApps using Flow

paul_culmsee
Level 8

Re: Truly No-Code Solution for Saving Photos from PowerApps using Flow

I'd be willing to bet you might have clicked "Asd in PowerApps" more than once when you created your flow and now it wants more params than you are sending... 

 

haniel
Level 8

Re: Truly No-Code Solution for Saving Photos from PowerApps using Flow

Hi @ShanP,

 

I sent a reply, not sure where it ended up though Smiley Happy

To @paul_culmsee's point, you may not have clicked the Ask in PowerApps to create a parameter or you may have pressed it too many times so that it's expecting more than one parameter.  

 

In your solution, when you go to the SaveImage icon, click on the word Title in SavePhoto.Run(Title,Photo).  You should see a hover help message pop up above that shows all the parameters and highlights the one representing the title.  In this example, the help text should look like Run(Createfile_FIleName, Createfile_FileContent).  If it does not, then your parameters are mixed up.

 

Hope this helps.

Super User
Super User

Re: Truly No-Code Solution for Saving Photos from PowerApps using Flow

Hii @haniel,

 

Yes, the parameters are giving me problems. When I hover over, all I see is Createfile_FileName and not Createfile_FileContent. When I set dataUriToBinary(triggerBody()['Createfile_FileContent']) as an expression amd I run the flow and I get this error:

 

Unable to process template language expressions in action 'Create_file' inputs at line '1' and column '1729': 'The template language expression 'dataUriToBinary(triggerBody()['Createfile_FileContent'])' cannot be evaluated because property 'Createfile_FileContent' doesn't exist, available properties are 'Createfile_FileName'. Please see https://aka.ms/logicexpressions for usage details.'.

 

Any ideas?

Helpful resources

Announcements
firstImage

Watch Sessions On Demand!

Continue your learning in our online communities.

Power Platform 2019 release wave 2 plan

Power Platform 2019 release wave 2 plan

Features releasing from October 2019 through March 2020

FirstImage

Power Platform World Tour

Coming to a city near you

thirdimage

PowerApps Community User Group Member Badge

Fill out a quick form to claim your user group badge now!

FourthImage

Join PowerApps User Group!!

Connect, share, and learn with your peers year-round

SecondImage

Power Platform Summit North America

Register by September 5 to save $200

Users Online
Currently online: 158 members 4,604 guests
Recent signins:
Please welcome our newest community members: