From Xojo Documentation
|You are currently browsing the old Xojo documentation site. Please visit the new Xojo documentation site!|
New in 2020r1
Displays a picture either from a project item, one assigned at runtime, SVG data or via a URL.
The WebImageViewer appears as a rectangular area on a WebPage in the Web Page Layout Editor. If no image is assigned, then a placeholder icon is displayed in the center. If an image from your project is specified, it is shown in both the Layout Editor and the built application. The WebPage Layout Editor cannot render SVG data in the IDE.
Manipulating The Picture
You cannot directly manipulate the Picture property as it is actually a WebPicture, not a regular Picture object. What you must do instead is create a new Picture using the Picture property as the source, manipulate the new picture then assign it back to the Picture property to update it. The Picture property will automatically convert a WebPicture into a Picture and back again.
Here is an example:
p.Graphics.DrawPicture(ImageViewer1.Picture, 0 ,0)
p.Graphics.DrawingColor = Color.Red
p.Graphics.FillRectangle(0, 0, 100, 100) // Change the Picture
ImageViewer1.Picture = p // Automatically converts Picture to WebPicture
Optimizing Your Use of Pictures
Pictures that are stored in properties of objects that are sent to the browser (like properties of web pages and controls) are cached locally on the client web browser. If you are always displaying the same picture on a page (or different pages), you can significantly improve performance by caching your picture so that it is not repeatedly sent to the web browser.
For example, if you are creating a custom button control using a subclass of an WebImageViewer control, you could store the two images (normal and pressed states) in two picture properties of the ImageView subclass so that those pictures are only sent to the browser once.
VerticalAlign and HorizontalAlign Values
Use these class constants with the VerticalAlign and HorizontalAlign properties.
This example displays a picture (FunnyCat) that has been added to your project: