EmotJi Icons

Hallo,

Seit WIN 10 sind ja auch die Emotji-Icons bei Windows mit an Bord. Die sind auch über

einen speziellen Font (Segoe UI Emoji.ttf) installiert. Einfügen kann man sie im Browser

oder einem RTF- Editfeld. Da ich diese Bildchen auch gerne in einer Imageliste haben

möchte, habe ich die 520 passenden HTML-Codes in einen Bereich gepackt, um sie in

einem HTMLWin anzuzeigen. Das klappt auch so ganz gut. Aber wie kopiere ich diese

in einem Rutsch in eine MemoryBitmap ? So, wie unten im Programm zu sehen, wird

immer nur der sichtbare Bereich des HTMLWin rein kopiert, je nachdem, wie man den

horizontalen Scrollbalken des HTMLWin schiebt.

Jetzt meine Frage :

Wie kann man die gesamte Breite (nicht die sichtbare) mit CopyBmpToMem kopieren ?

Immerhein ist die Breite ja 24.960 Pixel und nicht in einem Stück auf dem Bildschirm

anzeigbar. Aus Performancegründen will ich jetzt nicht 520 mal ein einzelnes Bild ins

HTMLWin zeichnen, immer Pos. 0, 0 und dann an die MemoryBmp dran kopieren,

sondern das in einem Rutsch machen.

Hat da jemand eine Idee ?

Zitat von SvenB

Die Emojis sind ja alle unterschiedlich breit, die wirst du kaum mit einer einfachen Rechnung ansteuern müssen.

Ja, ist mir am Freitag auch aufgefallen. Naja, ist ja auch ein Font. Das sieht man ja auch bei anderen Schriftarten.

Da ist das W breiter als das z.b. I. Falsch gedacht habe ich bestimmt bei dem HTML-String

font-size:48px\

Da dachte ich, daß die Größe fest sei.

Mit dem Tipp von Jens-Arne bin ich auch noch nicht so richtig weitergekommen.

Da kommen mit

breite = Len(z, ";") * 48 ' Anzahl der HTML-Codes * 48
MCls breite, 80
StartPaint browser
  CopyBmpToMem 0, 0 - breite, 80 > 0, 0
EndPaint
hpic = Create("hPic", 0, "&MEMBMP")

bei den ersten 10 nur Fragmente und nachher nichts mehr. Die Imageliste zeigt aber mit GetCount() 520 Elemente an.

Auch das hpic scheint irgendwie leer zu sein.

Eine Tastatur nicht. Die ist ja softwaremäßig schon in WINDOWS drin.

Sowas ähnliches habe ich vor, daß man die Bildchen mit der Maus anfassen

und auf einem Fenster (Static) per Drag&Drop positionieren kann.

Bloß mit der ImageListe ist es halt leichter, Drag&Drop zu realisieren.

Da gibt es ja auch genug Beispiele. Hatte schon mit den eingebauten

Icons von XProfan sowas gemacht.

Hier mal ein kleines Beispiel, damit ihr seht, was ich meine :

$H Windows.ph
$H Commctrl.ph

Declare Handle ilist, String icons, zg
Declare Long xOff, yOff, x, y, grid[]

x = 10 : y = 0

Window 900, 400

xOff = ~GetSystemMetrics(32)        '-------Dicke des Fensterrandes
yOff = ~GetSystemMetrics(4) + xOff '--Höhe der Titelleiste + Fensterrand

InitListe()
DrawList()

While 1
  WaitInput
  x = 10
  WhileLoop 0, 20
    If Mouse(Grid[&LOOP], y - Grid[&LOOP] + 32, 32)  '---Icon angeklickt?
      DoDragDrop(&LOOP)
    EndIf
  EndWhile
EndWhile


Proc InitListe
icons = "A,BAUM,COMPUTER,DOS,DRUCKER,EDITOR,EIMER,EIS,FILEICON,GESICHT,KNOPF1,KNOPF2,MUELL,MUENZE,PROFAN,SAND,STEIN,TEXT,WASSER,WEG,WINDOWS"
ilist = Create("ImageList", 32, 32)
WhileLoop 0, Len(icons, ",") - 1
  ImageList("AddIcon", ilist, Create("hIcon", SubStr$(icons, &LOOP + 1, ",")))
EndWhile
EndProc

Proc DoDragDrop
Parameters Long nr
~ImageList_BeginDrag(ilist, nr, (Grid[nr] - %mousex + 20), (y - yOff))
~ImageList_DragEnter(%HWnd, %mousex, %mousey)
While %MousePressed   '--Maustaste wird gehalten
     ~ImageList_DragMove(%mousex, %mousey)
