How to preview an image stored in a local variable?

Hi everyone.

So bassicaly what im trying to do is to preview an image stored in a local variable.

I have been researching already and for what I saw the best option to do this is using the "External" image property and get the image from a url, but im not finding anywhere how to do this.



If someone could send an OML example or explain how to do this it would be great, because im new to this platform and im still learning/exploring it.


Note: If you think that this isn't the best option fell free to suggest another approach.


Im using outsystems 11 and this is for a tradicional web app.


Cheers.


Hi Leonardo,

Here is the OutSystems success document that describes how to do it properly:

https://success.outsystems.com/Documentation/11/Developing_an_Application/Design_UI/Images/Display_an_Image_Stored_in_the_Database

Regards,

Daniel

Daniël Kuhlmann wrote:

Hi Leonardo,

Here is the OutSystems success document that describes how to do it properly:

https://success.outsystems.com/Documentation/11/Developing_an_Application/Design_UI/Images/Display_an_Image_Stored_in_the_Database

Regards,

Daniel

This wont work for me because i want to get the image from a local variable not from a database entity.

Vincent Koning wrote:

Check this thread. It describes what you want to achieve: https://www.outsystems.com/forums/discussion/39963/binary-data-to-image-display-in-web-page/

I have already seen that discussion, it was there that i saw this url thing but i didnt understood how they create that url and all the steps around it.


Hi Leonardo,

Not sure what your real requirement is, what do you mean by 'preview' and why exactly do you insist that it has to be coming from a local variable.  And what does this local variable hold ?  The place on the internet that this image lives, a base64 representation of this image, the binary content of this image,... ?  And how does that local variable get populated ? 

If we know answers to this type of questions, we can better help you.

Just for your inspiration, and to maybe better understand your own requirements, here are some possible ways to get an image onto a Outsystems screen.  Each with it's own advantages and drawbacks.  

See attached oml, it has a dependency on the outsystems sample database.

Hope this clarifies for you what you want to accomplish,

Dorine

Solution

Hi Leonardo


I helped another member of this community with a similar problem:

https://www.outsystems.com/forums/discussion/55217/upload-picture-using-file-upload-widget-and-display-the-picture/#Post208456


Just adding some more information that could be helpfull for you. However, check Dorine suggestion. It seems very complete.


Best Regards,


João Delgado

Solution

Dorine Boudry wrote:

Hi Leonardo,

Not sure what your real requirement is, what do you mean by 'preview' and why exactly do you insist that it has to be coming from a local variable.  And what does this local variable hold ?  The place on the internet that this image lives, a base64 representation of this image, the binary content of this image,... ?  And how does that local variable get populated ? 

If we know answers to this type of questions, we can better help you.

Just for your inspiration, and to maybe better understand your own requirements, here are some possible ways to get an image onto a Outsystems screen.  Each with it's own advantages and drawbacks.  

See attached oml, it has a dependency on the outsystems sample database.

Hope this clarifies for you what you want to accomplish,

Dorine

Ty for trying to help.

Not sure what your real requirement is, what do you mean by 'preview' and why exactly do you insist that it has to be coming from a local variable. 

-It has to be coming from a local variable because im saving the images that the user upload in a local list variable to then show them in a list record widget.


 And what does this local variable hold ?  

-This local list variable holds the images that he uploaded.


The place on the internet that this image lives, a base64 representation of this image, the binary content of this image,... ?  And how does that local variable get populated ? 

-Im trying to show the the binary content saved on the list.


Just for your inspiration, and to maybe better understand your own requirements, here are some possible ways to get an image onto a Outsystems screen.  Each with it's own advantages and drawbacks.  

See attached oml, it has a dependency on the outsystems sample database.

-Ty for these examples, i think that the best example for what im trying to do is the Base64 String, because when i try to do like you did in your "Uploaded by user" example i get these error:



I think that i will use a for each cycle and convert all the pictures to binary64 and it should do the job.


Thank you again for your help.

Cheers

João Delgado wrote:

Hi Leonardo


I helped another member of this community with a similar problem:

https://www.outsystems.com/forums/discussion/55217/upload-picture-using-file-upload-widget-and-display-the-picture/#Post208456


Just adding some more information that could be helpfull for you. However, check Dorine suggestion. It seems very complete.


Best Regards,


João Delgado

Hi João

Ty for trying to help, it seems interesting as well, i will give it a look to.


João Delgado wrote:

Hi Leonardo


I helped another member of this community with a similar problem:

https://www.outsystems.com/forums/discussion/55217/upload-picture-using-file-upload-widget-and-display-the-picture/#Post208456


Just adding some more information that could be helpfull for you. However, check Dorine suggestion. It seems very complete.


Best Regards,


João Delgado

Hi again João ty so much for your help, i just changed the name of the variable to be converted frorm your example an it worked like a charm, if you were here i would buy you a beer or a coffe right now, i have been around this almost 3 days already and the solution was this easy.


The code:



The result:



Leonardo Abrantes wrote:


-It has to be coming from a local variable because im saving the images that the user upload in a local list variable to then show them in a list record widget.

-This local list variable holds the images that he uploaded.

-Im trying to show the the binary content saved on the list.

-Ty for these examples, i think that the best example for what im trying to do is the Base64 String, because when i try to do like you did in your "Uploaded by user" example i get these error:



I think that i will use a for each cycle and convert all the pictures to binary64 and it should do the job.


Thank you again for your help.

Cheers

Judging by your answers, the example with upload from user is what you need.  

The upload widget delivers a binary, you can store that in a variable, and then show it.  I think what you may still be missing, is that you are trying to somehow fabricate a url.  You don't need a url, you already have the whole binary available to you.  So image parameter "Image Type" should be set to Binary Data, not External URL.


There really is no need to first turn everything into Base64, only to create a url to show the image.


Dorine

Dorine Boudry wrote:

Leonardo Abrantes wrote:


-It has to be coming from a local variable because im saving the images that the user upload in a local list variable to then show them in a list record widget.

-This local list variable holds the images that he uploaded.

-Im trying to show the the binary content saved on the list.

-Ty for these examples, i think that the best example for what im trying to do is the Base64 String, because when i try to do like you did in your "Uploaded by user" example i get these error:



I think that i will use a for each cycle and convert all the pictures to binary64 and it should do the job.


Thank you again for your help.

Cheers

Judging by your answers, the example with upload from user is what you need.  

The upload widget delivers a binary, you can store that in a variable, and then show it.  I think what you may still be missing, is that you are trying to somehow fabricate a url.  You don't need a url, you already have the whole binary available to you.  So image parameter "Image Type" should be set to Binary Data, not External URL.


There really is no need to first turn everything into Base64, only to create a url to show the image.


Dorine

Hum i'm understending you but i dont have the "Binary Data Image type"  or maybe i have but i dont know where, like i said im new to outsystems.


The image types that appears to me:


Leonardo Abrantes wrote:



Ok, i see where I went down the wrong rabbit whole, I'm looking at reactive web, you need a solution for Traditional.  


Dorine Boudry wrote:

Leonardo Abrantes wrote:





Ok, i see where I went down the wrong rabbit whole, I'm looking at reactive web, you need a solution for Traditional.  


Yup, this is a tradicional web app, but no problem and thank you for at least trying to help.


Leonardo,


Glad I could help you! 


Best Regards,


João Delgado