PictureBox

Represents an image control.

The PictureBox control displays graphics from bitmap, metafile, icon, JPEG, GIF, or PNG files.

Set the Image property to display an image at design time or runtime. Alternatively, specify the image using the ImageSource property and load it synchronously with the Load method or asynchronously with LoadAsync.

For a full list of properties, methods and events see the API documentation.

Features

Size Modes

The SizeMode property manages image placement and control sizing with several preset configurations:

  • AutoSize: The PictureBox is sized equal to the size of the image that it contains.

PictureBox demonstrating AutoSize mode with image at original dimensions
  • CenterImage: The image is centered in the PictureBox. If the image is larger, it is centered and the outside edges are clipped.

PictureBox showing CenterImage mode with centered image placement
  • Cover: The image is resized to cover the entire container, maintaining aspect ratio while potentially cropping edges.

PictureBox displaying Cover mode with image filling the entire container
  • Normal: The image is placed in the upper-left corner. The image is clipped if larger than the PictureBox.

PictureBox showing Normal mode with image aligned to top-left
  • Stretch: The image is stretched or shrunk to fit the size of the PictureBox.

PictureBox demonstrating Stretch mode with image scaled to fit
  • Zoom: The image is scaled maintaining its aspect ratio.

PictureBox showing Zoom mode with proportionally scaled image

Advanced

JavaScript Widget

Item
Description

Class name

"wisej.web.PictureBox"

Theme appearance

"picturebox", see Themes.

Child components

"image" is the image element. See JavaScript.

Last updated

Was this helpful?