Wie komplexe GUI erzeugen?

  • Hallo Zusammen,

    ich habe einen netzwerkfähigen Samsung-Fernseher, den ich gerne via PC fernsteuern würde. Den Part, wie ich mit dem Fernseher kommunizieren muss, habe ich mittlerweile herausgefunden. Das würde pauschal schon mal funktionieren.

    Viel mehr Kopfzerbrechen macht mir die GUI, da ich mit GUIs prinzipiell kämpfe und ich zum anderen grafisch auch völlig unbegabt bin.

    Es gibt bereits eine Applikation in Java, die aber eine viel zu große GUI hat. Über 900 Pixel hoch, große Buttons. Ansich sehr schön, aber für mich zu wuchtig und leider stimmen viele Tasten nicht.

    Mein Idealziel wäre, wenn ich ne Gui hätte, die sich in der Größe verändern läßt, also durch das resizen des Fensters. Jetzt habe ich keine konkrete Vorstellung, wie man das am einfachsten realisieren könnte.

    Evtl. die Fernbedienung einscannen, als Image ablegen und dann irgendwie nen eigenen Eventhandler schreiben, der die Mausposition bestimmt und dadurch die betreffende Taste? Nur wie macht man sowas und wie mache ich es, dass man auch sieht, auf welcher Taste man ist und auch gedrückt hat? Gibt es da irgendwelche Möglichkeiten?

    Oder muss ich alle Buttons einzeln zeichnen, das wären ganz schön viele, oder wie macht man das? Und wenn Zeichnen, mit welchem Programm?

    Ich hab mal den Scan einer Samsung-Fernbedienung und 3 Screenshots der Java-App angehängt. Im 3. Foto sieht man, dass die Maus über dem Button "Tools" ist. Die wird beleuchtet.

    Besten Dank schon mal für alle Tipps und noch nen schönen Sonntag!
    R@iner

  • Ich denke du könntest es lösen,indem du das Bild reinmachst, und dann sobald man auf das Bild klickt (OnEvent oder GuiGetMsg) die Mausposition abfragt. Dann musst du halt für jede Taste das Feld definieren, wo es halt als Taste zählt.

    Und wegen der Größe verändern, wäre es nicht sinnvoller wenn du es eine konstante Größe machst, da sich sonst jenachdem wie man die Fenstergröße verändert das Bild verzerrt? (Geschweige denn das sich dann auch die Tasten Koordinaten verschieben..)

  • Oder nimm einfach GuiCtrlCreatePic und benutze die als Knöpfe.
    Muss jetzt leider weg, kann dir morgen gerne ein beispiel machen.
    Auch wie du die bilder dann in eine dll machst :P

  • Ich denke du könntest es lösen,indem du das Bild reinmachst, und dann sobald man auf das Bild klickt (OnEvent oder GuiGetMsg) die Mausposition abfragt. Dann musst du halt für jede Taste das Feld definieren, wo es halt als Taste zählt.


    Jo, das meinte ich mit "eigenen Eventhandler". Nur wie kann ich dann die Taste irgendwie hervorheben, beleuchten oder optisch so verändern, dass es aussieht, als würde sie gedrückt? Oder ist sowas dynamisch nicht möglich?

    Und wegen der Größe verändern, wäre es nicht sinnvoller wenn du es eine konstante Größe machst, da sich sonst jenachdem wie man die Fenstergröße verändert das Bild verzerrt? (Geschweige denn das sich dann auch die Tasten Koordinaten verschieben..)


    Also man kann nen eigenen Resize-Handler schreiben, der eben das Bild immer im gleichen Verhältnis vergrößert oder verkleinert. Das mit den Tastenkoordinaten sollte dann dementsprechend angepaßt werden oder mit irgend einem Faktor multipliziert werden, dass die wieder passen.

    Oder nimm einfach GuiCtrlCreatePic und benutze die als Knöpfe.


    Das heißt aber, dass ich jeden Knopf erzeugen muss. Und auch ein Bild machen. Und wie sieht es dann bei einem Resizing des Fensters aus?

    Muss jetzt leider weg, kann dir morgen gerne ein beispiel machen.
    Auch wie du die bilder dann in eine dll machst :P


    Ich kenne nur die Möglichkeit, Icons via #AutoIt3Wrapper_Res_Icon_Add der Exe hinzuzufügen und später via GUICtrlSetImage(-1, @ScriptFullPath, <iconnummer>) das Icon nem Button zuzuweisen.

    happy computing!
    R@iner

  • Ich weiß nicht ob das Thema bereits gelöst ist (Prfäix steht noch auf offen). Wenn das der Fall ist:

    Zitat

    Jo, das meinte ich mit "eigenen Eventhandler". Nur wie kann ich dann die Taste irgendwie hervorheben, beleuchten oder optisch so verändern, dass es aussieht, als würde sie gedrückt? Oder ist sowas dynamisch nicht möglich?


    Evtl über GDI+ oder mit 2 Bildern, einmal der gedrückte Button und einmal der normale, aber dann würde man die Bilder wieder einzelnd draufzeichnen müssen.

    Zitat

    Also man kann nen eigenen Resize-Handler schreiben, der eben das Bild immer im gleichen Verhältnis vergrößert oder verkleinert. Das mit den Tastenkoordinaten sollte dann dementsprechend angepaßt werden oder mit irgend einem Faktor multipliziert werden, dass die wieder passen.


    In % würde ich es machen. Ist aber eig das selbe. (Evtl immer GUIGröße bekommen und dann dreisatz)

    mfg BB

    "IF YOU'RE GOING TO KILL IT
    OPEN SOURCE IT!"

    by Phillip Torrone

    Zitat von Shoutbox

    [Heute, 11:16] Andy: ....böseböseböseböse....da erinnere ich mich daran, dass man den Puschelschwanz eines KaRnickels auch "Blume" nennt....ob da eins zum anderen passt? :rofl: :rofl: :rofl: :rofl:

    https://autoit.de/index.php?page…leIt#post251138

    Neon Snake

  • Ich weiß nicht ob das Thema bereits gelöst ist (Prfäix steht noch auf offen). Wenn das der Fall ist:


    Ne, das ist noch offen. So schnell bin ich auch nicht. :)

    Evtl über GDI+ oder mit 2 Bildern, einmal der gedrückte Button und einmal der normale, aber dann würde man die Bilder wieder einzelnd draufzeichnen müssen.


    Hast Du da nen Beispielcode oder kannst Du mir stichpunktartig sagen, wie Du das meinst?

    happy computing!
    R@iner

  • Ein ganz kleines Beispiel mit GuiCtrlCreatePic ()

    [autoit]

    Global $sPath = @DesktopDir

    [/autoit][autoit][/autoit][autoit]

    $hWND = GUICreate("Button geklickt/ungeklickt")
    $hPic = GUICtrlCreatePic($sPath & "\Button ungeklickt.jpg", 0, 0, 100, 30)
    GUISetState()

    [/autoit][autoit][/autoit][autoit]

    While 1
    $nMsg = GUIGetMsg()

    [/autoit][autoit][/autoit][autoit]

    Switch $nMsg
    ;~ Case $hPic
    ;~ GUICtrlSetImage($hPic, $sPath & "\Button geklickt.jpg")
    Case -3
    Exit
    EndSwitch

    [/autoit][autoit][/autoit][autoit]

    $nCursor = GUIGetCursorInfo()

    [/autoit][autoit][/autoit][autoit]

    If $nCursor[0] >= 0 And $nCursor[0] <= 100 And $nCursor[1] >= 0 And $nCursor[1] <= 30 And $nCursor[2] = 1 Then
    GUICtrlSetImage($hPic, $sPath & "\Button geklickt.jpg")
    Else
    GUICtrlSetImage($hPic, $sPath & "\Button ungeklickt.jpg")
    EndIf

    [/autoit][autoit][/autoit][autoit]

    WEnd

    [/autoit]
  • Super danke, das mit einzelnen Buttons ist mir klar. Ich meinte eigentlich eher, dass ich ein großes Bild nehme, wie z.B. das Bild der ganzen Fernbedienung und je nach Mausposition wird der Bereich heller oder zumindest soll es deutlich sichtbar sein, dass die Maus drüber ist. Eventuell noch einen dritten "State", wenn die Maustaste gedrückt ist.

    Und welcher Bereich heller wird, muss man halt vorher irgendwo definieren, welche Taste wo beginnt und wo endet. Und das "heller Bild" irgendwie gerechnet, also das Originalbild irgendwie durch Berechnung heller machen und dann die Stelle im Bild ausgetauscht und wieder darstelt. Wenn das bereichweise Austauschen nicht geht, dann notfalls das neu gezeichnet ganze Bild. Ich weiß nicht, ob sowas überhaupt geht?! Ich möchte immer noch vermeiden, dass ich das ganze Bild komplett in einzelnen Buttons zerlegen muss oder gar gleich neu zeichnen. Ich bin kein Grafik und auch kein Gui-Profi :(

    happy computing!
    R@iner

  • Dann würde ich es mit GDI+ machen, indem du die Grundfläche immer zeichnest und ggf. den passenden gedrückt Button, oder auch einfahc nur ein leicht durchsichtiges Rechteck mit der passenden Größe, über den Button legst den du klicken möchtest:

    Also:

    Bild wird immer gemalt...

    Wenn Maus auf Bild klickt (bzw drüber ist ("Hover")) dann

    - das passende Hover/geklickt Bild auf die richtige Stelle malen
    - ein leicht durchsichtiges Rechteck (weiß nicht ob das gut aussieht)

    mfg BB

    "IF YOU'RE GOING TO KILL IT
    OPEN SOURCE IT!"

    by Phillip Torrone

    Zitat von Shoutbox

    [Heute, 11:16] Andy: ....böseböseböseböse....da erinnere ich mich daran, dass man den Puschelschwanz eines KaRnickels auch "Blume" nennt....ob da eins zum anderen passt? :rofl: :rofl: :rofl: :rofl:

    https://autoit.de/index.php?page…leIt#post251138

    Neon Snake

  • Dann würde ich es mit GDI+ machen, indem du die Grundfläche immer zeichnest und ggf. den passenden gedrückt Button, oder auch einfahc nur ein leicht durchsichtiges Rechteck mit der passenden Größe, über den Button legst den du klicken möchtest:


    Was meinst Du mit "über den Button legen"?

    Bild wird immer gemalt...


    Das Original, oder ein evtl das modifizierte Bild?

    Wenn Maus auf Bild klickt (bzw drüber ist ("Hover")) dann
    - das passende Hover/geklickt Bild auf die richtige Stelle malen
    - ein leicht durchsichtiges Rechteck (weiß nicht ob das gut aussieht)


    Ist mir nicht ganz klar, wie Du das meinst, aber dazu muss ich die Befehle von GDI+ erstmal sehen. Nur leider findet die Forumsuche nichts bei GDI+, denn das "+" wird ja immer als Steuerzeichen interpretiert. Ist das eine UDF?

    happy computing!
    R@iner

  • Ist mir nicht ganz klar, wie Du das meinst, aber dazu muss ich die Befehle von GDI+ erstmal sehen. Nur leider findet die Forumsuche nichts bei GDI+, denn das "+" wird ja immer als Steuerzeichen interpretiert. Ist das eine UDF?

    GDI+ (Auch GDIPlus) ist eine, schon in AutoIt mitgelieferte UDF. Sie dient zum verwenden von Graphicen, Bitmaps etc und kann zum draufmalen auf GUIs benutzt werden. In meiner Signatur findest du ein paar Spiele die in GDI+ gecodet sind.

    Was meinst Du mit "über den Button legen"?

    In GDI+ wird alles immer auf die Graphic gemalt. In unserem Fall malen wir erst das UNVERÄNDERTE BILD, eins von denen die du im ersten Post hast.

    Das Original, oder ein evtl das modifizierte Bild?

    Hab ich gerade erklärt


    *****************************************
    Um es dir bildlisch vorzustellen stell dir vor auf deinem Schreibtisch liegt ein Blatt mit eiem der Bilder aus dem ersten Post.
    Jetzt stell dir vor du legst ein weites kleineres Bild mit einem schönen Button drauf auf einen der Button. Jetzt siehst du natürlich alles normal bis auf die Stelle wo das kleiner Bild draufliegt, da dieses ja das darunter überdeckt.

    So funktioniert GDI+

    mfg BB

    "IF YOU'RE GOING TO KILL IT
    OPEN SOURCE IT!"

    by Phillip Torrone

    Zitat von Shoutbox

    [Heute, 11:16] Andy: ....böseböseböseböse....da erinnere ich mich daran, dass man den Puschelschwanz eines KaRnickels auch "Blume" nennt....ob da eins zum anderen passt? :rofl: :rofl: :rofl: :rofl:

    https://autoit.de/index.php?page…leIt#post251138

    Neon Snake

  • GDI+ (Auch GDIPlus) ist eine, schon in AutoIt mitgelieferte UDF.


    Argl, dann sag das doch gleich, dass das GDIPlus heißt :)

    Um es dir bildlisch vorzustellen stell dir vor auf deinem Schreibtisch liegt ein Blatt mit eiem der Bilder aus dem ersten Post.
    Jetzt stell dir vor du legst ein weites kleineres Bild mit einem schönen Button drauf auf einen der Button. Jetzt siehst du natürlich alles normal bis auf die Stelle wo das kleiner Bild draufliegt, da dieses ja das darunter überdeckt.


    Ok verstanden. Jetzt nochmal zu dem "kleineren Bild": Gibt es da irgendwelche Algorithmen, um den original Bereich herauszuholen, denn irgendwie mathematisch aufzuhellen, den dann auf den original Bereich darüber zu legen, damit man deutlich sieht, dass die Maus in diesem Bereich ist und dass dieser gewisse Button gemeint ist?

    So funktioniert GDI+


    Du redest Dich leicht :)

    Dank Dir und happy computing!
    R@iner

  • Zitat

    Ok verstanden. Jetzt nochmal zu dem "kleineren Bild": Gibt es da irgendwelche Algorithmen, um den original Bereich herauszuholen, denn irgendwie mathematisch aufzuhellen, den dann auf den original Bereich darüber zu legen, damit man deutlich sieht, dass die Maus in diesem Bereich ist und dass dieser gewisse Button gemeint ist?


    Ja. Nicht direkt Algorithmen, sondern eher fertige Funktionen, aber das kommt ja auf das selbe raus. ;)

  • Ja. Nicht direkt Algorithmen, sondern eher fertige Funktionen, aber das kommt ja auf das selbe raus. ;)


    Also _GDIPlus_BitmapCreateFromHBITMAP und _GDIPLus_GraphicsDrawImageRect sehen ja schon mal gut aus. Aber ich hab bisher nichts gefunden, so ein extrahiertes Bitmap "aufzuhellen".

    Gibt es sowas wie PtInRect? Dann könnte ich die Koordinaten der Buttons in Rects ablegen.

    Da muss ich noch viele Beispiele anschauen. :) Gibt es für GDIplus irgendwo ein Tutorial?

    happy computing!
    R@iner

  • Zitat

    Also _GDIPlus_BitmapCreateFromHBITMAP und _GDIPLus_GraphicsDrawImageRect sehen ja schon mal gut aus. Aber ich hab bisher nichts gefunden, so ein extrahiertes Bitmap "aufzuhellen".


    GDIPlus unterstützt ein ARGB Farbsystem. Das heißt, du kannst dank dem Alpha Channel z.B. einen leicht transparenten Brush (_GDIPlus_BrushCreateSolid) eerzeugen und über die gewünschte Stelle legen.

  • [autoit]

    _WinAPI_PtInRect

    [/autoit]


    Geht aber nur im 32 Bit Modus ;)


    Huch, wieso dass denn? Memory-Alligment wieder? Pointer sollten doch richtig übersetzt werden. Oder wie würdest Du es machen, also Maus-Position in einem Array mit Button-Rects überprüfen?

    GDIPlus unterstützt ein ARGB Farbsystem. Das heißt, du kannst dank dem Alpha Channel z.B. einen leicht transparenten Brush (_GDIPlus_BrushCreateSolid) eerzeugen und über die gewünschte Stelle legen.


    Ok, anhand des Beispiels in der AutoIt-Hilfe werde ich nicht schlau. :( Und wie mir das beim Aufhellen helfen soll, schon zweimal nicht. Ich werd mal am Wochenende anfangen.

    Gibt es ein GDIplus-Tutorial?

    sorry ich habe gerade leider auch nicht so viel Zeit aber guck dir mal meine Ribbons Bar an.


    Jo danke, ich schau mal drüber.

    happy computing!
    R@iner

  • Super, merci! An google denke ich immer nicht, weil ich die Forensuche normalerweise benutze. :(

    In diesem Fall stört die sich an dem "+". Aber Tante Gurgel hat wie immer geholfen! Sie macht aus dem GDIplus auch ein GDI+. Und als Ergänzung site:autoit.de als Suchkriterium hilft beim Einschränken auf das Forum hier. Ich werde nur noch Tante Gurgel benutzen.

    Danke nochmal. Dann hab ich ja am Wochenende erst mal was zu lesen.

    happy computing!
    R@iner