Sign in to follow this  
Followers 0
Synix

Native windows buttons with alpha/transparency

7 posts in this topic

#1 ·  Posted (edited)

I want to nicely integrate native windows buttons into GUIs with background pictures. So I tried out and searched for some styles or any way to achieve that goal, but there was no really helpful information. You can use buttons with the $BS_COMMANDLINK or the standard style and set the GUI background color to the average color of your current background picture, but thats not the best solution and only works with background pictures that have no color gradient.
 
I never really noticed it until today, but in the windows 7 Ctrl+Alt+Del and lock screen there are buttons with a nice transparent effect. Here's a picture taken from my Ctrl+Alt+Del screen, to make it more clear:
post-34929-0-09984500-1405631189_thumb.p
(this is the standard lock screen, only with a different background picture)
The top buttons look very similar to $BS_COMMANDLINK ones, but I couldn't properly reproduce the transparency effects nor the size. Maybe you guys know a solution to that, that would be great :)
The last button also looks really nice but I have no clue how to emulate/create that one, if even possible without resizing issues and stuff.
 
Here's how far I came, not nearly as satisfying:

#include <ButtonConstants.au3>
#include <GUIConstantsEx.au3>
#include <SendMessage.au3>
#include <StaticConstants.au3>

$iColorDefault = 0xf0f0f0
$iColorSimilar = 0x27687c

GUICreate("Alpha Button Test", 512, 384)
GUICtrlCreatePic(@ProgramFilesDir & "\AutoIt3\Examples\GUI\msoobe.jpg", 0, 0, 512, 384)
GUICtrlSetState(-1, $GUI_DISABLE)

$idLabelInfo = GUICtrlCreateLabel("Click the buttons.", 146, 50, 220, 20, $SS_CENTER)
GUICtrlSetBkColor($idLabelInfo, $GUI_BKCOLOR_TRANSPARENT)

$idButtonCommon = GUICtrlCreateButton("Medium", 206, 100, 100, 43)
$idButton = GUICtrlCreateButton("Medium", 206, 150, 100, 43, $BS_COMMANDLINK)
$idButtonDefault = GUICtrlCreateButton("Big", 206, 200, 100, 57, $BS_DEFCOMMANDLINK) ;access via enter (same behavior as $BS_DEFPUSHBUTTON)

$idButtonSmallCommon = GUICtrlCreateButton("Small", 206, 300, 100, 25)
$idButtonSmall = GUICtrlCreateButton("Small", 206, 330, 100, 25, $BS_COMMANDLINK) ;text & icon will show up truncated
GUISetState()

While 1
    $idMsg = GUIGetMsg()
    Switch $idMsg
        Case $GUI_EVENT_CLOSE
            Exit
        Case $idButton
            GUICtrlSetData($idLabelInfo, "Button was pressed.")
        Case $idButtonDefault
            GUICtrlSetData($idLabelInfo, "Default button was pressed.")
            _SendMessage(GUICtrlGetHandle($idButtonDefault), $BCM_SETNOTE, 0, "Default", 0, "wparam", "wstr")
        Case $idButtonCommon
            GUISetBkColor($iColorSimilar)
            GUICtrlSetData($idLabelInfo, "GUI background color changed to 0x" & Hex($iColorSimilar, 6))
        Case $idButtonSmall
            GUICtrlSetData($idLabelInfo, "Small button was pressed.")
        Case $idButtonSmallCommon
            GUISetBkColor($iColorDefault)
            GUICtrlSetData($idLabelInfo, "GUI background color changed to 0x" & Hex($iColorDefault, 6))
    EndSwitch
WEnd

Thanks for any help or hints.
 
Edit: removed unneccessary #include line left over from previous tests.

Edited by Synix

Share this post


Link to post
Share on other sites



#2 ·  Posted (edited)

You can use skincrafter

use vista style to create a look like that

 

<snip>

Edited by Melba23
Links removed

Share this post


Link to post
Share on other sites

Thank you but that's totally not what I am looking for. ^^

My point is to not change the whole GUI design. All the standard controls look fine on a background picture, I only want to achieve what I mentioned above.

Using custom skinned buttons would be my last resort (for which I know are multiple solutions out there).

Share this post


Link to post
Share on other sites

Muzaiyan,

