Thumbnail Viewer Komponente

[theo]

Gut, danke.

Hast du das auf GTK2, Qt, und Windows getestet? War es sowieso nur auf GTK2 ein Problem?

Wenn ich das weiss, kann ich bei Gelegenheit das ZIP updaten.

[pluto]

Ich habe es nur auf GTK2 getestet bzw auf GTK3 oder so.
Aber diese Zeile schadet jedenfalls nicht. Denke ich.

[theo]

OK, habe das ZIP upgedatet. Hoffentlich macht's keine neuen Probleme.
Vielen Dank.

[pluto]

Bitte. Wenn mir wieder was auffällt sage ich es dir. Aber so schlimm war der Fehler ja nicht.

[WillJBHus]

Dear Theo,

Your ThumbView component is really great. After years I found you!
To make the component more usefull, I suggest some new code.
I think you will find some corrections to make, but these patches
work flawless in my diashow program.

Best regards,

Will J.B. Hus
w.j.b.hus@ziggo.nl

[WillJBHus]

Working on my diashow program, I found that there was another possibility.
Not necessarily better, but maybe more elegant.

I added :

property SortItems : boolean;
function ItemCount : integer;
property ItemIndex : integer;
procedure NextItem;
procedure PreviousItem;
function IsFirstItem : boolean;
function IsLastItem : boolean;

This way, programming is made a lot easier.

N.B. Sorry for my English. I understand German very well, but I've never
practized speaking or writing. So, feel free to write in German!

[theo]

Your ThumbView component is really great.

Danke, freut mich.

Ich werde ein Property namens "AutoSort" einführen.

Dann werde ich die Prozedur "ScrollIntoView" nach "public" verschieben.

Damit kann man alles auf Application-Level erledigen.

Die anderen Patches sind imho nicht notwendig.
Wenn du die Komponente erweitern möchtest, dann mach das bitte so:

type TDiaControl=class(TThumbControl)

Und implementiere alles, wozu du Lust hast.

EDIT: Done http://www.theo.ch/lazarus/thumbview.zip

[wp_xyz]

Eine Super-Komponente ist das geworden. Endlich habe ich ein Projekt, in dem ich dieses "Kleinod" einsetzen kann. Ähnlich wie in der beigefügten Demo soll der Thumbnail Viewer mit einem StringGrid und einem Image zusammenarbeiten. Durch Klicken auf ein Thumbnail soll die entsprechende Zeile im Grid selektiert werden, aber auch in umgekehrter Richtung vom Grid zum ThumbControl. Das funktioniert so auch prima, allerdings fehlt mir die braune Markierung um das selektierte Thumbnail, wenn eine Zeile im StringGrid markiert wird. Wie kann ich diese Markierung auf ein Thumbnail setzen?

Desweiteren habe ich noch folgende Fragen zu der Komponente:

• Wie kann man die Hintergrundfarbe schwarz der Thumbnails ändern?
• Wenn man ShowPictureFrame ausschaltet, sieht man noch einen grauen Rahmen. WIe kann man diesen ausschalten?
• Kann man Zusatzinformationen an ein ThreadedImage anhängen? Ähnlich wie Objects bei einer StringList, oder Data bei den TreeNodes.
• Um weitere Bilder zusätzlich in das ThumbControl nachzuladen hänge ich verwende ich folgenden Code. Ist das die optimale Methode dies zu tun? Werden dabei die bereits vorhandenen BIlder nicht nochmals geladen?

  Code: Alles auswählen

  Thumbcontrol1.URLList := Thumbcontrol1.URLList + OpenDialog.Files.Text;  

[theo]

. Das funktioniert so auch prima, allerdings fehlt mir die braune Markierung um das selektierte Thumbnail, wenn eine Zeile im StringGrid markiert wird. Wie kann ich diese Markierung auf ein Thumbnail setzen?

Wahrscheinlich hast du invalidate vergessen (neu zeichnen).

Code: Alles auswählen

    ThumbControl1.ImageLoaderManager.ActiveIndex:=0;
    ThumbControl1.Invalidate;
    ThumbControl1.ScrollIntoView;  

[*] Wie kann man die Hintergrundfarbe schwarz der Thumbnails ändern?

Das ist nicht konfigurierbar. Such den Code in procedure TThumbControl.Paint in thumbcontrol.pas und passe ihn deinen Wünschen an.

[*] Wenn man ShowPictureFrame ausschaltet, sieht man noch einen grauen Rahmen. WIe kann man diesen ausschalten?

Das ist nicht konfigurierbar. Such den Code in procedure TThumbControl.Paint in thumbcontrol.pas und passe ihn deinen Wünschen an.