Endwhile
If Between(%MouseX, 11, 869, %MouseY, 101, 299)
   ~ImageList_EndDrag()
    DrawIcon ilist, nr, %MouseX - 15, %MouseY -15
EndIf    
EndProc

Proc DrawList
Declare String z
x = 10 : y = 0
WhileLoop 0, GetCount(ilist) - 1
  DrawIcon ilist, &LOOP, x, y
  Grid[&LOOP] = x
  Inc x, 40
EndWhile
DrawText 10, 70, "Bitte ein Icon mit der linken Maustaste anfassen und halten und unten in die Box ziehen."
RoundRect 10, 100 - 870, 300; 0, 0
EndProc

DeleteObject ilist
End

Da fehlt natürlich noch das Raster im RoundRect und das genaue Einrasten.
Damit das Icon nur im Rahmen gezeichnet wird, habe ich Between() genommen.

Das war auch meine ursprüngliche Idee. Ich wollte mir nur kein großes Grafikprogramm installieren,

das die Icons auch nebeneinander, so wie die Toolbar32.bmp, speichern kann. Da bietet sich auch

so eine Speicherbitmap (MCLs, Create("hSizedPic",...) mit einstellbarer Größe an. In meinem obigen

Beispiel ist es ja uninteressant, da die Icons schon fest in den Interpreter/Runtime integriert sind.

Da glaube ich kaum, daß es da große Geschwindigkeitsunterschiede gibt. Immerhin muß ja die

ImageList die Bildchen einer solchen Toolbar als Bmp auch bis auf die angegbenen Größen rauf-

oder runterbrechen. Das einzig Langsame meiner obigen Methode ist die Schleife, was sich aber

bei einer Anzahl von 21 Bildchen in Grenzen hält.

Ja, wie die Toolbar bzw. Toolbar32, die in (X)Profan integriert ist. Kann man ja sehr leicht mit dem

RessourceHacker in den Interpreter und Runtime integrieren. Dann braucht man auch keine extra

Datei mitführen. Mit MCLs 520 * 32, 32 hätte man ja auch eine geeignete Zeichenfläche, wo alles

hintereinander draufpaßt. Bloß hatte ich damals nicht an den Font Segoe UI Emoji.ttf gedacht. Da

sind die Icons unterschiedlich in der Größe und somit hat er mir einen Strich durch die Rechnung

gemacht. . Und wie bekomme ich z.b. durch simulierte Tastendrücke die Icons hintereinander irgendwo

automatisch drauf ? Im Softwarekeyboard jedes einzelne Smielie doppleklicken und dann vom Clipboard

ins RTF ist nun keine Option für mich. Das müßte ich ja dann 520 mal machen.

Da die Icons ja auch als UNICODE verfügbar sind schwebt mir der Gedanke im Kopf ein Eidt-Control

mit @Control(...) zu erzeugen. Meines Wissens gibt es die Controls ja in zwei Varianten, wie z. b. :

MessageBoxA - Ansi-Version

MessageBoxW - Unicode-Version

Wenn es sowas auch für das einzeilige Editfeld gäbe/gibt, könnte man ja die Icons als langen String

(Unicodezeichen hintereinander mit ; ) mit SetText ins Editfeld setzen. Wenn SetText nicht funktioniert,

könnte man sich da vllt. mit einer API behelfen. Ist halt nur die Frage, wie man anschließend die Editzeile

als Bitmap wieder rausbekommt.

Vielleicht wäre es auch mit einem sehr breiten Static-Control machbar. Da könnte man mit

StartPaint static
  CopyBmpToMem
EndPaint

die Bitmap als Speicherbitmap bekommen. Aber da muß man auch erst mal das Static mit den Icons

bemalt bekommen.

Scheint doch alles nicht so einfach zu sein.

Oh, vielen Dank, funktioniert.

Hab jetzt die bei dir angehängte imagelist.png in MS Paint geöffnet und als .bmp gespeichert.

Mit dem ResHacker dann im Interpreter und Runtime bei den anderen Toolbars gespeichert.

Hiermal für die ersten 101 Icons :

Declare Handle ilist
Declare Long x, y

Window 800, 650
ilist = Create("ImageList", 48, 48, Create("hPic", 0, "EMOJI"))
x = 10
y = 10

WhileLoop 0, 100
   DrawIcon ImageList("GetIcon", ilist, &LOOP), x, y
   If x > 500
      x = 10
      Inc y, 50
   Else   
      Inc x, 60
   EndIf   
EndWhile


Waitkey
DeleteObject ilist

Die sind auch ratzfatz gezeichnet. Praktisch schon beim Fenster öffnen mit Window 800, 650 .

Dachte, das braucht 1-2 Sekündchen.

Danke nochmals.

PS:

Bei deinem obigen Bild bringst du mich auch auf eine Idee. Ob nun Smilies oder die schon integrierten Toolbars,

ist es immer mühsam, die Nummer des Icons in der ImageListe heraus zu tüfteln. Da wäre eine Anzeige

mit einem Programm im BenutzerMenü in der IDE sehr hilfreich. Da böte sich ja ein TreeView förmlich an.

Das könnte als Baum die Toolbar, Toolbar32 und meine Smilies-Bar als Text anzeigen und beim Draufklicken bzw.

Auswählen jeweils die laufende Nummer (nullbasiernd) und das jeweilige Bildchen dazu anzeigen. Hab sowas

schon mal mit der Toolbar alleine gemacht, allerdings nur als reine Fensterausgabe. Aber mit den vielen

Smilies paßt das da nicht mehr.

Wäre auch gut für andere hier im Forum. Da setze ich mich mal demnächst dran.

Naja, Namen wird man wohl auch nicht viele im Gedächtnis behalten können

und auch nicht das Bildchen dazu. OK, ein Grinz-Smilie, Traurig-Smilie o. ä.

schon, halt die wichtigsten, was Gesichter anbetrifft. Aber aus der ganzen Masse

heraus finde ich besser, wenn man das Smilie auch sieht, das man für den jeweiligen

Verwendungszweck braucht und was es alles gibt. Ist aber trotzdem brauchbar, wenn

ich jetzt genau weiß, daß ich z.b. ein Bild von einer Maus brauche. Das grenzt dann

die Suche deutlich ein und man hat einen besseren Überblick.

Insofern

Habe schon mal angefangen, wie ich mir so ein TreeView vorstelle. Ich hätte da aber ein paar Fragen dazu.

Schade halt, daß xprofan.net auch ausgefallen ist. Sonst könnte ich zuerst dort suchen.

Declare Handle tblist1, tv, header, subheader1, subheader2
Declare Long eintr1[], eintr2[]

Window 800, 650
tblist1  = Create("ImageList", 48, 48, Create("hPic", 0, "toolbar32"))
tv     = Create("TreeView", %HWnd, tblist1, 10, 10, 300, 500)
Header = TreeView("InsertItem",tv, 0, 0, "Toolbars")
subheader1 = TreeView("InsertItem",tv, header, 0, "Toolbar 32")
WhileLoop 0, GetCount(tblist1) - 1
  eintr1[&LOOP] = TreeView("InsertItem", tv, subheader1, &LOOP, Str$(&LOOP))
EndWhile
subheader2 = TreeView("InsertItem",tv, header, 0, "Smilies") 
WhileLoop 0, 10
  ' hier käme meine Imagelist der Smilies zum Einsatz
  eintr1[&LOOP] = TreeView("InsertItem", tv, subheader2, 48, "Noch keine Einträge !")
EndWhile

TreeView("SetChildren", tv, header, 1)
TreeView("SetChildren", tv, subheader1, 1)
TreeView("SetChildren", tv, subheader2, 1)

While 1
  WaitInput
EndWhile
DeleteObject tblist1

Da RGH Funktionalitäten (z.b. openGL, dbase, json usw.) öfter nur rudimentär implementiert hat, stellt sich

mir die Frage, ob man per API bei dem TreeView (TV) etwas nachhelfen kann. Mich stört z.b. daß man schon beim

Erstellen des TV die Imagelist angeben muß. Da werden die Bildchen ja schon im Oberast angezeigt. Ich bräuchte sie

ja erst bei den SubItems (Unterästen) und nicht im zentralen Baum. Gibt es da eine Möglichkeit / API diese nachträglich

zuzuweisen ? Und ist es möglich, mit mehreren Imagelisten zu arbeiten ? Ich bräuchte ja für jede Toolbar (und meiner Smilies-Toolbar)

eine extra Imageliste. Ich möchte gerne vermeiden, für jede Toolbar ein extra TreeView zu erstellen, somit man dann alles zentral

zusammen hat.

Vielleicht kennt sich ja jemand damit aus.

Ich hatte da was in den Untiefen meines USB-Sticks gefunden (siehe Datei-Anhang) :

Aber wie ich da eine neue ImageList mit

TreeView("SetOverlayImage", tv, Header, tblist1)

einsetze weiß ich nicht.

$H Messages.ph
$H Windows.ph
$H Commctrl.ph
$I TvConti1.inc
Declare Handle tblist1, tblist2, tv, header, subheader1, subheader2
Declare Long eintr1[], eintr2[]

Window 800, 650
tblist1  = Create("ImageList", 48, 48, Create("hPic", 0, "toolbar32"))
tblist2  = Create("ImageList", 48, 48, Create("hPic", 0, "EMOJI"))

tv     = Create("TreeView", %HWnd, 0, 10, 10, 300, 500)
Header = TreeView("InsertItem",tv, 0, 0, "Toolbars")
subheader1 = TreeView("InsertItem",tv, header, 0, "Toolbar 32")
TreeView("SetOverlayImage", tv, Header, tblist1)
WhileLoop 0, GetCount(tblist1) - 1
  eintr1[&LOOP] = TreeView("InsertItem", tv, subheader1, &LOOP, Str$(&LOOP))
EndWhile
subheader2 = TreeView("InsertItem",tv, header, 0, "Smilies") 
WhileLoop 0, 10
  ' hier käme meine Imagelist der Smilies zum Einsatz
  eintr1[&LOOP] = TreeView("InsertItem", tv, subheader2, 48, "Noch keine Einträge !")
EndWhile

TreeView("SetChildren", tv, header, 1)
TreeView("SetChildren", tv, subheader1, 1)
TreeView("SetChildren", tv, subheader2, 1)

While 1
  WaitInput
EndWhile
DeleteObject tblist1, tblist2

Also, wie es ausschaut geht das nicht.

Ich habe jetzt im Netz mehrmals gelesen, daß das Standard - Treeview entweder nur

eine oder halt keine ImageList haben kann. Und RGH hat ja mit Sicherheit das Standard

Treeview und kein owner drawed Treeview genommen.

Also bleibt mir nichts anderes übrig, als für jede Toolbar ein eigenes Treeview mit der dazugehörigen

ImageList zu machen.

Ich konnte es jetzt auf 2 Treeviews eingrenzen.

In der ersten werden die Resourcen (Bitmap, wo die Toolbars gespeichert sind)

ausgelesen und je nach Klick darauf erscheint ein zweites TreeView, das dann

die Icons der jeweiligen Toolbar anzeigt. Die Größen der Icons ermittele ich durch

Create("hPic",...) und der gesetzten Systemvariablen %BmpY. Diese ist dann auch

maßgebend für die Größe der ImageListe. Nun ist was kleines, feines rausgekommen.

Kann man auch schön ins Benutzermenü machen. Dann hat man es immer zur Hand.

Probiert es mal aus (ab X3 wegen AddRes).

' AB XPROFAN X3  wegen AddRes
Declare Handle htv, tv, Header
Declare Long item, idx, ende
Declare String  tlists[], name

WindowTitle "TOOLBAR - VIEWER"
Window 800, 650
UseIcon "A"
ende = 0

InitRessourcen()
UserMessages $10
WhileNot ende
  WaitInput
  If Clicked(htv)
     item = TreeView("GetSelected", hTV)
     name = GetText$(hTV, item)
     idx = IndexOf(tlists[], name)
     If idx <> - 1
        case tv <> 0 : DestroyWindow(tv)
        MakeTV(name)
        TreeView("Expand", tv, Header, 2)
     EndIf
  EndIf
  Case %UMessage = $10 : ende = 1
EndWhile

Proc MakeTV
Parameters String picname
Declare Handle tb, pic
pic = Create("hPic", 0,  picname)
tb = Create("ImageList", %Bmpy, %BmpY, pic)
tv     = Create("TreeView", %HWnd, tb, 400, 10, 300, 500)
Header = TreeView("InsertItem",tv, 0, 0, picname)

WhileLoop 0, GetCount(tb) - 1
   TreeView("InsertItem", tv, Header, &LOOP, Str$(&LOOP))
EndWhile
TreeView("SetChildren", tv, header, 1)
EndProc

Proc InitRessourcen
Declare String bars
htv = Create("TreeView", %HWnd, 0, 30, 30, 150, 150)
Create("GroupBox", %HWnd, "Toolbar - Ressourcen", 5, 5, 200, 200)
ClearList
AddRes %hInstance, 2, 0
AddRes %hInstance, 2, htv
WhileLoop 0, GetCount(0) - 1
    bars = bars + SubStr$(GetString$(0, &LOOP), 2, "|") + ","
EndWhile
bars = Left$(bars, Len(bars) - 1)
tlists[] = Explode(bars, ",")
EndProc

End

Verbesserungen sind auch willkommen. Vielleicht habe ich auch noch einen Fehler drin, der erst

später bemerkt wird.