MetroGUI UDF v5.1 - Windows 10 style buttons, toggles, radios, menu etc.

[BBs19]

4 hours ago, coffeeturtle said:

Understood. No worries. Everything seems to be working well.

Just was curious: What would be the best way to get Transparency to work with the Metro GUI?

On Windows 10, this works fine: _WinAPI_DwmEnableBlurBehindWindow10($Form1, True)/#include <_WinAPI_DwmEnableBlurBehindWindow10.au3>

However, this does not work with Windows 7. The old GUI Create does have a flag for transparent layers, but not sure if there is a Metro equivalent?

Thanks again!

The transparent flag is not the same as the blur effect you can get on Windows 10. I don't know any of other way to get the same effect on Windows 7.

[coffeeturtle]

10 minutes ago, BBs19 said:

The transparent flag is not the same as the blur effect you can get on Windows 10. I don't know any of other way to get the same effect on Windows 7.

That is true. Just plain old transparency (maybe 10%) would suffice, but as you said, there may not be a way.  Thanks though.

[R0G]

On 2/21/2017 at 9:31 AM, coffeeturtle said:

Understood. No worries. Everything seems to be working well.

Just was curious: What would be the best way to get Transparency to work with the Metro GUI?

On Windows 10, this works fine: _WinAPI_DwmEnableBlurBehindWindow10($Form1, True)/#include <_WinAPI_DwmEnableBlurBehindWindow10.au3>

However, this does not work with Windows 7. The old GUI Create does have a flag for transparent layers, but not sure if there is a Metro equivalent?

Thanks again!

Did you try: WinSetTrans ( "title", "text", transparency )

[Proph]

On 9/12/2016 at 0:12 PM, Carm01 said:

Is it just me , maybe I am missing something, but in the example on the line:

$Form1 = _Metro_CreateGUI("Example", 500, 300, -1, -1, True)

Should not "Example" show in the title bar?

Thanks

I am noticing this as well.  The Title does not seem to show in the top bar as is intended?  Is this a bug... or is there something else we need to do to put the title in the top bar?

 

I also noticed that the "X" button seems to be dimmed out.  The other buttons seem to be whiter.  The close button still functions normally though.

 

What is the difference between the Maximize button and Full Screen buttons?  If I comment out the Maximize button... it causes the Minimize button to stop working properly.  It just quickly flashes as if it did a minimize and restore.  I just don't see a point in having both a Full Screen and Maximize button at the same time.  Are there different uses for it?

Thanks!  The work on this UDF is awesome!  I can't wait to implement it into my programs. 

 

 

Oh... one more question... Does this work on Windows Vista, XP and earlier NT systems?  Or will I need to make sure I implement code for earlier systems?

Edited March 6, 2017 by Proph

[Proph]

To fix the Title issue I went ahead and made this change to script...

MetroGUI_UDF.au3

Under This:

If $AllowResize Then
    DllCall("uxtheme.dll", "none", "SetThemeAppProperties", "int", 0) ;Adds compatibility for Windows 7 Basic theme
    $GUI_Return = GUICreate($Title, $Width, $Height, $Left, $Top, BitOR($WS_SIZEBOX, $WS_MINIMIZEBOX, $WS_MAXIMIZEBOX), -1, $ParentGUI)
    _Metro_SetGUIOption($GUI_Return, True, True, $Width, $Height)
    DllCall("uxtheme.dll", "none", "SetThemeAppProperties", "int", BitOR(1, 2, 4))
Else
   DllCall("uxtheme.dll", "none", "SetThemeAppProperties", "int", 0) ;Adds compatibility for Windows 7 Basic theme
    $GUI_Return = GUICreate($Title, $Width, $Height, $Left, $Top, -1, -1, $ParentGUI)
    _Metro_SetGUIOption($GUI_Return, False, False, $Width, $Height)
    DllCall("uxtheme.dll", "none", "SetThemeAppProperties", "int", BitOR(1, 2, 4))
