Firefox menu button - how did they do it?

[orbs]

did you notice the Firefox menu button? it may seem simple but it's interesting: as i understand, it is a graphic element located on the title bar, replacing standard icon and title, it changes color when hover on it, it has its own edges which integrates gracefully with the window edge, and although it has no visible upper edge, it is "draggable" like any other edge of the window.

i was wondering - how did they do it?

(yes i know it's open source, but i'm no programmer, and i favor AutoIt for its ability to speak English, while other programming languages speak "Computerish" which i can't understand).

i know how to show a context-menu upon click, and how to change graphic appearance on hover, and i have seen solutions on how you can attach your own "mini"-GUI to any window title bar. but this one seems way too "neat" to use that technique.

if i wanted to do a similar thing with my GUI, how would i go about it?

thanks for any thoughts

[l3ill]

Hi orbs,

  The part you said you don't know how to to do would be be the graphic?

Opera has the same basic button and if you have a look at appearances it shows the button without background

So all you would have to do is make 2 or 3 buttons for base, hover and click and integrate them into this position in your GUI.

Personally never done it but in theory doesn't seem too difficult.

cya

Bill

[orbs]

thanks l3ill, but actually i'm ok with that part. what i can't figure out is how to put my graphic on the title bar, instead of the icon and title text, and make it so elegantly mimic the native window style.

[l3ill]

have a look here >Valuater's code might get you thinking in the right direction..

post back if you make any progress, I would be interested to see if it works.

[orbs]

at first glance it appears that the code is writing the GUI completely from scratch - GUICreate with style $WS_POPUP. that may be the way to go, but i was hoping to avoid that and let Windows draw the window using the native style. i'll take a closer look. thanks for the reference!

[l3ill]

Just a reference, exactly....

There are some GUI gurus around that might have some better ideas...UEZ for one and it looks like he is online.

good luck!

[DatMCEyeBall]

...UEZ for one and it looks like he is online...

*GDI+ guru...

[orbs]

ok, completely not what i had in mind, but still... i made a simple non-resizable smartphone-like GUI, with a button at the top, like this:

what i'm now struggling with is to draw a contour line around the GUI, same color as the sunken edge of the button. i've been trying to follow the line with PixelGetColor() but that failed miserably. there must be a simpler way to this?

expandcollapse popup

#include <StaticConstants.au3>
#include <Array.au3>
#include <WindowsConstants.au3>
#include <GuiConstants.au3>

Opt('PixelCoordMode',0)

$my_gui = GuiCreate('', 290, 500, Default,Default,$WS_POPUP)
GUISetBkColor(0x333340)

_GuiRoundCorners($my_gui, 0, 0, 40, 40)

$gArea=GUICtrlCreateGraphic(0,0,290,500)

; button
Global $cHeadButtonColor=0xCCDDEE
$gHeadButtonPaddingTop=GUICtrlCreateLabel('',81,0,200-81,3,$SS_CENTER)
GUICtrlSetBkColor(-1,$cHeadButtonColor)
GUICtrlSetCursor(-1,0)
$gHeadButtonLabel=GUICtrlCreateLabel('My App Title',81,3,200-81,20,$SS_CENTER)
GUICtrlSetBkColor(-1,$cHeadButtonColor)
GUICtrlSetCursor(-1,0)
GUICtrlSetFont(-1,Default,800)
; button sunken edge
GUICtrlSetGraphic($gArea, $GUI_GR_COLOR, 0x77CCCC)
GUICtrlSetGraphic($gArea,$GUI_GR_MOVE,79,0)
GUICtrlSetGraphic($gArea,$GUI_GR_LINE,79,24)
GUICtrlSetGraphic($gArea,$GUI_GR_LINE,280-79,24)
GUICtrlSetGraphic($gArea,$GUI_GR_LINE,280-79,-1)

GUICtrlSetState($gArea,$GUI_DISABLE)
GuiSetState()

GUIRegisterMsg($WM_NCHITTEST, 'WM_NCHITTEST')

While True
    $msg=GuiGetMsg()
    Switch $msg
        Case $GUI_EVENT_CLOSE
            ExitLoop
        Case $gHeadButtonLabel,$gHeadButtonPaddingTop
            MsgBox(0,'','Head Button pressed')
    EndSwitch
WEnd

Exit

Func _GuiRoundCorners($h_win, $i_x1, $i_y1, $i_x3, $i_y3)
   Dim $pos, $ret, $ret2
   $pos = WinGetPos($h_win)
   $ret = DllCall("gdi32.dll", "long", "CreateRoundRectRgn", "long", $i_x1, "long", $i_y1, "long", $pos[2], "long", $pos[3], "long", $i_x3, "long", $i_y3)
   If $ret[0] Then
      $ret2 = DllCall("user32.dll", "long", "SetWindowRgn", "hwnd", $h_win, "long", $ret[0], "int", 1)
      If $ret2[0] Then
         Return 1
      Else
         Return 0
      EndIf
   Else
      Return 0
   EndIf
EndFunc  ;==>_GuiRoundCorners

Func WM_NCHITTEST($hWnd, $iMsg, $wParam, $lParam)
    #forceref $hWnd, $iMsg, $wParam, $lParam
    Return $HTCAPTION
EndFunc   ;==>WM_NCHITTEST

Edited January 27, 2014 by orbs