As you have ignored my private warning - we go public. :mad:

If you keep posting links to that payware product - and to your UDF which contains a pirate copy of their proprietary DLL - I will regard you as a spammer with the inevitable consequences. :naughty:

M23

1 person likes this

Any of my own code posted anywhere on the forum is available for use by others without any restriction of any kind._______My UDFs:

Spoiler

ArrayMultiColSort ---- Sort arrays on multiple columns
ChooseFileFolder ---- Single and multiple selections from specified path treeview listing
Date_Time_Convert -- Easily convert date/time formats, including the language used
ExtMsgBox --------- A highly customisable replacement for MsgBox
GUIExtender -------- Extend and retract multiple sections within a GUI
GUIFrame ---------- Subdivide GUIs into many adjustable frames
GUIListViewEx ------- Insert, delete, move, drag, sort, edit and colour ListView items
GUITreeViewEx ------ Check/clear parent and child checkboxes in a TreeView
Marquee ----------- Scrolling tickertape GUIs
NoFocusLines ------- Remove the dotted focus lines from buttons, sliders, radios and checkboxes
Notify ------------- Small notifications on the edge of the display
Scrollbars ----------Automatically sized scrollbars with a single command
StringSize ---------- Automatically size controls to fit text
Toast -------------- Small GUIs which pop out of the notification area

 

Share this post


Link to post
Share on other sites

Muzaiyan,

As you have ignored my private warning - we go public. :mad:

If you keep posting links to that payware product - and to your UDF which contains a pirate copy of their proprietary DLL - I will regard you as a spammer with the inevitable consequences. :naughty:

M23

ok i am new so some time needed to understand the rules . . i will look next time

Share this post


Link to post
Share on other sites

#6 ·  Posted (edited)

Updated code:

#include <ButtonConstants.au3>
#include <GUIConstantsEx.au3>
#include <StaticConstants.au3>
#Include <WinAPI.au3>
#include <WindowsConstants.au3>

$iColorDefault = 0x27687b
$iColorSimilar = 0x27687c
$iBkColor = $iColorSimilar

$hGUI = GUICreate("Alpha Button Test", 512, 384)
GUICtrlCreatePic(@ProgramFilesDir & "\AutoIt3\Examples\GUI\msoobe.jpg", 0, 0, 512, 384)
GUICtrlSetState(-1, $GUI_DISABLE)

$hGUIChild = GUICreate("", 512, 384, -1, -1, $WS_POPUP,  BitOR($WS_EX_MDICHILD, $WS_EX_LAYERED), $hGUI)

;always use the most common color of the background pic for best possible visual effects
GUISetBkColor($iBkColor)

#Region ;this solves text rendering issues
;method 1
GUICtrlCreatePic(@ProgramFilesDir & "\AutoIt3\Examples\GUI\msoobe.jpg", 0, 0, 512, 384)
GUICtrlSetState(-1, $GUI_DISABLE)

;method 2
;~ #include <FontConstants.au3>
;~ GUISetFont(Default, Default, Default, "", $hGUIChild, $NONANTIALIASED_QUALITY)
#EndRegion

$idLabelInfo = GUICtrlCreateLabel("Click the buttons.", 146, 50, 220, 20, $SS_CENTER)
GUICtrlSetBkColor($idLabelInfo, $GUI_BKCOLOR_TRANSPARENT)

$idButtonCommon = GUICtrlCreateButton("Medium", 206, 100, 100, 43)
$idButton = GUICtrlCreateButton("Medium", 206, 150, 100, 43, $BS_COMMANDLINK)
$idButtonDefault = GUICtrlCreateButton("Big", 206, 200, 100, 57, $BS_DEFCOMMANDLINK) ;access via enter (same behavior as $BS_DEFPUSHBUTTON)

$idButtonSmallCommon = GUICtrlCreateButton("Small", 206, 300, 100, 25)
$idButtonSmall = GUICtrlCreateButton("Small", 206, 330, 100, 25, $BS_COMMANDLINK) ;text & icon will show up truncated

;this will make the bgcolor transparent
_WinAPI_SetLayeredWindowAttributes($hGUIChild, $iBkColor)

GUISetState(@SW_SHOW, $hGUI)
GUISetState(@SW_SHOW, $hGUIChild)