EndIf

Add this:

GUICtrlCreateLabel($Title, 54, 7)
GUICtrlSetColor(-1, $FontThemeColor)
GUICtrlSetFont(-1, 8.5, 400, 0, "Arial", 5)

 

Hope this helps someone until the UDF is updated with something better.

Edited March 7, 2017 by Proph

[Andre82]

Hi,

i try to tabbing from Button to Button, but it dont work.

Any Idea?

Thank you in advance for any help on this.

[BBs19]

On 6.3.2017 at 7:53 PM, Proph said:

I am noticing this as well.  The Title does not seem to show in the top bar as is intended?  Is this a bug... or is there something else we need to do to put the title in the top bar?

The title is not supposed to be visible within the GUI, so that you have more place on your GUI to customize it. However I can add an extra option in the next versions.

On 6.3.2017 at 7:53 PM, Proph said:

I also noticed that the "X" button seems to be dimmed out.  The other buttons seem to be whiter.  The close button still functions normally though.

Make sure you enable the HighDPI support in the Script and compile the script or disable the compatibility scaling for the .exe file of Autoit. This should make it look sharper and not look dimmed.

On 6.3.2017 at 7:53 PM, Proph said:

What is the difference between the Maximize button and Full Screen buttons?  If I comment out the Maximize button... it causes the Minimize button to stop working properly.  It just quickly flashes as if it did a minimize and restore.  I just don't see a point in having both a Full Screen and Maximize button at the same time.  Are there different uses for it?

The name already tells it The fullscreen button is supposed to make the GUI get in front of everything on your desktop. Unfortunately MS again changed something with a Windows 10 update and fu**ed it up as the taskbar stays in front now. Many programs don't work in Fullscreen mode anymore since this update. Only popup windows work in fullscreen mode now. I will try to implement a workaround for the next version.

Ps.: If you comment out the maximize button, then you also have to comment out the restore button, otherwise it won't work as both belong together.

 

On 6.3.2017 at 7:53 PM, Proph said:

Oh... one more question... Does this work on Windows Vista, XP and earlier NT systems?  Or will I need to make sure I implement code for earlier systems?

I can't say as i haven't tested it. I also don't know anyone who still uses XP, therefore I never got any reports if it works or not.

 

On 15.3.2017 at 0:17 PM, Andre82 said:

Hi,

i try to tabbing from Button to Button, but it dont work.

Any Idea?

Thank you in advance for any help on this.

Hi, yes that doesn't work unfortunately. All i know is that it is probably complicated and requires a lot of time and motivation to get it working with such pictures 

 

[Proph]

11 hours ago, BBs19 said:

The title is not supposed to be visible within the GUI, so that you have more place on your GUI to customize it. However I can add an extra option in the next versions.

Make sure you enable the HighDPI support in the Script and compile the script or disable the compatibility scaling for the .exe file of Autoit. This should make it look sharper and not look dimmed.

The name already tells it The fullscreen button is supposed to make the GUI get in front of everything on your desktop. Unfortunately MS again changed something with a Windows 10 update and fu**ed it up as the taskbar stays in front now. Many programs don't work in Fullscreen mode anymore since this update. Only popup windows work in fullscreen mode now. I will try to implement a workaround for the next version.

Ps.: If you comment out the maximize button, then you also have to comment out the restore button, otherwise it won't work as both belong together.

 

I can't say as i haven't tested it. I also don't know anyone who still uses XP, therefore I never got any reports if it works or not.

 

Hi, yes that doesn't work unfortunately. All i know is that it is probably complicated and requires a lot of time and motivation to get it working with such pictures 

 

I figured out my issue with commenting out the maximize button. You are right... I wasn't commenting out the restore button.

