Discussion :

[Jipété]

Bonjour,

je n'ai jamais été très fort en graphisme, d'où ce post.

J'ai une imagelist qui contient des images 60x60 (provenance fichiers png du web), que je voudrais recopier en les redimensionnant dans une imagelist de 32x32.
Simple, non ?
Ça fait juste 4 heures que je suis dessus...

L'idée c'est de parcourir la première il (appelons-là "source") image par image, de recopier l'image en cours dans une TImage intermédiaire posée sur la form à la bonne dimension, de préciser Stretch à True et de récupérer cette image intermédiaire pour l'insérer dans l'il "destination".
Trouvé sur le web :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
    Image1.Stretch := true;  // to make it as large as Image1
    Image1.Proportional := true;  // to keep width/height ratio
    imglist32.Add(Image1.Picture.Bitmap, nil);

On pourrait penser que c'est bien comme ça qu'il faut faire puisque dans l'image intermédiaire posée sur la form je vois bien en fin de parcours de la liste la dernière image de l'il source, correctement redimensionnée.

Mais (car il y a toujours un "mais") l'enregistrement de l'il destination en full bitmap me montre des bouts seulement de mes images d'origine...
Cette il destination fait bien 32x32 mais l'option "Stretch" est passée à la trappe, comme si ce qu'on voyait dans l'image temp n'était pas ce qui va être inséré dans l'il dest.

Pour en avoir le cœur net, j'ai rajouté sur la form une autre TImage temporaire, et j'ai fait ça : Image2.Picture.Assign(Image1.Picture); et je constate que l'image2 présente le même défaut que les images enregistrée dans l'il dest : croppée mais pas stretchée.

La question est donc simple : comment enregistrer dans l'il dest des images vraiment redimensionnées ?

Merci, bonne journée,

[gvasseur58]

Pour en avoir le cœur net, j'ai rajouté sur la form une autre TImage temporaire, et j'ai fait ça : Image2.Picture.Assign(Image1.Picture); et je constate que l'image2 présente le même défaut que les images enregistrée dans l'il dest : croppée mais pas stretchée.

Bonjour Jipété,

Je suppose que tu travailles avec Linux, car sous Windows l'image 2 est correcte... Peux-tu confirmer avant que je ne passe sous Linux pour tester ?

Gilles

[Jipété]

Salut, Gilles,

Bonjour Jipété,

Je suppose que tu travailles avec Linux, car sous Windows l'image 2 est correcte... Peux-tu confirmer avant que je ne passe sous Linux pour tester ?

Gilles

