Bild auf Bild kopieren/übermalen & Transparenz

[Cyberaxx]

Hallo und guten Morgen,

Hoffe das ich mit der Sparte hier nicht ganz falsch bin, es geht ja ums GUI-Design.
Ich habe auf meinem Formular Bilder als Buttons(JvImage) mit Hover Funktion.
Sowiet ist das alles auch wunderbar. Jetzt bin ich aber auf die Idee gekommen noch zusätzlich
etwas auf den "Button" zu zeichnen, wie beim iPhone. Gewisse Unterformulare Zeigen Datensätze an
und ich würde auf dem "Button" die Anzahl ausgeben.
Ich lade also im Hintergrund die Zahlen Icons und Male sie dann mittels Canvas.Draw auf mein JvImage.

Klappt auch. was aber nicht klappt ist es die Zahl wieder zu entfernen. Wenn ich das Original Image dort
zeichne dann sehe ich das Zahlen Icon immernoch im Hintergrund. Alle Bilder sind PNG's und haben ihre
Transparenz.
Zum besseren Verständnis habe ich natürlich auch einen Screen von den einzelnen Bildern und die beiden
Situationen wie es bisher ausschaut.

http://vnetcore.com/screens/Images.jpg

Zusätzlich noch als Anhang.
Hoffe das mir jemand helfen kann.

Gruß
Daniel

[Bummi]

Wenn Du keine eigen Komponente schreiben willst, wirst Du IMHO die "leeren" Bilder getrennt verwalten und bei Änderungen der Anzahlt etc. die Pictures neu erstellen und zuordnen müssen.

[Cyberaxx]

Hmmm... Mache ich doch auch?

Ich habe einmal ein TPNGImage in dem das Button Bild lieft und einmal ein TPNGImage in dem das Icon liegt.

Zur Design Time ist jedilich das Bild ohne Icon vorgeladen.
Beim starten werden die beiden TPNGImages gefüllt mit den Bildern.

Bisher natürlich nur auf Klickt um mein Programm nicht direkt zu versauen.
Dann wird auf den Canvas vom JvImage.Picture eben das Icon gezeichnet.

Delphi-Quellcode:

JvImage1.Picture.Bitmap.Canvas.Draw(X,Y, IconImage);

so jetzt soll eben das Icon nicht mehr angezeigt werden und ich nutze die Funktion.

Delphi-Quellcode:

  var
    DestFrame: TRect;
begin
  DestFrame := ButtonImage.Canvas.ClipRect;
  JvImage1.Picture.Bitmap.Canvas.StretchDraw(DestFrame, ButtonImage);

Damit bekomme ich eben das letzte Bildchen aus dem angehängten Bild.
Dabei sollte doch, wenn ichs richtig verstanden habe der gesamte Bereich übermalt werden.
Leider sind eben die Bilder dabei Transparent.

Wie kann ich denn das Picture der Komponente neu erstellen zur Laufzeit? Auf nil setzen und dann normal wieder laden?
Wie würde das denn von der Performance aussehen?

[himitsu]

Dein Button-Bild übermalt eben nur da, wo es auch was zu malen hat. An transparenten Stellen malt es eben nichts hin. :stupid:
Du mußt also das ganze Bild vorher leer machen oder eine Neues nehmen, wo dann der Button draufgemalt wird.

Oder lade das Button-Bild in das angezeigt Image, anstatt es draufzumalen.
Also nur die Zahl wird gemalt, vorher das Button-Bild wird geladen und damit alles Alte überschrieben übermalt.

[Bummi]

