PowerApps – Image Capture
PowerApps is a new product added to Microsoft’s Office365 rack through which, we can develop a mobile application leveraging data of a SharePoint list from Web. It supports all basic features offered by any latest Smartphone.
In this blog, we are going to explore a scenario where we have a need to display an image on a detail screen. User can add a new image or change existing image from another screen where new image will be captured through Camera. Its implementation has made to be straight forward after spending fair amount of time on the research.
We will start with the Detail screen where we have displayed an Image from the SharePoint list. If there is no image set already, we will add a new Image. Else, we will change the existing image. In both the cases, we will navigate to Camera screen where we will capture the Image and pass it back to Detail screen.
Displaying an Image
Below is a Detail screen where Image will be displayed from SharePoint List.
1. On click of this icon, App sends the data to SharePoint List by submitting the form. Other statement cleans up the global Variable varPic1. Usage of this will be explained in next section.
2. On click of this button, it will navigate to Camera screen shown in Figure 2.
3. This is an Image control and will display the image conditionally i.e. if the global variable varPic1 is empty or blank, its data source will be the Picture1 field of the SharePoint list item currently being added/edited.
Capturing an Image
Image will be captured from a Camera screen as shown below.
1. This is a Camera control. When user taps on it, an image will be captured which will be set to the global variable varPic1 using Set method.
2. This is an Image control to show a preview of a captured image which takes the value from the global variable varPic1.
3. On click of this button, it will navigate to the Detail screen.
Here is the summary to conclude:
• A global variable is set with an image captured from the camera screen.
• Detail screen will display an Image from the global variable as it is not empty.
• After of submitting the data to SharePoint list along with the added/changed image, the global variable is cleared.
• Next time, when user opens the same record in Detail screen, a global variable will be empty. Hence, it will display the image already there in the SharePoint list item.