Displaying local images in a web program

Targets Web
1

I’d like to display local images on the server in a xojo web program: where should I place them, and what path should I use to get the webpicture?
In Run mode and in compiled mode.
Thanks.

2

You have to serve the files somehow.

If you use Lifeboat you can offload the file serving to nginx, which is a much better file server than Xojo (and the recommended route by the developers who built the framework). Here, you’d use the URL configured by Lifeboat.

You can also write a routine in HandleURL to serve the images. You would then use the path to whatever that HandleURL function is going to expect. Note that the framework was not built to handle this well, and that time serving images is time taken away from every other session.

1 Like
3

You can load it from anywhere you want and use the Picture.Open to return and convert it to a WebPicture. This shows a test using your Home folder.

Var MyPicture As WebPicture
Var pictfile As FolderItem

pictfile=SpecialFolder.UserHome.Child("test.png")
MyPicture=Picture.Open(pictfile)  'picture converts to webpicture

ImageViewer1.DisplayMode=WebImageViewer.DisplayModes.ScaleAspectFit
ImageViewer1.Picture=MyPicture
ImageViewer1.Visible=True
4

I see people copying the images into Resources folder.

SpecialFolder.Resources.Child(…)

5

You can go ahead and create a WebPicture the way @Richard_White describes.

The only thing to mention is, if you want to allow the user to download that image by requesting its WebPicture.URL, then you’ll have to keep an instance somewhere. Otherwise, the URL won’t work anymore as soon as the WebPicture instance goes out of scope.

Here is a little sample project:
webpicture-sample.zip (202.4 KB)

6

Thanks, I understand how it works. The WebPicture displays fine, and I’ll look into LifeBoat.
But my goal is to use a WebListBoxImageRenderer, and I can’t get the image to display in a cell.

7

Oh then you definitely need to keep a reference to the WebPicture around…

8

Have you looked at the example that ships with Xojo?

image
image597×205 20.7 KB

Note: for me the images are missing, but adding some images it works:

image
image604×291 16.3 KB

9

This works (from the Xojo example):

Me.AddRow(“”)
Var pic As New WebListBoxImageRenderer
pic.URL = “https://www.publicdomainpictures.net/pictures/120000/nahled/small-waterfall-in-forest.jpg”
Me.CellTextAt(1,0) = pic

but not this:

Var pictureFile As FolderItem = SpecialFolder.Resource(“example.jpg”)
var mpic as WebPicture
mPic = Picture.Open(pictureFile)
mPic.MIMEType = “image/jpeg”
Me.AddRow(“”)
Var pic As New WebListBoxImageRenderer
pic.URL = mPic.URL
Me.CellTextAt(1,0) = pic

10

Can you give more information about it? How doesn’t work? Do you get an error? or simply the page renders without the picture?

11

The WebPicture is going out of scope, as was mentioned. It needs to be a property that stays around for as long as you need the user to be able to see the image.

1 Like
12

zPic is a Property of the WebPage

Var pictureFile As FolderItem = SpecialFolder.Resource(“example.jpg”)
zPic = Picture.Open(pictureFile)
Me.AddRow(“”)
Var pic As New WebListBoxImageRenderer
pic.URL = zPic.URL
Me.CellTextAt(1,0) = pic

–> It doesn’t work either (the page renders without the picture)

13

Can you create a sample project, zip it and upload on a post?
Someone will review and give you a better idea to solve the problem.

14

Maybe the problem is that you need Me.CellRendererAt instead?
What version of Xojo are you using?