How to image when clicked on thumbnails in Delphi 2010

Question

I am new to delphi and I am working on a code which is not at all documented. So we decided to redo the coding and I am the only one in my team. Nobody knows how to code in Delphi. My requirement is something like this.

I want to create a thumbnail for an image for instance lets take a rectangle filled with red and display it in the main form. The user clicks this thumbnail and when user clicks anywhere in the display area this object should appear. Can someone give me some hints or link to proceed with this? It would be really helpful.

Would [this](http://stackoverflow.com/questions/982207/changing-pictures-by-clicking-on-the-timage-component-delphi) help? Only, you will probably be showing/hiding an object instead of switching pictures in the `OnClick` handler. I might have completely misunderstood the objective though.. — Sertac Akyuz, Nov 19 '11 at 02:47

score 0 · Answer 1 · answered Nov 21 '11 at 17:29

You would need to make some connection between the thumbnails and the main image.
Let me assume you have the main images stored in the filesystem.
If all your thumbnails are the same size, it makes sense to store them in a imagelist.
A common control to view Images is the ListView.

unit Unit1;

interface

uses
  Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Forms,
  Dialogs, ExtCtrls, ComCtrls, ImgList;

type
  TForm9 = class(TForm)
    ImageList1: TImageList;
    ListView1: TListView;
    Image1: TImage;
    procedure ListView1SelectItem(Sender: TObject; Item: TListItem; Selected: Boolean);
    procedure FormCreate(Sender: TObject);
    procedure FormClose(Sender: TObject; var Action: TCloseAction);
  private
    ListOfNames: TStringList;
  public

  end;

var
  Form9: TForm9;

implementation

{$R *.dfm}

procedure TForm9.FormClose(Sender: TObject; var Action: TCloseAction);
begin
  ListOfNames.Free;
end;

procedure TForm9.FormCreate(Sender: TObject);
begin
  ListOfNames:= TStringList.Create;
  ListOfNames.Add('c:\pictures\filename1.bmp');
  ListOfNames.Add('c:\pictures\filename2.bmp');
end;

procedure TForm9.ListView1SelectItem(Sender: TObject; Item: TListItem; Selected: Boolean);
var
  ImageIndex: integer;
  Filename: string;
begin
  ImageIndex:= Item.Index;
  Filename:= ListOfNames[ImageIndex];
  Image1.Picture.LoadFromFile(Filename);
end;

end.

Here the text for the DFM file:

object Form9: TForm9
  Left = 0
  Top = 0
  Caption = 'Form9'
  ClientHeight = 468
  ClientWidth = 676
  Color = clBtnFace
  Font.Charset = DEFAULT_CHARSET
  Font.Color = clWindowText
  Font.Height = -11
  Font.Name = 'Tahoma'
  Font.Style = []
  OldCreateOrder = False
  OnClose = FormClose
  OnCreate = FormCreate
  PixelsPerInch = 96
  TextHeight = 13
  object Image1: TImage
    Left = 328
    Top = 64
    Width = 289
    Height = 318
    Stretch = True
  end
  object ListView1: TListView
    Left = 16
    Top = 232
    Width = 250
    Height = 150
    Columns = <>
    LargeImages = ImageList1
    TabOrder = 0
    OnSelectItem = ListView1SelectItem
  end
  object ImageList1: TImageList
    Left = 16
    Top = 192
  end
end

You would need to add some images to the imagelist These will be shown in the ListView.
Clicking on an item in the listview will trigger the event and show the image in the TImage.

How to image when clicked on thumbnails in Delphi 2010

1 Answers1