Delphi Form Activator with Thumbnail Preview and Navigate

Visual "WindowMenu"

Are you familiar with the "Quick Tabs" feature of Internet Explorer 7? When you have lots of tabs (URLs) open, Quick Tabs make it easy to quickly find, navigate to or close a particular web page.

"Quick Tabs" for (MDI) Delphi applications!

Here's an idea for your (next) Delphi killer application: provide a user with a visual way to navigate and select any already open (MDI child) form by displaying a thumbnail form image in a scrollable list.

The code I will present displays a thumbnail image (resized form image) for all the opened MDI child forms in an MDI Delphi application.

Note that you can use the same approach for any type of a Delphi application: MDI or SDI.

Visual Form Navigator & Activator

We'll start with an empty form hosting a TScrollBox, a TTimer and a TShape Delphi controls along with a TButton and a few TLabels.

The form is named "FormSelectorForm", in a scroll box a collection of TImage controls will be placed at run time - each TImage hosting a form image of one created MDI child form.

The "TFormSelectorForm" exposes one class function: Execute. Execute takes an MDI "parent" form for its only parameter.

class function TFormSelectorForm.Execute(const mdiForm: TForm) : TModalResult;
begin
  with self.Create(nil) do
  try
    MDIContainer := mdiForm;
    GetMDIChildImages;
    Result := ShowModal;
  finally
    Free;
  end;
end;

The MDIContainer is a property of type TForm - represents the parent MDI form - the thumbnail form images of MDI child forms will be displayed in the scrollable list.

The GetMDIChildImages procedure iterates over the MDIChildren property of the MDIContainer. For each form the GetFormImage is called to get the image of the form. For each form a TImage is then created and inserted into the scrollbox.

procedure TFormSelectorForm.GetMDIChildImages;
var
  idx : integer;
  form : TForm;
  formImage : TBitmap;
begin
  for idx := 0 to -1 + MDIContainer.MDIChildCount do
  begin
    form := MDIContainer.MDIChildren[idx];

    //skip the active MDI child (as it is currently "active")
    if form = MDIContainer.ActiveMDIChild then Continue;

    //get form image and place it on the scroll bar
    formImage := form.GetFormImage;

    try
      CreateTImage(form).Picture.Assign(formImage) ;
    finally
      formImage.Free;
    end;
  end;
end;

The CreateTImage creates a TImage control for every image / MDI child form. For the moment note that the form's Handle property is stored in the TImage's Tag property.

function TFormSelectorForm.CreateTImage(const form: TForm): TImage;
begin
  Result := TImage.Create(thumbScroller) ;
  with Result do
  begin
    Tag := form.Handle; //used to activate upon "click"
    Parent := thumbScroller;

    Cursor := crHandPoint;
    Margins.Left := 8;
    Margins.Right := 8;
    Margins.Top := 8;
    Margins.Bottom := 8;
    AlignWithMargins := true;
    Width := 4 * thumbScroller.Height div 3;
    Align := alLeft;

    Stretch := true;
    Proportional := true;
    Center := true;

    OnClick := ImageClick;
    OnMouseEnter := MouseEnter;
    OnMouseLeave := MouseLeave;

    ShowHint := true;
    Hint := Format('Click to activate "%s"', [form.Caption]) ;
  end;
end;

The dynamically assigned event handlers for the OnMouseEnter and OnMouseLeave are used to provide a nice user friendly interface where the TShape control is placed "around" the image under the mouse pointer. Using the TTImer, the shape's border is changed in intervals.

The most important code goes inside the dynamically assigned OnClick event handler.

procedure TFormSelectorForm.ImageClick(Sender: TObject) ;
var
  theImage : TImage;
  mdiChildHandle : THandle;
  mdiChild : TForm;
begin
  theImage := TImage(Sender) ;

  mdiChildHandle := theImage.Tag;

  mdiChild := FindControl(mdiChildHandle) as TForm;

  if (mdiChild <> nil) then
  begin
    if IsIconic(mdiChildHandle) then
      // mdiChild.WindowState := wsNormal OR wsMaximized ??
      ShowWindow(mdiChildHandle, SW_RESTORE)
    else
      mdiChild.Show;

    //self.Close;
    ModalResult := mrOk;
  end;
end;

When the TImage control displaying a thumbnail of one of the MDI child forms is clicked, this is what happens:

• The Handle to the "underlying" form is extracted from the Image's Tag property.
• RTL's FindControl is used to locate the form provided with its handle.
• If the selected ("clicked") form is currently minimized it needs to be restored; otherwise simply Show the MDI child form (make it active).
• Close the FormSelectorForm by assigning a value to its ModalResult property.

That's it :)

You should download the complete code - implementation of OnMouseEnter and OnMouseLeave is left for you to figure it out.

Calling the Visual Form Activator

To display the MDI child thumbnail browser, in your main MDI form add a call like:

TFormSelectorForm.Execute(self) ;

Way much better than the "WindowMenu"?

In the MDI applications, you can use the WindowMenu property to get or set the Window menu for an MDI parent form. The Window menu lists the child windows that are currently open in the application. When the user selects one of these windows, the window becomes the active window in the application.