Ich bastle mir für so etwas gerne eigene Komponenten auf Basis von TGraphicControl mit GDI +,
da Du JvImage verwenden möchtest, was ich meinte geht in diese Richtung, kann durchaus noch Fehler beinhalten.
(Annahme Imagelisten mit 32-Bit , PNG's)

Delphi-Quellcode:

function CombineIcons(FrontIcon, BackIcon: HIcon): HIcon;
// von http://www.swissdelphicenter.ch/torry/showcode.php?id=1636
var
  WinDC: HDC;
  FrontInfo: TIconInfo;
  FrontDC: HDC;
  FrontSv: HBITMAP;
  BackInfo: TIconInfo;
  BackDC: HDC;
  BackSv: HBITMAP;
  BmpObj: tagBitmap;
begin
  WinDC := GetDC(0);

  GetIconInfo(FrontIcon, FrontInfo);
  FrontDC := CreateCompatibleDC(WinDC);
  FrontSv := SelectObject(FrontDC, FrontInfo.hbmMask);
  GetIconInfo(BackIcon, BackInfo);
  BackDC := CreateCompatibleDC(WinDC);
  BackSv := SelectObject(BackDC, BackInfo.hbmMask);
  GetObject(FrontInfo.hbmMask, SizeOf(BmpObj), @BmpObj);
  BitBlt(BackDC, 0,0,BmpObj.bmWidth, BmpObj.bmHeight, FrontDC, 0,0,SRCAND);
  SelectObject(BackDC, BackInfo.hbmColor);
  DrawIconEx(BackDC, 0,0,FrontIcon, 0,0,0,0,DI_NORMAL);
  Result := CreateIconIndirect(BackInfo);
  SelectObject(FrontDC, FrontSv);
  DeleteDC(FrontDC);
  SelectObject(BackDC, BackSv);
  DeleteDC(BackDC);
  ReleaseDC(0,WinDC);
  DeleteObject(FrontInfo.hbmColor);
  DeleteObject(FrontInfo.hbmMask);
  DeleteObject(BackInfo.hbmColor);
  DeleteObject(BackInfo.hbmMask);
end;

procedure TForm5.SetButton(Picture:TPicture;ButtonList,ZahlenList:TImageList;ButtonIndex:Integer;StateIndex:Integer);
  var
   ico,ico2,ico3:TIcon;
   c:TMetafileCanvas;
  begin
      ico := TIcon.Create;
      ico2 := TIcon.Create;
      ico3 := TIcon.Create;
      try
       ButtonList.GetIcon(ButtonIndex,ico);
       if StateIndex>0 then
          begin
            ZahlenList.GetIcon(StateIndex,ico2);
            ico3.Handle := CombineIcons(ico2.Handle,ico.Handle);
            Picture.Assign(ico3);
          end else Picture.Assign(ico);
      finally
        ico.Free;
        ico2.Free;
        ico3.Free;
      end;

  end;

procedure TForm5.FormCreate(Sender: TObject);
begin
   SetButton(JVImage1.Picture,ImageButtons,ImageZahlen,0,1);
   SetButton(JVImage1.Pictures.PicEnter,ImageButtonsHoover,ImageZahlen,0,1);
end;

[Cyberaxx]

Das ist auch eine nette Funktion. An Imagelisten habe ich noch nicht gedacht gehabt.
Später ist es so das alle Icons/Buttons in einem Archive sind und dementsprechend draus
geladen werden um nicht so viel in die EXE zu packen.

Das Anzeigen selbst klappte ja bisher auch. Nur das übermalen hat ja nicht geklappt.
Hatte mir da nun etwas zusammen geschustert.
Dazu habe ich dann aber noch eine Frage.

Delphi-Quellcode:

  var
    MStream: TMemoryStream;
begin
  try
    MStream := TMemoryStream.Create;
    MStream.Position := 0;
    ButtonImage.SaveToStream(MStream);
    MStream.Position := 0;
    JvImage1.Picture.Bitmap.LoadFromStream(MStream);
  finally
    MStream.Free;
  end;

Ich habs, da ich den letzten Beitrag noch nicht gesehen hatte, dem Tip von Himitsu zu folgen.
Da müsste ich doch richtig in der Annahme gehen, ich speicher das Originalbild in den Stream und lade es von dort aus aufs JvImage. Nur leider wird dann nichts mehr angezeigt.

Wenn ich nun aber

Delphi-Quellcode:

JvImage1.Picture.Bitmap.Canvas.Draw(0,0, ButtonImage);

noch zusätzlich einfüge wirds normal dargestellt aber... ich versteh da scheinbar gerade etwas nicht.


@Bummi Na die JvImage Komponente bietet so ja schon alles was ich brauche. Bilder für mehrere Modis ohne groß etwas eigentsändiges zu entwickeln. War dadurch die erste Wahl.
Ich Bastel da mal ein wenig rum :)

[Bummi]

irgend etwas ist bei uns unterschiedlich konfiguriert.

das von Dir beschriebene

Zitat:

JvImage1.Picture.Bitmap.Canvas.Draw(0,0, ButtonImage);

funktioniert bei mir nicht, da dort PNG's zugeordnet wurden, wenn man direkt JvImage1.canvas zugreift kommt es dann auch zu der erwarteten Fehlermeldung.

[Cyberaxx]

Zitat:

Zitat von Cyberaxx (Beitrag 1171009)

Zur Design Time ist jedilich das Bild ohne Icon vorgeladen.

Darum geht das ohne Probleme. :)
Hab daheim noch einen Quelltext liegen damit kann ih das Image auch direkt erstellen ohne es zur Design Zeit zu laden. Hatte ich aber gerade eben nicht parat

[himitsu]

Zitat:

Delphi-Quellcode:

var
  MStream: TMemoryStream;
begin
  try
    MStream := TMemoryStream.Create;
    MStream.Position := 0;  // nach'm Erstellen ist das sowieso immer 0 ;)
    ButtonImage.SaveToStream(MStream);
    MStream.Position := 0;
    JvImage1.Picture.Bitmap.LoadFromStream(MStream);
  finally
    MStream.Free;
  end;

Was ist ButtonImage für ein Typ?

Delphi-Quellcode:

begin
  JvImage1.Picture.Bitmap.Assign(ButtonImage);

[Cyberaxx]

Das ist vom Typ TPMGImage

[Bummi]

Ich habe mal schnell eine Minikomponeten gebastelt, Testprojekt liegt bei, keine Installation/Komponentenregistrierung nötig.
Wenn es für Dich passt kannst Du es ja anpassen und ein Package drumkleben.