I have tested this on XP and Vista and it does all seem to work.   I don't use XP... but I know there are still some stubborn users out there that do.   I just want to make sure my program is compatible.  For some odd reason I wasn't able to get HighDPI to work with my script.  When I enable it my program will not open when it is compiled... but it does open when it is run through scite un-compiled for some reason.  Odd... but it seems to look fine without it for now. The dim X button might just be my eyes thinking it looks dim. It looks fine though, so not a big deal.

 

Thanks for the work on this.  It's really a great UDF.

[youtuber]

Radio is too how to be small font?

$Radio1 = _Metro_CreateRadio("1", "Yes", 424, 40, 185, 30)
GUICtrlSetFont(-1, 8, 400, 0, "MS Sans Serif")
$Radio2 = _Metro_CreateRadio("1", "No", 424, 90, 185, 30)
GUICtrlSetFont(-1, 8, 400, 0, "MS Sans Serif")
_Metro_RadioCheck("1", $Radio1)

 

[coffeeturtle]

On 2/18/2017 at 5:24 AM, BBs19 said:

Thanks

What do you mean with include GUICtrlSetResizing for labels?

TV-Show-Manager is opensource, so you can check out the code any time. But I would suggest you wait, as the code was written very bad back then, I am rewriting the program from scratch to look similar to Netflix. Here is a small demo: Picture It will take some time to finish, as I am not really motivated to work on it at the moment  

 

Hey @BBs19 !!  Just was wondering if your newer version of TV-Show-Manager is still coming along? When it is finished, will the Check for Updates work?

Thanks again!

[BBs19]

On 23.3.2017 at 9:11 PM, youtuber said:

Radio is too how to be small font?

$Radio1 = _Metro_CreateRadio("1", "Yes", 424, 40, 185, 30)
GUICtrlSetFont(-1, 8, 400, 0, "MS Sans Serif")
$Radio2 = _Metro_CreateRadio("1", "No", 424, 90, 185, 30)
GUICtrlSetFont(-1, 8, 400, 0, "MS Sans Serif")
_Metro_RadioCheck("1", $Radio1)

 

_Metro_CreateRadio("1", "Yes", 424, 40, 185, 30,  $GUIThemeColor, $FontThemeColor,"Segoe UI", "14")

 

3 hours ago, coffeeturtle said:

Hey @BBs19 !!  Just was wondering if your newer version of TV-Show-Manager is still coming along? When it is finished, will the Check for Updates work?

Thanks again!

Hi, thanks for reminding me. I had not enough time and motivation to work on it yet. I would like to finish my plans for MetroGUI UDF and use it in TV-Show-Manager V5.  I am lacking the motivation and time that I had before that allowed me to finish such things within 2-3 days  I ran into some compatibility problems on Windows 7 and lower, with some of the effects I used which caused a lot of time to be wasted and was a set back for the project..

I will for sure finish it as I have put a lot of work in the current state of it, it is just a question of time.  And yes, the check for updates should work. 

Edited May 23, 2017 by BBs19

[coffeeturtle]

14 hours ago, BBs19 said:

_Metro_CreateRadio("1", "Yes", 424, 40, 185, 30,  $GUIThemeColor, $FontThemeColor,"Segoe UI", "14")

 

Hi, thanks for reminding me. I had not enough time and motivation to work on it yet. I would like to finish my plans for MetroGUI UDF and use it in TV-Show-Manager V5.  I am lacking the motivation and time that I had before that allowed me to finish such things within 2-3 days  I ran into some compatibility problems on Windows 7 and lower, with some of the effects I used which caused a lot of time to be wasted and was a set back for the project..

I will for sure finish it as I have put a lot of work in the current state of it, it is just a question of time.  And yes, the check for updates should work. 

Thank you for both the MetroGui UDF and TV-Show-Manager. Both work great in the current state, but I would love to see what you come up with next!