Confirmé, confirmé ! Aïe aïe aïe, je sens venir un pb Gtk-Lxde (comme quand je m'étais pris la tête avec la transparence), et je ne pensais pas du tout à ça...

Merci de tes tests,

[gvasseur58]

Avant de tester sur Linux, je t'envoie le code commenté qui fonctionne bien sur Windows.
Mes listes d'images s'appellent ilSource (60x60, stretched à True) et ilDest (32x32, stretched à True).
Une image test s'appelle Image1.
La méthode fournie est celle d'un bouton quelconque.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
procedure TForm1.BitBtn1Click(Sender: TObject);
var
  Li: Integer;
  Lbitmap: TBitmap;
begin
  LBitmap := Tbitmap.Create; // bitmap de travail
  try
    for Li := 0 to ilSource.Count-1 do // on parcourt la liste 1
    begin
      // les lignes de transfert
      ilSource.GetBitmap(Li, LBitmap); // image 1 de Source dans bitmap
      ilDest.Add(LBitmap, nil); // ajout de l'image dans Dest
      // la suite est là pour tester
      image1.Picture.Assign(LBitmap); // une simple image affectée
      application.ProcessMessages; // on lui donne l'occasion de s'afficher
      sleep(400); // et on se donne le temps de la voir !
    end;
  finally
    LBitmap.Free; // bitmap libéré
  end;

Une solution plus confortable serait de copier toutes les images d'un coup, mais la fonctionnalité n'est pas encore implémentée pour des tailles d'images différentes

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
  // ne fonctionne pas encore : copie de toutes les images d'un coup
  // => erreur : not implemented yet !
  ilDest.AddImages(ilSource); // ce serait le top !
  // le reste serait là pour contrôler...
   LBitmap := Tbitmap.Create;
  try
    for Li := 0 to ilSource.Count-1 do
    begin
      ilDest.GetBitmap(Li, LBitmap);
      image1.Picture.Assign(LBitmap);
      application.ProcessMessages;
      sleep(400);
    end;
  finally
    LBitmap.Free;
  end;
end;

[Jipété]

Avant de tester sur Linux, je t'envoie le code commenté qui fonctionne bien sur Windows.
Mes listes d'images s'appellent ilSource (60x60, stretched à True) et ilDest (32x32, stretched à True).
Une image test s'appelle Image1.
La méthode fournie est celle d'un bouton quelconque.

Faute de frappe ou spécificité Windows ? Tu mets tretched à true pour les listes d'image, moi je ne l'ai que pour les images.

Première constatation intéressante, en tout cas : si je mets les 2 images avec stretched à true, alors, oui, la seconde image est correcte, alors que hier soir elle ne l'était pas.
Ce qui voudrait dire que l'instruction Image2.Picture.Assign(Image1.Picture); ne prend pas en compte ce que l'on voit, mais part du bitmap d'origine...
Ça part mal !

Et ça explique que le contenu de la seconde liste d'images soit foireuse. Je suis parti de ton code, j'ai juste changé les noms des listes, et j'ai rajouté 2 choses :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
procedure TForm1.BitBtn1Click(Sender: TObject);
var
  Li: Integer;
  Lbitmap: TBitmap;
begin
  LBitmap := Tbitmap.Create; // bitmap de travail
  try
    for Li := 0 to ilSource.Count-1 do // on parcourt la liste 1
    begin
      // les lignes de transfert
      ilSource.GetBitmap(Li, LBitmap); // image 1 de Source dans bitmap
      ilDest.Add(LBitmap, nil); // ajout de l'image dans Dest
      // la suite est là pour tester
      image1.Picture.Assign(LBitmap); // une simple image affectée
      Image2.Picture.Assign(Image1.Picture); //// premier ajout ici, pour voir
      application.ProcessMessages; // on lui donne l'occasion de s'afficher
      sleep(400); // et on se donne le temps de la voir !
    end;
  finally
    // 2e ajout ici : 3 lignes rajoutées pour récupérer le full bitmap de la liste d'images
    LBitmap.SetSize(60,1200);  // 32 x 640 dans GIMP
    ilDest.GetFullBitmap(LBitmap, gdeNormal);
    LBitmap.SaveToFile(fileutil.ProgramDirectory + 'bitmap.bmp');
    LBitmap.Free; // bitmap libéré
  end;

Et donc quand je regarde ce fichier bitmap.bmp, je vois bien que ce qui est dedans c'est une suite de bouts de 32x32 récupérés bruts dans mes images de 60x60

Une solution plus confortable serait de copier toutes les images d'un coup, mais la fonctionnalité n'est pas encore implémentée pour des tailles d'images différentes

Parfaitement possible avec GetFullBitmap comme ci-dessus, sauf que le FullBitmap n'est pas bon...
Il suffirait de récupérer un full bitmap, de le stretcher et de le réenregistrer pour l'importer (LoadFromFile ?) dans l'autre liste d'images, on verra ça plus tard...

[gvasseur58]

Faute de frappe ou spécificité Windows ? Tu mets tretched à true pour les listes d'image, moi je ne l'ai que pour les images.

Ni l'un ni l'autre : une rédaction en raccourci hasardeux . Mes images étaient de la dimension indiquée et les images (TImage) les dessinant avaient leur propriété stretched à True.

Ce qui voudrait dire que l'instruction Image2.Picture.Assign(Image1.Picture); ne prend pas en compte ce que l'on voit, mais part du bitmap d'origine...

C'est exactement ça Avec Assign, comme son nom l'indique, tu assignes l'objet persistent au premier objet. C'est au moment du dessin que les dimensions de représentation sont choisies, ce qui permet de tenir compte des options comme stretched. Il ne faut donc pas confondre Assign qui fait une copie physique de l'élément et sa représentation par un mécanisme de dessin.

Autrement dit, la copie ne transforme pas l'objet graphique. C'est l'affichage qui adapte ses caractéristiques.
Pour transformer réellement le bitmap, il faut utiliser des fonctions fournies par des bibliothèques (genre BGRABitmap). Il y en a peut-être dans la LCL, mais je n'ai pas vérifié.

Je suis parti de ton code, j'ai juste changé les noms des listes, et j'ai rajouté 2 choses :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
procedure TForm1.BitBtn1Click(Sender: TObject);
var
  Li: Integer;
  Lbitmap: TBitmap;
begin
  LBitmap := Tbitmap.Create; // bitmap de travail
  try
    for Li := 0 to ilSource.Count-1 do // on parcourt la liste 1
    begin
      // les lignes de transfert
      ilSource.GetBitmap(Li, LBitmap); // image 1 de Source dans bitmap
      ilDest.Add(LBitmap, nil); // ajout de l'image dans Dest
      // la suite est là pour tester
      image1.Picture.Assign(LBitmap); // une simple image affectée
      Image2.Picture.Assign(Image1.Picture); //// premier ajout ici, pour voir
      application.ProcessMessages; // on lui donne l'occasion de s'afficher
      sleep(400); // et on se donne le temps de la voir !
    end;
  finally
    // 2e ajout ici : 3 lignes rajoutées pour récupérer le full bitmap de la liste d'images
    LBitmap.SetSize(60,1200);  // 32 x 640 dans GIMP
    ilDest.GetFullBitmap(LBitmap, gdeNormal);
    LBitmap.SaveToFile(fileutil.ProgramDirectory + 'bitmap.bmp');
    LBitmap.Free; // bitmap libéré
  end;

Et donc quand je regarde ce fichier bitmap.bmp, je vois bien que ce qui est dedans c'est une suite de bouts de 32x32 récupérés bruts dans mes images de 60x60

Cette expérience confirme mes dires et ton hypothèse : la représentation est différente de la réalité physique.

Il suffirait de récupérer un full bitmap, de le stretcher et de le réenregistrer pour l'importer (LoadFromFile ?) dans l'autre liste d'images, on verra ça plus tard...

Justement non : récupération = physique - "stretcher" = représentation...
Il faut utiliser une fonction/procédure qui change le format de l'image.
Il y aurait aussi la solution de sauvegarder le canvas de l'image de destination dans la liste de destination : pour l'afficher, il faut bien que le composant TImage fasse un minimum de travail, non ?

Gilles

[Jipété]

Pour transformer réellement le bitmap, il faut utiliser des fonctions fournies par des bibliothèques (genre BGRABitmap). Il y en a peut-être dans la LCL, mais je n'ai pas vérifié.

Suis allé voir sur le wiki (oui, parce que tous les exemples que j'ai pu trouver sont dédiés à Delphi et à son scanline...), il y a bien un exemple mais quand je l'applique à mes images,
1- je perds la transparence ;
2- la conversion est à vomir, esthétiquement parlant : le résultat est une vraie horreur (pixellisé, effet d'escalier)...

Ch'suis pas rendu !

Je sens que je vais faire mes conversions avec The Gimp et générer en dur mes listes d'images. Dommage...

[ThWilliam]

Bonsoir.

Timage est un composant que je déteste. Je ne l'utilise que dans certains cas, et par solution de facilité. Si c'est comme Delphi, son stretch est un vulgaire CanvasStretchDraw : résultat pitoyable. Un StretchBlt donne de bons résultats, mais accessible sous Linux ?
Le mieux dans ton cas me semble être d'utiliser BGRABitmap.
1) tu recopies sur le bgrabitmap l'image contenue dans ton imagelist.
2) tu appliques la transparence des pixels (si nécessaire !)
3) tu réduis le bitmap (le stretch de bgrabitmap n'est pas mal du tout).
4) tu sauves en png
5) tu remplis ton imagelist2 avec le png créé.