[himitsu]

Zitat:

Zitat von Cyberaxx (Beitrag 1171032)

Das ist vom Typ TPMGImage

Dann isses schon etwas interessant, daß man ein PNG (soll ja eines dort drin sein) in ein Bitmap laden kann, welches doch eigentlich nur Bitmaps laden können sollte. :gruebel:

Oder meinstest du

Delphi-Quellcode:

JvImage1.Picture.LoadFromStream(MStream);

statt

Delphi-Quellcode:

JvImage1.Picture.Bitmap.LoadFromStream(MStream);

.

Aber OK, wer weiß was die JEDI-Leute da intern alles "verdreht" haben.

[Cyberaxx]

Ich schau mir das nachher in Ruhe mal an. Bin mir da gerade auch nicht mehr so sicher. :(
Muss jetzt erstmal richtung heimat fahren. Feierabend :)

[Cyberaxx]

Delphi-Quellcode:

JvImage1.Picture.LoadFromStream(MStream);

Gibt es nicht. Es bleibt nur Bitmap übrig...

Um den Ausgangszustand anzuzeigen reichte jetzt

Delphi-Quellcode:

JvImage1.Picture.Assign(ButtonImage);

Nachteil ist, meine erste Methode zum Anzeigen es Icons funktioniert nun nimma.


@Bummi: Das Projekt schaue ich mir gleich an. Der Screen ist ja schon einmal nach meinen Vorstellungen :)

[Cyberaxx]

Wow die Komponente ist wirklich nicht schlecht.
Daraus kann ich sicher etwas basteln.

Dennoch und ich hoffe Du nimmst mir das nicht allzu übel, würde ich gerne wissen was ich an meinem Projekt so falsch mache...

Delphi-Quellcode:

  try
    aImage := TPngImage.Create;
    aImage.Assign(ButtonImage);
    //aImage.Width := 110;
    //aImage.Height := 94;
    X := Trunc(JvImage1.Picture.Width - IconImage.Width);
    aImage.Canvas.Draw(X,0, IconImage);
    JvImage1.Picture.Assign(aImage);
  finally
    aImage.Free;
  end;

Da wird der bereich abgeschnitten der Transparent ist vom Original Bild. Der Transparente bereich scheint keine Zeichenfläche mehr zu sein?
Versuch ich mal das PNGImage nach Bitmap und dann per Stream aufs JvImage zu setzen.

[Thom]

Zitat:

Zitat von Cyberaxx (Beitrag 1171100)

Versuch ich mal das PNGImage nach Bitmap und dann per Stream aufs JvImage zu setzen.

Achtung: Das Delphi-Objekt TPNGImage enthält einen Fehler, der bei

Delphi-Quellcode:

TBitmap.Assign(TPNGImage)

dazu führt, daß halbtransparente Bereiche abgedunkelt werden.

[Bummi]

Das dürfte an der Implementierung von Draw (DrawPartialTrans) in TPNGImage liegen.
Ich grabe schon eine ganze Weile in meinen Snipplets rum, finde aber bezüglich des "mischens" zweier "Bitmaps" mit Alphakanal nicht die richtigen Dateien.
TPNGImage verwendet intern Bitmaps mit Alphakanalinformationen, daher gibt es überhaupt eine Property Canvas. Eine schnelle Lösung auf Deiner Basis scheine ich nicht zu finden, sorry.

[Cyberaxx]

Ja Mit einem Bitmap alleine klappts nicht, habe ich eben bemerkt.
Das ich von einem TPNGImage die grösse nicht ändern kann nervt mich auch. Alles was transparent ist, kann nicht übermalt werden.

Da ich hier mal weiter kommen will werde ich erst einmal Q&D das Icon mittig setzen, dann klappts ja.

Wenn ich dann Ruhe habe schaue ich mir dein Testprojekt bzw. die Komponente genauer an. Danach werde ich dies darauf anpassen.
War eine dumme Idee sowas anzubieten, hatte es mir einfacher vorgestellt ;)

[Bummi]

In der Komponente steckt bis jetzt eine halbe Stunde Arbeit, noch mal soviel und Du hast IMHO die Faust aufs Auge Lösung. (Caption, Rahmen in dsDesigning,gegf. statt der Imagelisten direkt TPictures, gegf. die "Zahlen" selbst zeichnen, gegf. Zoom und Rotation einbauen, etc.)

[Cyberaxx]

Ja das sagst Du, Du hast scheinbar da auch Ahnung von. Ich hätte so etwas in einer halben Stunde nicht hinbekommen, nicht einmal Ansatzweise.
Bin ja schon froh wenn ich eine Komponente um ein Element erweitern kann.
Eine ganz eigenständige kann ich wohl auch aber davon nun hab ich echt keine Ahnung.

Wäre sicher sonst schon auf die Idee gekommen mir etwas eigenes zu bauen, was genau meinen Vorstellungen entspricht.
Die JvImage musste ich auch erstmal abändern. Da gab es ein Problem mit dem Status und dem entsprechenden Draw. Das hab ich auch noch so eben hinbekommen.