Although I am all for backwards compatibility when it comes to software, there are times when you might have to cut the cord (or maybe split a project's development). Win8 and greater can move forward with all the goodies, while Win7 and lower keeps the core functions that work well.  My $.02. :-)

[TheChiefMeat]

Is there any way for me to make a Metro InputBox? I scrolled through the functions list and I couldn't find anything there. I've got pretty much everything up and running for the program I'm making for myself, if anyone could point me in the right direction that would be great.

 

Thanks OP for making a beautiful GUI for us

[TheChiefMeat]

Okay so I managed to get a input box working, it looks a little odd bit it will do for now.

[Skeletor]

I see in the UDF there is nothing for Tabs? It would be awesome to add the

GUICtrlCreateTabItem

Into the MetroUI.  

[hawk63]

The last version is great.

Is there any way to add a picture to a button ?

Edit :
Finally it's good. I managed to change the function to do what I wanted.
Here is the modified function for those who are interested (it allows to add an icon and to select if the effect of hovering brightens or darkens the background color).

expandcollapse popup

; #FUNCTION# ====================================================================================================================
; Name ..........: _Metro_CreateButtonModEx
; Description ...: Creates Windows 10 style buttons with a frame around. Hovering changes the button color to a darker color.
; Syntax ........: _Metro_CreateButtonModEx($Text, $Left, $Top, $Width, $Height[, $BG_Color = $ButtonBKColor[,
;                  $Font_Color = $ButtonTextColor[, $Font = "Arial"[, $Fontsize = 12.5[, $FontStyle = 1[,
;                  $FrameColor = "0x1B1B1B"[, $Darker = False[, $Icon = ""]]]]]]]])
; Parameters ....: $Text                - Text of the button.
;                  $Left                - Left pos.
;                  $Top                 - Top pos.
;                  $Width               - Width.
;                  $Height              - Height.
;                  $BG_Color            - [optional] Button background color. Default is $ButtonBKColor.
;                  $Font_Color          - [optional] Font colore. Default is $ButtonTextColor.
;                  $Font                - [optional] Font. Default is "Arial".
;                  $Fontsize            - [optional] Fontsize. Default is 12.5.
;                  $FontStyle           - [optional] Fontstyle. Default is 1.
;                  $FrameColor          - [optional] Button frame color. Default is "0x1B1B1B".
;                  $Darker              - [optional] Hover effect darker for light button. Default is false.
;                  $Icon                - [optional] Icon for the button. Default is none.
; Return values .: Handle to the button.
; Example .......: _Metro_CreateButtonModEx("Button 1",50,50,120,34)
; ===============================================================================================================================

Func _Metro_CreateButtonModEx($Text, $Left, $Top, $Width, $Height, $BG_Color = $ButtonBKColor, $Font_Color = $ButtonTextColor, $Font = "Arial", $Fontsize = 11, $FontStyle = 1, $FrameColor = "0x1B1B1B", $Darker = False, $Icon = "")
    Local $Button_Array[16]

    Local $btnDPI = _HighDPICheck()
    If $HIGHDPI_SUPPORT Then
        $Left = Round($Left * $gDPI)
        $Top = Round($Top * $gDPI)
        $Width = Round($Width * $gDPI)
        $Height = Round($Height * $gDPI)
    Else
        $Fontsize = ($Fontsize / $Font_DPI_Ratio)
    EndIf

    $Button_Array[1] = False ; Set hover OFF
    $Button_Array[3] = "2" ; Type
    $Button_Array[15] = GetCurrentGUI()

    ;Calculate Framesize
    Local $FrameSize = Round(2 * $btnDPI)
    If Not (Mod($FrameSize, 2) = 0) Then $FrameSize = $FrameSize - 1

    ;Set Colors
    $BG_Color = "0xFF" & Hex($BG_Color, 6)
    $Font_Color = "0xFF" & Hex($Font_Color, 6)
    $FrameColor = "0xFF" & Hex($FrameColor, 6)
    Local $Brush_BTN_FontColor = _GDIPlus_BrushCreateSolid($Font_Color)
    Local $Pen_BTN_FrameHoverColor = _GDIPlus_PenCreate($FrameColor, $FrameSize)
    Local $Pen_BTN_FrameHoverColorDis = _GDIPlus_PenCreate(StringReplace(_AlterBrightness($Font_Color, -30), "0x", "0xFF"), $FrameSize)
    Local $Brush_BTN_FontColorDis = _GDIPlus_BrushCreateSolid(StringReplace(_AlterBrightness($Font_Color, -30), "0x", "0xFF"))

    ;Create Button graphics
    Local $Button_Graphic1 = _GDIPlusGraphic_Create($Width, $Height, $BG_Color, 0, 5) ;Default
    If $Darker Then
        Local $Button_Graphic2 = _GDIPlusGraphic_Create($Width, $Height, StringReplace(_AlterBrightness($BG_Color, -10), "0x", "0xFF"), 0, 5) ;Hover
    Else
        Local $Button_Graphic2 = _GDIPlusGraphic_Create($Width, $Height, StringReplace(_AlterBrightness($BG_Color, 25), "0x", "0xFF"), 0, 5) ;Hover
    EndIf
    Local $Button_Graphic3 = _GDIPlusGraphic_Create($Width, $Height, $BG_Color, 0, 5) ;Disabled

    ;Create font, Set font options
    Local $hFormat = _GDIPlus_StringFormatCreate(), $hFamily = _GDIPlus_FontFamilyCreate($Font), $hFont = _GDIPlus_FontCreate($hFamily, $Fontsize, $FontStyle)
    Local $tLayout = _GDIPlus_RectFCreate(0, 0, $Width, $Height)
    _GDIPlus_StringFormatSetAlign($hFormat, 1)
    _GDIPlus_StringFormatSetLineAlign($hFormat, 1)

    ;Draw button text
    _GDIPlus_GraphicsDrawStringEx($Button_Graphic1[0], $Text, $hFont, $tLayout, $hFormat, $Brush_BTN_FontColor)
    _GDIPlus_GraphicsDrawStringEx($Button_Graphic2[0], $Text, $hFont, $tLayout, $hFormat, $Brush_BTN_FontColor)
    _GDIPlus_GraphicsDrawStringEx($Button_Graphic3[0], $Text, $hFont, $tLayout, $hFormat, $Brush_BTN_FontColorDis)

    ;Add Icon
    If  $Icon <> "" Then
        Local $Button_Icon = _GDIPlus_BitmapCreateFromFile($Icon)
        Local $Button_Icon_dpi = _GDIPlus_ImageScale($Button_Icon, $gdpi, $gdpi, 7)
        Local $Icon_W = _GDIPlus_ImageGetWidth($Button_Icon_dpi)
        Local $Icon_H = _GDIPlus_ImageGetHeight($Button_Icon_dpi)
        _GDIPlus_GraphicsDrawImage($Button_Graphic1[0], $Button_Icon_dpi, ($Width-$Icon_W)/2, ($Height-$Icon_H)/2)
        _GDIPlus_GraphicsDrawImage($Button_Graphic2[0], $Button_Icon_dpi, ($Width-$Icon_W)/2, ($Height-$Icon_H)/2)
        _GDIPlus_GraphicsDrawImage($Button_Graphic3[0], $Button_Icon_dpi, ($Width-$Icon_W)/2, ($Height-$Icon_H)/2)
    EndIf

    ;Add frame
    _GDIPlus_GraphicsDrawRect($Button_Graphic1[0], 0, 0, $Width, $Height, $Pen_BTN_FrameHoverColor)
    _GDIPlus_GraphicsDrawRect($Button_Graphic2[0], 0, 0, $Width, $Height, $Pen_BTN_FrameHoverColor)
    _GDIPlus_GraphicsDrawRect($Button_Graphic3[0], 0, 0, $Width, $Height, $Pen_BTN_FrameHoverColorDis)

    ;Release created objects
    _GDIPlus_FontDispose($hFont)
    _GDIPlus_FontFamilyDispose($hFamily)
    _GDIPlus_StringFormatDispose($hFormat)
    _GDIPlus_BrushDispose($Brush_BTN_FontColor)
    _GDIPlus_BrushDispose($Brush_BTN_FontColorDis)
    _GDIPlus_PenDispose($Pen_BTN_FrameHoverColor)
    _GDIPlus_PenDispose($Pen_BTN_FrameHoverColorDis)
    If  $Icon <> "" Then
        _GDIPlus_BitmapDispose($Button_Icon)
        _GDIPlus_BitmapDispose($Button_Icon_dpi)
    EndIf

    ;Set graphic and return Bitmap handle
    $Button_Array[0] = GUICtrlCreatePic("", $Left, $Top, $Width, $Height)
    $Button_Array[5] = _GDIPlusGraphic_CreateBitmapHandle($Button_Array[0], $Button_Graphic1)
    $Button_Array[6] = _GDIPlusGraphic_CreateBitmapHandle($Button_Array[0], $Button_Graphic2, False)
    $Button_Array[7] = _GDIPlusGraphic_CreateBitmapHandle($Button_Array[0], $Button_Graphic3, False)

    ;Set GUI Resizing
    GUICtrlSetResizing($Button_Array[0], 768)

    _Internal_AddHoverItem($Button_Array)
    Return $Button_Array[0]

EndFunc   ;==>_Metro_CreateButtonEx

 

Edited August 15, 2017 by hawk63

[Joboy2k]

Im sorry for probably what is such a simple answer, but how can I delete a control thats been made? I made a progress bar with metro and now I can't figure out how to delete that progress bar without deleting the entire GUI. Sorry for the question, might be because its late that I can't figure it out. 

 

Just figured out that the handle was in an array, sorry to waste time.

Edited August 30, 2017 by joboy2k

[Skeletor]

It happens joboy2k.. I've had that before.. Especially on my  one post.... You talk about the issue then you leave it for a few days.... Answer hits you when you don't think about it.

[BBs19]

Version 5.0 - Changelog - 03.09.2017

New features:

• Hover effects, minimize,maximize,restore and other GUI effects are now working natively, there is no need to call any function in a loop.
  • This also allows the hover effects to work if the main script is paused due to "Sleep, Msgbox etc."
  • The hover effects now work slightly faster and create less CPU usage, however the startup time of the main script is slightly increased. Thanks to @binhnx for his SSCtrlHover UDF.
• Maximize, Minimize, Fullscreen and Restore buttons now work natively, meaning you don't need to set actions for them manually. 
  • If you prefer handling the buttons manually, then you can disable this by setting "$ControlBtnsAutoMode = False"
• Added _Metro_CreateButtonEx2 -> Creates a slightly rounded button without a frame around. Hovering changes the button color to a lighter color.
• Added _Metro_CreateCheckboxEx2 -> Creates a modern round checkbox.
• Added _Metro_CreateRadioEx -> Creates a metro style radio with colored checkmark.
• Added "_Metro_RightClickMenu" an easy to use rightclick menu. You can use this with listviews or anything else.
  • Check out the example for a demo of the rightclick menu and how to implement it. -> Rightclick on Button3 to show the menu.
• Added multiple new themes with flat colors and updated the old themes.
  • Check out the example for a demo with all themes by pressing the menu button -> Themes Demo

Improvements:

• You can now delete all controls that have hover effects(buttons, checkboxes etc.) using GUICtrlDelete($ControlHandle). This will also automatically release all resources and remove the control from the global array.
• Many other optimizations,changes and bugfixes.

 

Download UDF with example:

 

[Joboy2k]

Brilliant, can't wait to get using it