Unanswered

How to use images from local in PCF control?

(0) Share

Report

Posted on by rbn_nue

Hi Folks,

I'm trying to build a PCF control for canvas app. I have 2 or 3 images which I would like to use which are stored in folder inside the control folder.

I'm then referring the image inside the react component as below:

This works fine when debugging locally using 'nom start watch'. But when I deploy the control into a canvas app, images are not loading. What am I missing here?

Thanks

Categories:

Power Apps Pro Dev & ISV

I have the same question (1)

All responses (5)

Answers (0)

a33ik 3,306 Most Valuable Professional on at

Like (1)

Report
Copy link

Link copied!

Hello,

Please check the following post - https://benediktbergmann.eu/2020/04/22/pcf-how-to-use-images-in-component/

Was this reply helpful? Yes No
rbn_nue on at

Like (0)

Report
Copy link

Link copied!

Hi @a33ik

Thanks for the response. I did check the article. It is implemented for MDA. I'm looking for options in PCF for canvas app. I had tried the method mentioned in the article but it does not work. I checked the MS documentation for img element and it seems only available for MDA:

https://learn.microsoft.com/en-us/power-apps/developer/component-framework/manifest-schema-reference/img

Is there any other way to use images in PCF (from local)?

Thanks

Was this reply helpful? Yes No
Diana Birkelbach 3,072 Most Valuable Professional on at

Like (0)

Report
Copy link

Link copied!

Hi @rbn_nue ,

The solution from the blog is not only for model-driven apps.
You define the image in the manifest, and read the content in the code using gerResource.
The docs for getResource() is for all app types: https://learn.microsoft.com/en-us/power-apps/developer/component-framework/reference/resources/getresource?WT.mc_id=BA-MVP-5004107

Hope it helps!

Was this reply helpful? Yes No
rbn_nue on at

Like (0)

Report
Copy link

Link copied!

Hi @DianaBirkelbach

Thanks for the response. I had again tried the methods (this time I used a png image). It did not work as expected. Also, in the documentation it is actually mentioned getResource is available for MDA only:

Thanks

Was this reply helpful? Yes No
Diana Birkelbach 3,072 Most Valuable Professional on at

Like (1)

Report
Copy link

Link copied!

Hi @rbn_nue ,
You are right! I've used it only inside MDA until now. My bad!

As a workarround, I guess you could pass the image to the PCF from the Canvas App, through the PCF parameters.
In case I find a better solution I'll let you know.

Was this reply helpful? Yes No