How to Add a Picture to a Collection in PowerApps
Often times you want to give your user the ability to add pictures into your app and display them to the user. Once you have the pictures you could then email them or save them to a database or SharePoint. In this tutorial I will show you step by step how to add a picture to a collection in PowerApps and then display them in a gallery. Perhaps in a future tutorial I can show you how to email or save the files. For now lets get them into your gallery. Continue reading and you too will be an office power user!
This tutorial consists of 4 controls. A media add picture control to select your picture. A text input to allow you to give the picture a name. A button to add the picture to a collection and finally a gallery to display the picture and file name. Note: when inserting a media add picture control you will see that it actually creates a group with the media button as well as an image control.
Media Control, Text and Button
- Media Add Picture Control
- X: 81
- Y: 118
- Width: 471
- Height: 321
- Text Input
- Name: txtPictureName
- Default: AddMediaButton1.FileName
- Button
- Text: “Add Picture”
- X: 367
- Y: 454
- Width: 185
- Height: 53
- OnSelect:
Collect(
colPictures,
{
ThePicture: AddMediaButton1.Media,
FileName: txtPictureName.Text
}
);
Reset(AddMediaButton1);
Reset(txtPictureName)
Gallery Control
- Gallery (Vertical with an image)
- Items: colPictures
- X: 597
- Y: 91
- Width: 485
- Height: 575
- TemplateSize: 133
- Image: (In the gallery.)
- Image: ThisItem.ThePicture
- Label (In the gallery.)
- Text: ThisItem.FileName
- Remove the additional label and icon that PowerApps automatically adds in.
After completing this quick tutorial you now know how to add a picture to a collection in PowerApps! Want to use your picture collection in a picture carousel? Read my post on how-to-create-a-picture-carousel-in-powerapps/
Please leave your feedback. I hope this article has been helpful for you so bookmark this blog as new articles will be posted regularly.