Mais bon, la solution de Photoshop (ou gimp) est certainement la meilleure (tu peux corriger les imperfections dues à la réduction et ajuster au mieux les pixels transparents)...

Amicalement
Thierry

[gvasseur58]

Bonsoir.

Timage est un composant que je déteste. Je ne l'utilise que dans certains cas, et par solution de facilité. Si c'est comme Delphi, son stretch est un vulgaire CanvasStretchDraw : résultat pitoyable. Un StretchBlt donne de bons résultats, mais accessible sous Linux ?
Le mieux dans ton cas me semble être d'utiliser BGRABitmap.

Je ferais comme Thierry, car BGRABitmap est vraiment utile :dès qu'on aborde des sujets comme la transparence, le redimensionnement, les transformations, TImage et TCanvas sont vite dépassés

Suis allé voir sur le wiki (oui, parce que tous les exemples que j'ai pu trouver sont dédiés à Delphi et à son scanline...), il y a bien un exemple mais quand je l'applique à mes images,
1- je perds la transparence ;
2- la conversion est à vomir, esthétiquement parlant : le résultat est une vraie horreur (pixellisé, effet d'escalier)...

Pas étonnant que tu obtiennes des images très dégradées TImage n'est vraiment pas fait pour des manipulations d'images, mais pour un affichage simple. Il faut choisir des bibliothèques évoluées pour réaliser des transformations intéressantes (avec anticrénelage et transparence). Cela dit, aucune bibliothèque et aucun logiciel ne fera de miracle avec des bitmaps contenant aussi peu de pixels : 60x60 vers 32x32, ça fait forcément un peu de dégâts.

Moralité : si ton programme doit convertir les images, utilise BGRABitmap. Si ton programme utilise des images, passe par un outil spécialisé.

Bon courage,

Gilles

[Jipété]

Bonjour à tous,

alors hier soir j'ai joué avec la suite BGRA, il en ressort que si le redimensionnement est correct, je perds la transparence

De guerre lasse ce matin j'ai attaqué l'autre option, Gimp et plusieurs listes d'images, en une heure c'était torché, mise en place, tests et café compris !

Bon, je ne peux pas cliquer sur , car ça n'est pas vraiment le cas, il s'agit plus d'un contournement qu'autre chose, avec la contrainte que je me retrouve avec un fichier lfm de 1,5 Mo en m'étant limité à 4 listes. Je n'ose imaginer ce que ça donnerait si je voulais augmenter le nombre de listes (sans compter que ça alourdit le code...)

'fin bon, je vous souhaite cependant un très bon week-end,

[gvasseur58]

Bonjour à tous,

alors hier soir j'ai joué avec la suite BGRA, il en ressort que si le redimensionnement est correct, je perds la transparence

Bonjour,

Tu devrais t'adresser à circular17 : c'est lui qui a écrit BGRABitmap et il saura sans doute te répondre en 2 minutes alors qu'il me faudrait 2 heures
Bon week-end aussi,

Gilles

[ThWilliam]

Bonjour à vous deux.

@Jipété :

Eternel problème de transparence !!! Nous en avions déjà parlé lors d'un code utilisant une Form transparente.
Moi qui suis surtout passionné par la programmation graphique, j'hésite lourdement à programmer sous Linux

Sous Windows, ce petit code marche sans aucun problème :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
procedure TForm1.Button1Click(Sender: TObject);
var
   Bmp, Temp: TBGRABitmap;
begin
    Bmp:= TBGRABitmap.Create(64, 64);
    ImageList1.Draw(Bmp.Canvas, 0, 0, 1); //  1 = l'index de l'image
    Temp := Bmp.Resample(32, 32, rmFineResample) as TBGRABitmap;
    Temp.SaveToFile('MyImage.png');
    Temp.Free;
    Bmp.Free;
end;

Ceci marche aussi bien pour des images d'origine png ou bmp...
Que tu trouves que le stretching ne soit que "correct", c'est normal, une réduction sur aussi peu de pixels demande souvent un coup de fouet (accentuation des contours).

Au sujet du fichier lfm qui pèse une tonne: à ta place je n'utiliserais pas un TImageList, mais bien un fichier ressources ou un load des images en runtime avec stockage dans un compo du genre TCollection.

Bon W.E. à vous.

Thierry

[Jipété]

Bonjour à vous deux.

@Jipété :

Eternel problème de transparence !!! Nous en avions déjà parlé lors d'un code utilisant une Form transparente.

Fouhhh ! Ça remonte à un bout de temps, ça ! J'avais un peu oublié... (et je n'ai pas vu ce post de tout l'après-midi )

Moi qui suis surtout passionné par la programmation graphique, j'hésite lourdement à programmer sous Linux

Sous Windows, ce petit code marche sans aucun problème :

Ceci marche aussi bien pour des images d'origine png ou bmp...

Que tu trouves que le stretching ne soit que "correct", c'est normal, une réduction sur aussi peu de pixels demande souvent un coup de fouet (accentuation des contours).

Testé à la va-vite avec les images de ma liste d'images et ma foi, ça fonctionne. Et j'ai la transparence
Mais les noirs ne sont pas noirs mais gris
J'ai essayé toutes les options du TResampleFilter sans voir aucune différence...



En haut l'image d'origine dessinée sur la form à partir d'une liste d'image 60x60 ; dessous, la même image resizée avec stretched := image.Resample(32, 32) as TBGRABitmap; sans l'option du filtre, que je découvre grâce à toi (grand merci !) ; et en bas avec ton code : la transparence est là mais on perd les vrais noirs, et le dessin est un peu plus petit : 16x23 alors que l'autre fait 18x24 (je parle du dessin, là, pas de la taille de l'image qui fait 32x32 dans les deux cas).

Au sujet du fichier lfm qui pèse une tonne: à ta place je n'utiliserais pas un TImageList, mais bien un fichier ressources ou un load des images en runtime avec stockage dans un compo du genre TCollection.

J'en prends bonne note. Maintenant, si le resize fonctionne, une seule liste et hop !

Mais faut voir ce problème noir --> gris

[tourlourou]

Bonjour, il doit être possible d'enregistrer au format pf1Bit = N&B puis repasser en BGRA.

[ThWilliam]

Salut Jipété,

concernant le problème du noir --> gris, je viens de faire le test sous Photoshop :
- nouveau fichier de 60/60 avec fond transparent
- dessin au crayon noir avec différentes épaisseurs.
- re-échantillonage en 32/32 (j'ai testé les différents modes)

Résultat :
Si je promène la souris sur le tracé noir, Ps m'annonce que la valeur RGB est bien de 0,0,0.
Oui, mais... pour éviter l'aliasing, la valeur alpha de certains pixels a été modifiée.
Donc en glissant par dessous un calque blanc, un pixel noir semi-transparent devient... gris.
On peut évidemment assombrir les pixels gris, mais dans ce cas on retrouve les hachures, le dessin en escalier.

BGRABitmap a adopté le même principe. D'où plus on applique d'antialiasing, plus on obtient du gris.

Bon dimanche.

Thierry

PS: pas vu le post de tourlourou, donc je n'ai pas testé.

[tourlourou]

Il est probable que cette méthode supprime la plupart du bénéfice de l'antialiasing...

[Jipété]

Salut à tous.

Et y aurait pas moyen de jouer avec le contraste de l'image ?

(et si je pose la question, c'est que je n'ai pas trouvé comment faire... J'ai bien trouvé un post qui joue avec la luminosité, mais je ne parle pas teuton, et mes tests ne sont donc pas très concluants)

[gvasseur58]

Salut à tous.

Et y aurait pas moyen de jouer avec le contraste de l'image ?

(et si je pose la question, c'est que je n'ai pas trouvé comment faire... J'ai bien trouvé un post qui joue avec la luminosité, mais je ne parle pas teuton, et mes tests ne sont donc pas très concluants)

Dans BGRAFilters, tu as une fonction qui devrait faire l'affaire (si tu travailles avec BGRABitmap ) :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
{ Sharpen filter add more contrast between pixels }
                               function FilterSharpen(bmp: TBGRACustomBitmap): TBGRACustomBitmap;

[Jipété]

Dans BGRAFilters, tu as une fonction qui devrait faire l'affaire (si tu travailles avec BGRABitmap ) :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
{ Sharpen filter add more contrast between pixels }
                               function FilterSharpen(bmp: TBGRACustomBitmap): TBGRACustomBitmap;

Si j'avais une grande image avec plein de détails divers et variés, plein de couleurs, oui, ça pourrait le faire...

Mais là, je suis dans le pire des cas, regarde :
en haut en zoomant à 400 % pour bien voir pourquoi c'est pas terrible, en bas les images 32x32.
À gauche avec le filtre à 0, à droite avec le filtre à 255 (le max) ; c'est pas gagné...



Si on regarde bien les deux traits de la base du pion de gauche, à droite le trait du bas a carrément sauté, et celui du haut est gris foncé. Il aurait fallu que celui du bas passe en gris moyen ou foncé et que celui du haut devienne noir ou presque.

D'autres idées ?

[gvasseur58]

Si j'avais une grande image avec plein de détails divers et variés, plein de couleurs, oui, ça pourrait le faire...

Mais là, je suis dans le pire des cas, regarde :
en haut en zoomant à 400 % pour bien voir pourquoi c'est pas terrible, en bas les images 32x32.
À gauche avec le filtre à 0, à droite avec le filtre à 255 (le max) ; c'est pas gagné...



Si on regarde bien les deux traits de la base du pion de gauche, à droite le trait du bas a carrément sauté, et celui du haut est gris foncé. Il aurait fallu que celui du bas passe en gris moyen ou foncé et que celui du haut devienne noir ou presque.

D'autres idées ?

Oui, c'est l'anticrénelage qui fait ça. Je crois qu'il est possible de le désactiver, mais je remets sans cesse l'étude de BGRABitmap aux calendes grecques (qui, vu la crise en Grèce, ne sont pas prévues de si tôt), et, du coup, j'ignore comment
De toute façon, je crains qu'on se heurte à un autre compromis : ce que tu as gagner en noir, tu vas le perdre en lissage des courbes. Ce n'est pas propre à Lazarus : c'est le problème de toute représentation par points d'une réalité physique. Les phénomènes sont évidemment amplifiés s'il y a peu de points en jeu, ce qui est le cas d'une toute petite figure...

Là, je suis fatigué, mais je regarderai demain ta page teutonne : il me reste quelques souvenirs de Goethe...

Gilles