Az AutoIt egy fantasztikus eszköz, ha gyors, megbízható és automatizált feladatok elvégzésére van szükségünk Windows környezetben. A szkriptekkel nemcsak hatékonyságot növelhetünk, de sok esetben a felhasználói élményt is jelentősen javíthatjuk. Azonban van egy terület, ahol az alapértelmezett funkciók gyakran korlátokba ütköznek: ez pedig a vizuális testreszabás. Különösen igaz ez az egyszerű, de annál hasznosabb tooltip, vagyis az eszköztipp megjelenésére.
Gondoljunk csak bele: egy jól megírt szkriptnél is előfordul, hogy szeretnénk a felhasználónak extra információt nyújtani, figyelmeztetni egy fontos lépésre, vagy egyszerűen csak esztétikusabbá tenni az interakciót. Az alap AutoIt ToolTip() funkciója persze kiválóan működik – megjeleníti a szöveget, eltűnik, mindezt gyorsan és megbízhatóan. De mit tehetünk, ha ennél többre vágyunk? Mi van, ha nem csak fekete szöveget akarunk egy egyszerű szürke háttéren látni? Mi van, ha a tooltipet színezni szeretnénk, hogy jobban illeszkedjen a szkriptünk, vagy akár cégünk arculatához?
Miért van szükségünk színes tooltipre? ✨
Az első és legfontosabb ok a felhasználói élmény fokozása. Egy színes, kiemelt tooltip azonnal magára vonzza a figyelmet, és segít a felhasználónak gyorsabban feldolgozni az információt. Képzeljük el, hogy egy hibaüzenetnél piros háttérrel, vagy egy sikeres műveletnél zölddel jelenik meg az eszköztipp. Ez nemcsak informatív, de intuitív is. A vizuális visszajelzés ereje óriási, és az apró részletek, mint egy egyedileg formázott tooltip, sokat hozzátehetnek egy szkript „professzionális” megjelenéséhez.
Másrészt, a branding is szerepet játszhat. Ha cégünk belső eszközeit fejlesztjük AutoIt-tal, miért ne illesztenénk be a saját színeinket, logónkat vagy arculati elemeket? Egy egyszerű szürke téglalap helyett egy márkázott információs ablak sokkal egységesebb képet mutat. Ez az apró részlet is hozzájárulhat ahhoz, hogy a felhasználók komolyabban vegyék és jobban elfogadják az általunk fejlesztett eszközöket.
Az AutoIt alapértelmezett tooltip korlátai 🚧
Az AutoIt ToolTip() funkciója, mint már említettem, egyszerű és hatékony. Egyetlen sor kóddal megjeleníthetünk egy szöveget a kurzor pozíciójában, vagy egy megadott koordinátán. Azonban a funkció nem kínál közvetlen paramétereket a szöveg színének, a háttérszínnek, a betűtípusnak vagy az átlátszóságnak a módosítására. Ezért, ha valami egyedibbre vágyunk, alternatív megoldásokhoz kell folyamodnunk. De ne aggódjunk, ez egyáltalán nem olyan bonyolult, mint amilyennek elsőre tűnik!
A megoldás: Egyedi GUI vezérlők, mint tooltip 💡
A kulcs abban rejlik, hogy nem az AutoIt beépített ToolTip() funkcióját használjuk, hanem egy apró, átlátszó, keret nélküli GUI ablakot hozunk létre, amely tooltipként funkcionál. Ezt az ablakot tetszőlegesen formázhatjuk, hiszen egy teljes értékű AutoIt GUI ablakról van szó, minden funkciójával együtt. Ezáltal a háttérszín, a betűszín, a betűtípus, sőt, akár képek is megjeleníthetőek benne.
1. Lépés: A „tooltip” ablak létrehozása 🖼️
Először is, hozzunk létre egy egyszerű GUI ablakot, amely majd a tooltipünk lesz. Fontos, hogy ez az ablak keret nélküli ($WS_POPUP stílus), és ne legyen aktív ($WS_EX_TOOLWINDOW kiterjesztett stílus), hogy ne vegye el a fókuszt a fő alkalmazásunktól. Emellett célszerű kezdetben rejtve tartani (@SW_HIDE).
#include
#include
#include ; _GUICtrlSetFontColor
Global $hTooltipGUI
Func _CreateCustomTooltip()
$hTooltipGUI = GUICreate("Custom Tooltip", 200, 30, -1, -1, $WS_POPUP, BitOR($WS_EX_TOOLWINDOW, $WS_EX_TOPMOST))
GUISetBkColor(0xFF0000) ; Példa: piros háttér
GUISetState(@SW_HIDE, $hTooltipGUI)
EndFunc
Ebben a példában GUISetBkColor(0xFF0000) állítja be a piros háttérszínt. Természetesen tetszőleges RGB kódot használhatunk. A $WS_EX_TOPMOST stílus biztosítja, hogy a tooltip mindig más ablakok felett maradjon.
2. Lépés: Szöveg hozzáadása és formázása ✍️
Az ablakon belül használhatunk GUICtrlCreateLabel vezérlőt a szöveg megjelenítésére. Ennek a labelnek a háttérszínét átlátszóra állíthatjuk (vagy a GUI ablak háttérszínére), és a szöveg színét, betűtípusát is szabadon megadhatjuk.
Global $idTooltipLabel
Func _CreateCustomTooltip()
; ... (előző kód)
$idTooltipLabel = GUICtrlCreateLabel("", 0, 0, 200, 30)
GUICtrlSetBkColor($idTooltipLabel, 0xFF0000) ; A label háttérszíne is piros legyen
GUICtrlSetColor($idTooltipLabel, 0xFFFFFF) ; Fehér szöveg
GUICtrlSetFont($idTooltipLabel, 10, 400, 0, "Arial") ; Betűtípus, méret
GUISetState(@SW_HIDE, $hTooltipGUI)
EndFunc
Itt a GUICtrlSetBkColor() és GUICtrlSetColor() függvényekkel állítjuk be a label háttérszínét és a szöveg színét. A GUICtrlSetFont() pedig a betűtípus, a méret és a stílus (pl. félkövér) testreszabására szolgál. Ezekkel a függvényekkel már rendkívül sokféle megjelenést érhetünk el.
3. Lépés: A tooltip pozicionálása és megjelenítése 📍
A valódi tooltip élményhez elengedhetetlen, hogy az ablak a megfelelő helyen jelenjen meg, jellemzően a kurzor alatt, vagy egy adott vezérlőhöz képest. Ezt a WinMove() és a MouseGetPos() függvényekkel érhetjük el.
Func _ShowCustomTooltip($sText, $iX = -1, $iY = -1)
If Not IsHWnd($hTooltipGUI) Then _CreateCustomTooltip()
GUICtrlSetData($idTooltipLabel, $sText)
Local $aMousePos = MouseGetPos()
Local $iTipX = $aMousePos[0] + 15
Local $iTipY = $aMousePos[1] + 15
If $iX <> -1 And $iY <> -1 Then
$iTipX = $iX
$iTipY = $iY
EndIf
; A tooltip méretét a szöveghez igazítjuk (opcionális, de ajánlott)
Local $aTextSize = _GUICtrlGetTextSize($idTooltipLabel, $hTooltipGUI)
If @error Then $aTextSize = [200, 30] ; Alapértelmezett méret hiba esetén
GUICtrlSetPos($idTooltipLabel, 0, 0, $aTextSize[0] + 10, $aTextSize[1] + 5)
WinMove($hTooltipGUI, "", $iTipX, $iTipY, $aTextSize[0] + 10, $aTextSize[1] + 5)
GUISetState(@SW_SHOWNOACTIVATE, $hTooltipGUI)
EndFunc
Func _HideCustomTooltip()
GUISetState(@SW_HIDE, $hTooltipGUI)
EndFunc
A _GUICtrlGetTextSize függvény (amelyet magunknak kell implementálni, vagy egy UDF-ből használni) segít meghatározni a szöveg szélességét és magasságát, így a tooltip ablak pontosan akkora lehet, amekkorára szükség van. A @SW_SHOWNOACTIVATE stílus kulcsfontosságú, mert megakadályozza, hogy a tooltip elvegye a fókuszt, ami zavaró lenne a felhasználó számára.
Megjegyzés: A _GUICtrlGetTextSize függvényt a vagy a UDF-ekből lehet használni, vagy saját magunknak kell megírnunk a WinAPI függvényekkel (GetTextExtentPoint32).
4. Lépés: Eseménykezelés – Mikor jelenjen meg és tűnjön el? ⏳
Ez a lépés attól függ, hogy mi váltja ki a tooltip megjelenését. Legegyszerűbb esetben egy egérmozgás eseményre (OnEventMode vagy fő ciklusban MouseGetPos ellenőrzés) tudjuk reagálni. Ha egy konkrét vezérlő fölé visszük az egeret, megjelenik a tooltip. Amikor levisszük, eltűnik.
; Példa egy fő GUI ablak létrehozásával és egy gombbal
#include
#include
#include ; Szükséges a _GUICtrlGetTextSize-hez, ha használjuk
; Előtte: _CreateCustomTooltip() meghívása
_CreateCustomTooltip()
Local $hMainGUI = GUICreate("Fő Alkalmazás", 400, 300)
Local $idButton = GUICtrlCreateButton("Információ", 150, 100, 100, 30)
GUISetState(@SW_SHOW, $hMainGUI)
While 1
Local $iMsg = GUIGetMsg()
Switch $iMsg
Case $GUI_EVENT_CLOSE
_HideCustomTooltip()
Exit
Case $idButton
; Gomb kattintás esetén is lehet tooltip, de ez most az egérmozgásra fókuszál
EndSwitch
Local $aMousePos = MouseGetPos()
Local $aButtonPos = ControlGetPos($hMainGUI, "", $idButton)
If $aMousePos[0] >= $aButtonPos[0] And $aMousePos[0] = $aButtonPos[1] And $aMousePos[1] <= ($aButtonPos[1] + $aButtonPos[3]) Then
_ShowCustomTooltip("Ez egy színes tooltip a gombon!", $aMousePos[0] + 15, $aMousePos[1] + 15)
Else
_HideCustomTooltip()
EndIf
Sleep(50) ; Ne terhelje túl a CPU-t
WEnd
; ... _CreateCustomTooltip, _ShowCustomTooltip, _HideCustomTooltip függvények ide másolása ...
A felhasználói felületek tervezésénél gyakran elfeledkezünk arról, hogy a legkisebb vizuális visszajelzés is hatalmasat lendíthet a felhasználói elégedettségen. Egy jól megtervezett, színes tooltip nem csak információt szolgáltat, hanem az alkalmazásunkról alkotott képet is pozitívan befolyásolja. Ne becsüljük alá a részletek erejét!
Haladó tippek és trükkök 🚀
Átlátszóság beállítása
Az AutoIt WinSetTrans() funkciójával a tooltip ablakunkat átlátszóvá tehetjük. Ez egy nagyon elegáns hatás, ami még professzionálisabbá teszi a megjelenést. Például, ha 200-as értékre állítjuk (ahol 255 a teljesen átlátszatlan), a tooltip finoman áttetsző lesz.
WinSetTrans($hTooltipGUI, "", 200) ; 200 az átlátszóság szintje (0-255)
Körkörös vagy lekerekített sarkú tooltip
Ez már egy kicsit bonyolultabb feladat, de a GDI+ függvényekkel (#include ) akár lekerekített sarkú vagy teljesen egyedi formájú tooltip ablakot is létrehozhatunk. Ehhez a _WinAPI_SetWindowRgn() függvényre és a _GDIPlus_GraphicsPathAddRectangle(), _GDIPlus_GraphicsPathAddArc() függvényekre van szükség.
Fade-in/Fade-out hatás
A tooltip megjelenését és eltűnését finom átmenettel tehetjük elegánsabbá. Ehhez a WinSetTrans() függvényt kell használni egy rövid ciklusban, fokozatosan növelve vagy csökkentve az átlátszóságot. Ez egy kis extra kóddal jár, de látványos eredményt hozhat.
Func _FadeInTooltip($hWin)
For $i = 0 To 255 Step 15 ; 15-ös lépésköz, gyorsabb átmenet
WinSetTrans($hWin, "", $i)
Sleep(10)
Next
EndFunc
Func _FadeOutTooltip($hWin)
For $i = 255 To 0 Step -15
WinSetTrans($hWin, "", $i)
Sleep(10)
Next
EndFunc
Ezeket a függvényeket hívhatjuk meg a _ShowCustomTooltip és _HideCustomTooltip függvényekben.
Több tooltip különböző stílusokkal
Ha különböző típusú (pl. hiba, figyelmeztetés, információ) tooltipekre van szükségünk, egyszerűen létrehozhatunk több „tooltip” GUI ablakot, mindegyiket saját stílussal és színnel. A _ShowCustomTooltip függvényt ekkor kiegészíthetjük egy paraméterrel, amely meghatározza, melyik előre definiált stílusú tooltipet jelenítse meg.
Teljes, egyszerűsített példa a színes tooltipre 💡
Az alábbi kód egy egyszerű, de működő példát mutat be, amelyben egy gomb fölé mozgatva az egeret megjelenik egy piros hátterű, fehér szövegű tooltip.
#include
#include
; Global változók a tooltip ablakhoz és labelhez
Global $hTooltipGUI = 0
Global $idTooltipLabel = 0
; Fő szkript indulása
_MainGUI()
Func _MainGUI()
Local $hMainGUI = GUICreate("AutoIt Színes Tooltip Példa", 400, 300)
Local $idButton = GUICtrlCreateButton("Mutasd a Tooltipet!", 150, 120, 120, 40)
GUISetState(@SW_SHOW, $hMainGUI)
; Létrehozzuk a custom tooltip GUI-t
_CreateCustomTooltip()
Local $bTooltipShown = False
While 1
Local $iMsg = GUIGetMsg()
Switch $iMsg
Case $GUI_EVENT_CLOSE
_HideCustomTooltip()
GUIDelete($hMainGUI)
Exit
EndSwitch
; Ellenőrizzük az egér pozícióját
Local $aMousePos = MouseGetPos()
Local $aButtonPos = ControlGetPos($hMainGUI, "", $idButton)
; Ha az egér a gomb felett van
If $aMousePos[0] >= $aButtonPos[0] And $aMousePos[0] = $aButtonPos[1] And $aMousePos[1] <= ($aButtonPos[1] + $aButtonPos[3]) Then
If Not $bTooltipShown Then
_ShowCustomTooltip("Ez egy figyelmeztető üzenet!", $aMousePos[0] + 15, $aMousePos[1] + 15)
$bTooltipShown = True
EndIf
Else
If $bTooltipShown Then
_HideCustomTooltip()
$bTooltipShown = False
EndIf
EndIf
Sleep(50) ; Kis szünet, hogy ne terheljük feleslegesen a CPU-t
WEnd
EndFunc
; Függvény a custom tooltip GUI létrehozására
Func _CreateCustomTooltip()
If IsHWnd($hTooltipGUI) Then Return ; Már létezik
; Létrehozzuk a GUI ablakot: keret nélkül, nem aktiválódik, mindig felül
$hTooltipGUI = GUICreate("Custom Tooltip", 250, 40, -1, -1, $WS_POPUP, BitOR($WS_EX_TOOLWINDOW, $WS_EX_TOPMOST))
GUISetBkColor(0xD22B2B) ; Egy kellemesebb piros szín (Burgundy)
; Létrehozzuk a labelt a szövegnek
$idTooltipLabel = GUICtrlCreateLabel("", 5, 5, 240, 30) ; Kicsi margóval
GUICtrlSetBkColor($idTooltipLabel, 0xD22B2B) ; Label háttérszíne megegyezik az ablakéval
GUICtrlSetColor($idTooltipLabel, 0xFFFFFF) ; Fehér szöveg
GUICtrlSetFont($idTooltipLabel, 10, 700, 0, "Segoe UI") ; Félkövér, modern betűtípus
; Az ablakot kezdetben elrejtjük
GUISetState(@SW_HIDE, $hTooltipGUI)
EndFunc
; Függvény a custom tooltip megjelenítésére
Func _ShowCustomTooltip($sText, $iX, $iY)
If Not IsHWnd($hTooltipGUI) Then _CreateCustomTooltip()
; Frissítjük a label szövegét
GUICtrlSetData($idTooltipLabel, $sText)
; Meghatározzuk a szöveg méretét (egyszerűsített, fix méret a példában)
; Egy valós alkalmazásban itt dinamikusan kellene a label és az ablak méretét állítani
Local $iWidth = 250
Local $iHeight = 40
; Mozgatjuk a tooltip ablakot a kívánt pozícióba
WinMove($hTooltipGUI, "", $iX, $iY, $iWidth, $iHeight)
; Beállítjuk az átlátszóságot (opcionális)
WinSetTrans($hTooltipGUI, "", 220)
; Megjelenítjük a tooltipet anélkül, hogy aktiválnánk
GUISetState(@SW_SHOWNOACTIVATE, $hTooltipGUI)
EndFunc
; Függvény a custom tooltip elrejtésére
Func _HideCustomTooltip()
If IsHWnd($hTooltipGUI) Then
GUISetState(@SW_HIDE, $hTooltipGUI)
EndIf
EndFunc
Zárszó és gondolatok 💚
Ahogy láthatjuk, az AutoIt rugalmassága lehetővé teszi, hogy túllépjünk az alapértelmezett funkciók korlátain, és olyan vizuálisan vonzó, egyedi megoldásokat hozzunk létre, mint a színes tooltip. Noha ez egy apró részletnek tűnhet, a szkriptünk személyre szabása és a vizuális visszajelzés javítása jelentősen hozzájárulhat a felhasználói élményhez és az alkalmazásunk általános minőségéhez. Ne elégedjünk meg a „jóval”, ha egy kis extra munkával „kiváló” is lehet az eredmény! Kísérletezzünk a színekkel, a betűtípusokkal és az átlátszósággal – a lehetőségek tárháza végtelen, és a befektetett energia garantáltan megtérül a felhasználók elégedettségében. Próbáljuk ki bátran, és tegyük még vonzóbbá AutoIt szkriptjeinket! 🚀
