Table of Contents

Getting Started with TMS FNC Hot Spot Image

Use TTMSFNCHotSpotImage when an image needs selectable or hoverable regions with their own appearance and names.

Create Hot Spots

  1. Drop TTMSFNCHotSpotImage on the form.
  2. Assign the base image through the inherited image properties.
  3. Add rectangle, ellipse, path, or polygon hot spots.
  4. Handle selected or hovered hot spot events when the application should react to a region.
var
  hs: TTMSFNCHotSpot;
begin
  TMSFNCHotSpotImage1.HotSpots.Clear;

  hs := TMSFNCHotSpotImage1.AddRectangleHotSpot(RectF(40, 40, 180, 120), 'Header');
  hs.Selectable := True;
  hs.ShowOnHover := True;
  hs.ShowHoverName := True;

  TMSFNCHotSpotImage1.SelectedHotSpot := TMSFNCHotSpotImage1.GetHotSpotIndexByName('Header');
end;

Open the Editor

Use TTMSFNCHotSpotImageEditor to edit hot spots at runtime.

var
  Editor: TTMSFNCHotSpotImageEditor;
begin
  Editor := TTMSFNCHotSpotImageEditor.Create(Self);
  try
    Editor.HotSpotImage := TMSFNCHotSpotImage1;
    Editor.Execute;
  finally
    Editor.Free;
  end;
end;

Next Steps

Task Guide
Add hot spots and configure selection behavior Hot spots and editor
Open the runtime editor Hot spots and editor