While 1
    $idMsg = GUIGetMsg()
    Switch $idMsg
        Case $GUI_EVENT_CLOSE
            Exit
        Case $idButton
            GUICtrlSetData($idLabelInfo, "Button was pressed.")
        Case $idButtonDefault
            GUICtrlSetData($idLabelInfo, "Default button was pressed.")
            _SendMessage(GUICtrlGetHandle($idButtonDefault), $BCM_SETNOTE, 0, "Default", 0, "wparam", "wstr")
        Case $idButtonCommon
            GUISetBkColor($iColorSimilar)
            GUICtrlSetData($idLabelInfo, "GUI background color changed to 0x" & Hex($iColorSimilar, 6))
        Case $idButtonSmall
            GUICtrlSetData($idLabelInfo, "Small button was pressed.")
        Case $idButtonSmallCommon
            GUISetBkColor($iColorDefault)
            GUICtrlSetData($idLabelInfo, "GUI background color changed to 0x" & Hex($iColorDefault, 6))
    EndSwitch
WEnd

This is already much better, but it's more of a workaround than what I hoped for. It also needed some additional tweaks as you can see.

Known issues / stuff that needs to be solved:

  • Button type #2 (picture from my first post) is still not reproducable
  • Restore animation from minimized state as well as the intializing animation look awful, if the parent GUI has no $WS_POPUP style (which would prohibit all animations)
  • GUI background/transparency color must match the most common color of the background picture, otherwise there are some rendering issues (very bad when having a bg picture with a color gradient)
  • Commandlink buttons always have black text color (white should be possible as seen on the screenshot in post #1)
  • Commandlink buttons with small height display with truncated text + icon because of some kind of offset
  • The need for two GUIs (parent + child)

Edit: According to the info on the bottom of this page there maybe also is a way to hide or change the green arrow icon of commandlink butons with a custom imagelist. Didn't look into this by now.

Edit2: The hover and pressed styles still differ from the ones on the windows lock screen. No big deal but I find the ones from the lock screen look nicer.

Edited by Synix

Share this post


Link to post
Share on other sites

Updated code:

#include <ButtonConstants.au3>
#include <GuiButton.au3>
#include <GUIConstantsEx.au3>
#include <GuiImageList.au3>
#include <MsgBoxConstants.au3>
#include <SendMessage.au3>
#include <StaticConstants.au3>
#Include <WinAPI.au3>
#include <WinAPISys.au3>
#include <WindowsConstants.au3>

$iColorDefault = 0x27687b
$iColorSimilar = 0x27687c
$iBkColor = $iColorSimilar

If Not (_WinAPI_GetVersion() >= "6.0") Then Exit MsgBox($MB_ICONERROR, "", "Example only for Win Vista or later")

$hGUI = GUICreate("Alpha Button Test", 512, 384)
GUICtrlCreatePic(@ProgramFilesDir & "\AutoIt3\Examples\GUI\msoobe.jpg", 0, 0, 512, 384)
GUICtrlSetState(-1, $GUI_DISABLE)
$hGUIChild = GUICreate("", 512, 384, -1, -1, $WS_POPUP,  BitOR($WS_EX_MDICHILD, $WS_EX_LAYERED), $hGUI)

;always use the most common color of the background pic for best possible visual effects
GUISetBkColor($iBkColor)

#Region ;this solves text rendering issues
;method 1
GUICtrlCreatePic(@ProgramFilesDir & "\AutoIt3\Examples\GUI\msoobe.jpg", 0, 0, 512, 384)
GUICtrlSetState(-1, $GUI_DISABLE)

;method 2
;~ #include <FontConstants.au3>
;~ GUISetFont(Default, Default, Default, "", $hGUIChild, $NONANTIALIASED_QUALITY)
#EndRegion

$idLabelInfo = GUICtrlCreateLabel("Click the buttons.", 146, 50, 220, 20, $SS_CENTER)
GUICtrlSetBkColor($idLabelInfo, $GUI_BKCOLOR_TRANSPARENT)

$idButtonCommon = GUICtrlCreateButton("Medium", 206, 100, 100, 43)
$idButton = GUICtrlCreateButton("Medium", 206, 150, 100, 43, $BS_COMMANDLINK)
$idButtonDefault = GUICtrlCreateButton("Big", 206, 200, 100, 57, $BS_DEFCOMMANDLINK) ;access via enter (same behavior as $BS_DEFPUSHBUTTON)

$idButtonSmallCommon = GUICtrlCreateButton("Small", 206, 300, 100, 25)
$idButtonSmall = GUICtrlCreateButton("Small", 206, 330, 100, 37, $BS_COMMANDLINK) ;text & icon will show up truncated

;this will make the bgcolor transparent
_WinAPI_SetLayeredWindowAttributes($hGUIChild, $iBkColor)

$hImageList = _GUIImageList_Create(16, 16, 5)
_GUIImageList_AddIcon($hImageList, "pnidui.dll", 13) ;normal
_GUIImageList_AddIcon($hImageList, "pnidui.dll", 30) ;hover
_GUIImageList_AddIcon($hImageList, "pnidui.dll", 19) ;pressed
_GUIImageList_AddIcon($hImageList, "pnidui.dll", 32) ;disabled
_GUIImageList_AddIcon($hImageList, "pnidui.dll", 18) ;input focus
_GUIImageList_AddIcon($hImageList, "pnidui.dll", 13) ;input focus (alternating)

$hImageListDummy = _GUIImageList_Create(1, 1)

GUISetState(@SW_SHOW, $hGUI)
GUISetState(@SW_SHOW, $hGUIChild)

While 1
    $idMsg = GUIGetMsg()
    Switch $idMsg
        Case $GUI_EVENT_CLOSE
            Exit
        Case $idButton
            GUICtrlSetData($idLabelInfo, "Icons changed.")
            _GUICtrlButton_SetImage(GUICtrlGetHandle($idMsg), "pnidui.dll", 18) ;one image for all button states

            _GUICtrlButton_SetImageList(GUICtrlGetHandle($idButtonSmall), $hImageList) ;image alignment only doesn't work for commandlink buttons :(

            ;uncomment to see the buttons disabled icon
;~          GUICtrlSetState($idButtonSmall, $GUI_DISABLE)
        Case $idButtonDefault
            GUICtrlSetData($idLabelInfo, "Default button was pressed. Wait...")
            _SendMessage(GUICtrlGetHandle($idMsg), $BCM_SETNOTE, 0, "Default", 0, "wparam", "wstr")

            GUISetState(@SW_DISABLE, $hGUIChild)
            Sleep(2500)
            _GUICtrlButton_SetImageList(GUICtrlGetHandle($idButtonDefault), $hImageListDummy)
            Sleep(2500)
            _GUICtrlButton_SetImageList(GUICtrlGetHandle($idButtonDefault), 0)
            GUISetState(@SW_ENABLE, $hGUIChild)
            GUICtrlSetData($idLabelInfo, "")
            _SendMessage(GUICtrlGetHandle($idMsg), $BCM_SETNOTE, 0, "", 0, "wparam", "wstr")
        Case $idButtonCommon
            GUISetBkColor($iColorSimilar)
            GUICtrlSetData($idLabelInfo, "GUI background color changed to 0x" & Hex($iColorSimilar, 6))
        Case $idButtonSmall
            GUICtrlSetData($idLabelInfo, "Text became smaller :O")
            ;workaround
            _GUICtrlButton_SetText(GUICtrlGetHandle($idMsg), "")
            _SendMessage(GUICtrlGetHandle($idMsg), $BCM_SETNOTE, 0, "Smaller", 0, "wparam", "wstr")
        Case $idButtonSmallCommon
            GUISetBkColor($iColorDefault)
            GUICtrlSetData($idLabelInfo, "GUI background color changed to 0x" & Hex($iColorDefault, 6))
    EndSwitch
WEnd

Played around with icons and styles this time, unfortunately the known issues from my post above are not solved yet. I could only manage to let BCM_SETNOTE text look like the button caption, for a slightly smaller font size. Commandlink buttons without any icon are also included. All messy solutions.

Unfortunately I'm still nowhere near finding that nice white text style with shadow, or these special hover/pressed styles for commandlink buttons (or button type #2 at all).

Any help to achieve the original button styles from the Ctrl+Alt+Del screen is highly appreciated :)

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now
Sign in to follow this  
Followers 0