Bitmap Display and Sizing

TTMSFNCImage displays a bitmap with FNC layout and styling support. Use it for icons, thumbnails, previews, and image areas that need consistent behavior across supported frameworks.

Assign a Bitmap

Use BitmapContainer and Bitmaps when the image is part of a shared asset set. Assign Bitmap directly when the image belongs only to this control.

procedure TForm1.ConfigureImage;
begin
  TMSFNCImage1.BitmapContainer := TMSFNCBitmapContainer1;
  TMSFNCImage1.Center := True;
  TMSFNCImage1.Stretch := False;
  TMSFNCImage1.AspectRatio := True;
end;

The control exposes both Bitmap and Bitmaps; Bitmaps is useful for scaled bitmap sets, while Bitmap is the direct image surface.

Control Image Fitting

AspectRatio preserves proportions, Stretch fills the available area, Center keeps non-stretched images centered, and Cropping lets the image fill the rectangle while clipping overflow.

procedure TForm1.ConfigureImageFitting;
begin
  TMSFNCImage1.AspectRatio := True;
  TMSFNCImage1.Stretch := True;
  TMSFNCImage1.Center := True;
  TMSFNCImage1.Cropping := False;
  TMSFNCImage1.BitmapMargins.Left := 8;
  TMSFNCImage1.BitmapMargins.Right := 8;
  TMSFNCImage1.BitmapMargins.Top := 8;
  TMSFNCImage1.BitmapMargins.Bottom := 8;
end;

Use BitmapMargins to reserve space around the rendered bitmap without changing the control bounds.

React to Bitmap Changes

Handle OnBitmapChanged when other UI state depends on the image, such as enabling a save command or recalculating a preview.

procedure TForm1.ConfigureImageChangeHandling;
begin
  TMSFNCImage1.OnBitmapChanged := TMSFNCImage1BitmapChanged;
end;

procedure TForm1.TMSFNCImage1BitmapChanged(Sender: TObject);
begin
  TMSFNCImage1.Tag := TMSFNCImage1.Tag + 1;
end;

Combining shared container, fitting mode, and change handling

The following example loads a bitmap from a container, centers and proportionally scales it, and reacts when the image is swapped at runtime:

procedure TForm1.FormCreate(Sender: TObject);
begin
  TMSFNCImage1.BitmapContainer := BitmapContainer1;
  TMSFNCImage1.BitmapName      := 'product-photo';
  TMSFNCImage1.AspectRatio     := True;
  TMSFNCImage1.Stretch         := True;
  TMSFNCImage1.Center          := True;
end;

procedure TForm1.TMSFNCImage1BitmapChanged(Sender: TObject);
begin
  // Enable the save button only when a real image is loaded
  btnSave.Enabled := not TMSFNCImage1.Bitmap.IsEmpty;
end;

procedure TForm1.lbThumbsClick(Sender: TObject);
begin
  // Swap to another bitmap from the same container
  TMSFNCImage1.BitmapName := lbThumbs.Items[lbThumbs.ItemIndex];
end;

Layout Checklist