Clickable image (with a value)
#1
Posted 14 July 2012 - 08:36 AM
I currently have a dropdown list on my GUI where the user can select a value. This is a polling interval. It could be 15, 30, 45, 60.
To make this look smart I plan (hope) to use images.
My idea is as follows:
4 separate images. Each image would have one of the values highlighted. This would default to 15 so the original image would be my panel of 4 values but with 15 highlighted. If you click "30", the image will change to the one with 30 highlighted. And once I hit the "on" switch on my app it'll read the value and set the interval.
I hope that makes sense.
What is the best way to do this? I'm fine with the read/set just not sure how to work it with images. Would you have to identify the coordinates surrounding your highlighted number? Easily done?
Thanks
#2
Posted 14 July 2012 - 09:49 AM
Thanks.
#3
Posted 14 July 2012 - 10:12 AM
Why do you need to read the image? You have set the value with the combo, so just read that.
M23
Toast - Small GUIs which pop out of the Systray - Marquee - Scrolling tickertape GUIs
Scrollbars - Automatically sized scrollbars with a single command - GUIFrame - Subdivide GUIs into many adjustable frames
GUIExtender - Extend and retract multiple sections within a GUI - NoFocusLines - Remove the dotted focus lines from buttons, sliders, radios and checkboxes
ChooseFileFolder - Single and multiple selections from specified path tree structure - - Notify - Small notifications on the edge of the display
RecFileListToArray - An alternative to _FileListToArray with user-defined include/exclude masks, maximum recursion level, sorting and displayed path options
GUIListViewEx - Insert, delete, move, drag and sort ListView items
#4
Posted 14 July 2012 - 10:27 AM
I don't want to use the combo. Kinda ruins the rest of my GUI. I have that working, however, so the functionality is there - I just want the picture enhancement.
I have a nice photoshopped image (GIF) that looks like this -
[ (15) | 30 | 45 | 60 ] >>> default
If you click on 30, it would then update to a second image :
[ 15 | (30) | 45 | 60 ]
So, I want to do 2 things here.
1) When you click that number it changes the image to appropriate one.
2) When image is set to the (15) one, also set the interval = "30000".
I know how to do 2 but struggling with. I've tried the invisible labels but the image just kinda flickers and does not update.
Cheers
K
#5
Posted 14 July 2012 - 10:30 AM
I am creating a label (transparent) which is the size of the "15" block in my image. Same for 30, 45, 60.
Then using
Case $msg = $translabel1 GUICtrlSetData($image, _setImage($image, $15_pic) Case $msg = $translabel2 GUICtrlSetData($image, _setImage($image, $30_pic) .. and so on ...
The _setImage is in an icons file I downloaded from this forum to allow me to use transparent GIF files.
Hope that helps!
ps - this is probably the most inefficient / crazy way of doing this so if there's a better method please do tell
Edited by kiffab, 14 July 2012 - 10:33 AM.
#6
Posted 14 July 2012 - 10:33 AM
I understand. Perhaps something like this might be useful:
#include <GUIConstantsEx.au3> Global $aLabel[4], $aHighlight[4] $hGUI = GUICreate("Test", 500, 500) For $i = 0 To 3 $aLabel[$i] = GUICtrlCreateLabel($i + 1, 10 + (40 * $i), 10, 40, 40) GUICtrlSetFont(-1, 16, Default, Default, "Courier New") Next _SetHighlight(2) GUISetState() While 1 $iMsg = GUIGetMsg() Switch $iMsg Case $GUI_EVENT_CLOSE Exit Case $aLabel[0] To $aLabel[3] _SetHighlight($iMsg - $aLabel[0] + 1) EndSwitch WEnd Func _SetHighlight($iIndex) For $i = 0 To 3 GUICtrlDelete($aHighlight[$i]) Next $iX = (40 * $iIndex) - 30 - 2 $aHighlight[0] = GUICtrlCreateLabel("", $iX, 10, 20, 2) $aHighlight[1] = GUICtrlCreateLabel("", $iX, 30, 20, 2) $aHighlight[2] = GUICtrlCreateLabel("", $iX, 10, 2, 20) $aHighlight[3] = GUICtrlCreateLabel("", $iX + 18, 10, 2, 20) For $i = 0 To 3 GUICtrlSetBkColor($aHighlight[$i], 0xFF0000) Next EndFunc
Please ask if anything is unclear.
M23
Toast - Small GUIs which pop out of the Systray - Marquee - Scrolling tickertape GUIs
Scrollbars - Automatically sized scrollbars with a single command - GUIFrame - Subdivide GUIs into many adjustable frames
GUIExtender - Extend and retract multiple sections within a GUI - NoFocusLines - Remove the dotted focus lines from buttons, sliders, radios and checkboxes
ChooseFileFolder - Single and multiple selections from specified path tree structure - - Notify - Small notifications on the edge of the display
RecFileListToArray - An alternative to _FileListToArray with user-defined include/exclude masks, maximum recursion level, sorting and displayed path options
GUIListViewEx - Insert, delete, move, drag and sort ListView items
#7
Posted 14 July 2012 - 05:37 PM
Thanks for that. Looks like it'll work for what I'm trying to do.
Do I need to use variables or can I just use exact coordinates? The values are confusing me ;-)
Cheers
K.
#8
Posted 15 July 2012 - 06:59 AM
You can of course use exact coordinates - I just used the algorithm for speed of coding.
M23
Toast - Small GUIs which pop out of the Systray - Marquee - Scrolling tickertape GUIs
Scrollbars - Automatically sized scrollbars with a single command - GUIFrame - Subdivide GUIs into many adjustable frames
GUIExtender - Extend and retract multiple sections within a GUI - NoFocusLines - Remove the dotted focus lines from buttons, sliders, radios and checkboxes
ChooseFileFolder - Single and multiple selections from specified path tree structure - - Notify - Small notifications on the edge of the display
RecFileListToArray - An alternative to _FileListToArray with user-defined include/exclude masks, maximum recursion level, sorting and displayed path options
GUIListViewEx - Insert, delete, move, drag and sort ListView items
#9
Posted 15 July 2012 - 09:56 AM
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
(sample images attached)
Hi M23. Must admit, I am a bit lost here.
I am not sure whether that example will work for images or whether I am just not getting it. Probably the latter ;-)
I'm putting my default image in the top right corner:
$btn_interval = GUICtrlCreatePic('', 800, 20, 225, 33)_SetImage($btn_interval, @ScriptDir & "buttons15_poll.gif")
I'm then trying to create labels for each part of the image I want to be clickable, making them transparent so they are hidden (but clickable - not sure if possible!):
$time_15 = GUICtrlCreatelabel("", 810, 27, 48, 19) GuiCtrlSetBkColor(-1, $GUI_BKCOLOR_TRANSPARENT) $time_30 = GUICtrlCreatelabel("", 867, 27, 48, 19) GuiCtrlSetBkColor(-1, $GUI_BKCOLOR_TRANSPARENT) $time_45 = GUICtrlCreatelabel("", 917, 27, 48, 19) GuiCtrlSetBkColor(-1, $GUI_BKCOLOR_TRANSPARENT) $time_60 = GUICtrlCreatelabel("", 967, 27, 48, 19) GuiCtrlSetBkColor(-1, $GUI_BKCOLOR_TRANSPARENT)
I then want it so you have case statements or something where case = $time_15 .... change the image to one with 15 highlighted. case = $time_60, change the image to one with 60 highlighted etc.
Help
Thanks
K.
Edited by kiffab, 15 July 2012 - 09:57 AM.
#10
Posted 15 July 2012 - 10:11 AM
A Pic control has the default $SS_NOTIFY style, as do your labels which overlap it. So AutoIt gets confused when you click and does not know which control you wish to action - so it actions neither.
All you need to do is to create the Pic control without the default $SS_NOTIFY style:
$btn_interval = GUICtrlCreatePic('', 800, 20, 225, 33)_SetImage($btn_interval, @ScriptDir & "buttons15_poll.gif", $SS_BITMAP)
Now only the labels will be actioned and your script should work as you wish.
M23
Edit:
This works fine for me:
#include <GUIConstantsEx.au3> #include <StaticConstants.au3> $hGUI = GUICreate("Test", 500, 500) $btn_interval = GUICtrlCreatePic('', 10, 10, 225, 33, $SS_BITMAP) GUICtrlSetImage($btn_interval, @ScriptDir & "buttons15_poll.gif") $time_15 = GUICtrlCreatelabel("", 20, 17, 48, 19) GuiCtrlSetBkColor(-1, $GUI_BKCOLOR_TRANSPARENT) $time_30 = GUICtrlCreatelabel("", 80, 17, 48, 19) GuiCtrlSetBkColor(-1, $GUI_BKCOLOR_TRANSPARENT) $time_45 = GUICtrlCreatelabel("", 130, 17, 48, 19) GuiCtrlSetBkColor(-1, $GUI_BKCOLOR_TRANSPARENT) $time_60 = GUICtrlCreatelabel("", 180, 17, 48, 19) GuiCtrlSetBkColor(-1, $GUI_BKCOLOR_TRANSPARENT) GUISetState() While 1 Switch GUIGetMsg() Case $GUI_EVENT_CLOSE Exit Case $time_15 GUICtrlSetImage($btn_interval, @ScriptDir & "15_poll.gif") Case $time_60 GUICtrlSetImage($btn_interval, @ScriptDir & "60_poll.gif") EndSwitch WEnd
I will leave it to you to finish the Switch structure.
Edited by Melba23, 15 July 2012 - 10:24 AM.
Added code
Toast - Small GUIs which pop out of the Systray - Marquee - Scrolling tickertape GUIs
Scrollbars - Automatically sized scrollbars with a single command - GUIFrame - Subdivide GUIs into many adjustable frames
GUIExtender - Extend and retract multiple sections within a GUI - NoFocusLines - Remove the dotted focus lines from buttons, sliders, radios and checkboxes
ChooseFileFolder - Single and multiple selections from specified path tree structure - - Notify - Small notifications on the edge of the display
RecFileListToArray - An alternative to _FileListToArray with user-defined include/exclude masks, maximum recursion level, sorting and displayed path options
GUIListViewEx - Insert, delete, move, drag and sort ListView items
#11
Posted 15 July 2012 - 11:23 AM
$SS_BITMAP ....... so close but yet so far
Thanks once again
#12
Posted 15 July 2012 - 11:24 AM
My pleasure as always.
M23
Toast - Small GUIs which pop out of the Systray - Marquee - Scrolling tickertape GUIs
Scrollbars - Automatically sized scrollbars with a single command - GUIFrame - Subdivide GUIs into many adjustable frames
GUIExtender - Extend and retract multiple sections within a GUI - NoFocusLines - Remove the dotted focus lines from buttons, sliders, radios and checkboxes
ChooseFileFolder - Single and multiple selections from specified path tree structure - - Notify - Small notifications on the edge of the display
RecFileListToArray - An alternative to _FileListToArray with user-defined include/exclude masks, maximum recursion level, sorting and displayed path options
GUIListViewEx - Insert, delete, move, drag and sort ListView items
0 user(s) are reading this topic
0 members, 0 guests, 0 anonymous users




