Wednesday, May 15, 2019

Save Pen Input , Images into SharePoint using Power Apps and Flows

Save Pen input or Image into SharePoint using power apps and flows

1. Create flow

New --> Create from template -- > select upload a photos to SharePoint folder

            get  file name and file content from power apps button trigger:

            get and set file Name:

              Add action -- > Data Operation(composed)

              triggerBody()['file']['name']
           
            get and set file content:

            Add action -- > Data Operation(composed)

            base64ToBinary(triggerBody()['file']['contentBytes']) 


          Create file:
                         
            Site address:  siteUrl
            Library:         pictureLibarry
            File:               test.jpg
            ContetBytes:

Save flow

2.power app button trigger switch to flow (pass file from power apps to flow)

open the Url: https://flowstudio.app/

open the above link and right click on file display of the flow and change the JSON definition of the trigger.manual.kind from "Button" to "PowerApp".

3.create a power app screen which contains text input, pen input and button controls

add below code button onSelect

Patch(PowerAppsImages, Defaults(PowerAppsImages), {Title: txtTitle.Text, MyImageData: PenSignature.Image });

PowerAppsFlowUploadImage.Run({file:{name:"Test.jpg",contentBytes:PenSignature.Image}});

Patch command save metadata into sharepoint list (PowerAppsImages) and file pass to flow
flow read the file and save into library and metadata into list.

Below link for reference:
http://johnliu.net/blog/2018/7/the-simplest-no-code-solution-to-save-pictures-files-from-powerapps-to-flow

1 comment:

  1. An easy and multi-purpose solution is found to add pen-input to Sharepoint thanks to Shane Young, utilizing the addition of a PowerApps Json functionality added on 02/05/2019.

    The Short description on how to make this work is to save the pen input image in a JSON format asking the JSON function to include Binary Data:

    Set( PenVar, JSON( PenInput1.Image,JSONFormat.IncludeBinaryData ) );

    See here for details: https://iiu.dk/2019/10/12/powerapps-pen-input/

    ReplyDelete