Showing results for 
Search instead for 
Did you mean: 
Helper IV
Helper IV

My Use of Components

Hi all.


I have a quick question regarding my use of a component in an app I'm developing. I wanted to get opinions on whether or not I'm using it correctly.


The app I'm developing is a pricing tool for our sales team.

In simple terms.... Screen 1 has a gallery Quotes, Screen 2 has a gallery of Products in each quote and Screen 3 has a gallery of Items in each product. Screens 2 and 3 only show the products/items relating to the quotes/products selected in the previous screens.


The app allows users to enter new quotes, new products and new items that in turn build a price which ultimately gives a total quote price back to Screen 1.


What I am also trying to do is create a 2D visual of what the product looks like, which will be on Screen 4. This is where I'm using the component idea. Note that our product is a switchboard or electrical cabinet that will have a number of sections bolted together side by side.


At present my component has 8 blank images positioned side by side. Each of these images will represent the Item or Items selected in Screen 3.

So when the 1st Item selected on Screen 3, an image will appear in position 1 in the component. It would be a different image depending on the selection. And so on and so forth up to a max of 8 sections for now.

The component has variables built into it that change depending on the images which automatically sizes/scales the images to fit flush with each other and in the screen.


It seems to work quite well for me and allows me to automatically and dynamically create a basic 2D view of the product.


I've read lots of stuff on components and it seems to mainly focus on areas where icons and fields are used regularly, like headers, navigation panels and so on. So I guess I was wondering am I using the components correctly or is there a better way for me to do what I'm doing?


I hope I've explained it well enough....



Community Support
Community Support

Hi @barrymac20 ,

Could you please share a bit more about the Component control that you mentioned? Do you build up your Component using PCF script or within a canvas app directly?

Could you please share more details about the Items Gallery in your Screen3? Could you please show more details about your data source?


Based on the needs that you mentioned, I think it is not necessary to build up a Component to achieve your needs. I think the Gallery control could achieve your needs. You could consider add a Gallery (in Image Layout) within your Screen4 to display the image of the selected item within the Screen3.


Within the Screen3 Gallery, add a Checkbox, set the OnCheck property to following:

Collect(ItemImageCollection, {ItemName: ThisItem.ItemNameField, ImageData: ThisItem.ImageField})

Set the OnUncheck property to following:

         ItemName = ThisItem.ItemNameField

set the OnVisible property of Screen3 to following:



Within the Screen4, set the Items property of the Gallery to following:


set the Image property of Image control to following:



Note: I assume that you have added Image Type field in your data source to store the image data for each item of Product.


Best regards,


Community Support Team _ Kris Dai
If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.

I have built the component in the canvas app


The data source is excel. I have a table for quotes, one for products and one for sections. Have another table for lists for dropdowns.


I did think about the option of using the gallery to show the images but as the images would be different widths I didn't think it would be possible within the gallery to do that?


The images are stored in a Sharepoint list.

Hi @barrymac20 ,

Do you want these images to be resized automatically within your Gallery based on its own width?


If you want these images to be resized automatically within your Gallery based on its own width, I afraid that there is no way to achieve your needs in PowerApps currently.


Currently, there is no way or function to detect the width of the image, and adjust it as appropriate size. Please check and see if the following article would help in your scenario:


Best regards,



Community Support Team _ Kris Dai
If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.

Thanks for getting back to me.


I figured that wouldn't work in a gallery and that's why I went down the route of using components.

Maybe I've inadvertently created a method for doing this...... MICROSOFT!! 🙂



Helpful resources

Ignite 2022


Explore the latest innovations, learn from product experts and partners, level up your skillset, and create connections from around the world.

Power Apps Africa Challenge 2022

Power Apps Africa Challenge

Your chance to join an engaging competition of Power Platform enthusiasts.

Users online (1,826)