[*] Kann man Zusatzinformationen an ein ThreadedImage anhängen? Ähnlich wie Objects bei einer StringList, oder Data bei den TreeNodes.

Erweitere die Klasse TThreadedImage in unit threadedimageLoader.

[*] Um weitere Bilder zusätzlich in das ThumbControl nachzuladen hänge ich verwende ich folgenden Code. Ist das die optimale Methode dies zu tun?

Geladen wird, wenn das Bild zur Anzeige kommt. Sollte also kein großes Problem sein.

[wp_xyz]

Danke für die rasche Antwort. Ja, dann werde ich mal die Komponente anpassen. Wenn's recht ist, werde ich die überarbeitete Version hier hochladen, und du kannst dir überlegen, ob du sie in die "offizielle" Version übernimmst. Gibt es irgendetwas zu beachten, z.B. meine eigenen Änderungen kennzeichnen?

Das Invalidate hat tatsächlich das erste angesprochene Problem gelöst.

[theo]

Gibt es irgendetwas zu beachten, z.B. meine eigenen Änderungen kennzeichnen?

Von mir aus brauchst du die geänderte Version nicht hochladen.
Mir war immer klar, dass diese Komponente Anpassungswünsche auslösen könnte. Da ich aber nicht 100 Stunden in alle möglichen Konfigurations- und Theme-optionen investieren wollte (die dann immer noch nicht reichen), ist die Idee, das jeder mit dem Code macht was er will, und die Basisversion das bleibt was sie ist, nämlich die Basisversion.

Wenn du die geänderte Version unbedingt hochladen willst, dann kennzeichne bitte die Änderungen irgendwie.

Viel Erfolg!

P.S. Habe noch kurz dein Zip angeschaut. Sieht gut aus.
Tipp: Wenn du Property Multithreaded auf true stellst, scrollt es sich noch etwas flüssiger.

[wp_xyz]

Ich hänge gerade bei der Änderung der Hintergrundfarbe der Thumbnails fest. Du realisierst den Hintergrund der Thumbnails durch ein Bitmap, das als png-Datei in die Resource eingebunden ist. Ich dachte mir ich könnte nach dem Laden der png-Datei die Pixel entsprechend verändern, z.B. das Schwarz mit einem Floodfill duch die gewünschte Farbe ersetzen. Aber jede Zeichenoperation auf diesem Canvas hinterlässt nur ein "Loch".

Zum Testen habe ich mir den Thumbnail-Rahmen in eine Datei rausgeschrieben, die ich hier anhänge. Der folgende Code, aufgerufen aus dem FormCreate.Event eines ansonsten leeren Projekts, lädt diese Datei und sollte ein rotes Quadrat in das Bild malen. Es wird aber nur das Quadrat "herausgestanzt". Mit anderen png-Dateien erscheint das rote Quadrat ohne Probleme. Es muss irgendwas mit der Datei sein, was ich in dem Code berücksichtigen müsste. Hast du eine Ahnung, was ich da falsch mache?

Code: Alles auswählen

 
procedure TForm1.FormCreate(Sender: TObject);
var
  png: TPortableNetworkGraphic;
begin
  png := TPortableNetworkGraphic.Create;
  try
    png.LoadFromFile('test.png');
    png.Canvas.Brush.Style := bsSolid;
    png.Canvas.Brush.Color := clRed;
    png.Canvas.Rectangle(100, 100, 200, 200);
    Image1.Picture.Assign(png);
  finally
    png.Free;
  end;
end;

[theo]

Ist aber nur unter Windows so, und nur auf dem TImage.
Hat wahrscheinlich was mit Transparenz zu tun, k.A.

Direkt auf dem Komponenten Canvas geht es aber:

Code: Alles auswählen

procedure TForm1.FormPaint(Sender: TObject);
var
  png: TPortableNetworkGraphic;
begin
  png := TPortableNetworkGraphic.Create;
  try
    png.LoadFromFile('test.png');
    Canvas.Draw(0,0,png);
  finally
    png.Free;
  end;
  Canvas.Brush.Style := bsSolid;
  Canvas.Brush.Color := clRed;
  Canvas.Rectangle(100, 100, 200, 200);
end;  

[Christian]

Moins,

Im Thumb Viewer werden Jpegs die im Header vermerkt haben rotiert zu sein unrotiert dargestellt. Im TImage werden sie aber korrekt rotiert dargestellt. Hat dazu jemand eine Idee ? Ich find die entscheidende Stelle leider nicht.

lg
Christian

[theo]

Im TImage werden sie aber korrekt rotiert dargestellt.

Ah ja? Bei mir nicht.