Draw a colored outline on a GUI [Solved] Topic is solved

Get help with using AutoHotkey and its commands and hotkeys
JJohnston2
Posts: 193
Joined: 24 Jun 2015, 23:38

Draw a colored outline on a GUI [Solved]  Topic is solved

06 May 2016, 11:23

Anyone have a pointer on the easiest way I might draw a colored outline on a GUI?

i.e., looking to draw a generic colored box or border around several controls, maybe similar to this http://blogs.sitepointstatic.com/images ... rs-box.png
Last edited by JJohnston2 on 12 May 2016, 23:51, edited 1 time in total.
User avatar
TheDewd
Posts: 1414
Joined: 19 Dec 2013, 11:16
Location: USA

Re: Draw a colored outline on a GUI

11 May 2016, 16:08

How about this?

https://autohotkey.com/boards/viewtopic.php?f=5&t=7312

Code: Select all

#SingleInstance, Force

Gui, Add, Picture, % "x" 0 " y" 0 " w" 400 " h" 4 " +0x4E +HWNDhPicture1"
CreatePixel("000000", hPicture1)

Gui, Add, Picture, % "x" 0 " y" 196 " w" 400 " h" 4 " +0x4E +HWNDhPicture2"
CreatePixel("000000", hPicture2)

Gui, Add, Picture, % "x" 0 " y" 0 " w" 4 " h" 200 " +0x4E +HWNDhPicture3"
CreatePixel("000000", hPicture3)

Gui, Add, Picture, % "x" 396 " y" 0 " w" 4 " h" 200 " +0x4E +HWNDhPicture4"
CreatePixel("000000", hPicture4)

Gui, Show, % " w" 400 " h" 200, % "Example"
return

CreatePixel(Color, Handle) {
	VarSetCapacity(BMBITS, 4, 0), Numput("0x" . Color, &BMBITS, 0, "UInt")
	hBM := DllCall("Gdi32.dll\CreateBitmap", "Int", 1, "Int", 1, "UInt", 1, "UInt", 24, "Ptr", 0, "Ptr")
	hBM := DllCall("User32.dll\CopyImage", "Ptr", hBM, "UInt", 0, "Int", 0, "Int", 0, "UInt", 0x2008, "Ptr")
	DllCall("Gdi32.dll\SetBitmapBits", "Ptr", hBM, "UInt", 3, "Ptr", &BMBITS) 
	DllCall("User32.dll\SendMessage", "Ptr", Handle, "UInt", 0x172, "Ptr", 0, "Ptr", hBM)
}
Image Bulldozer - Sokoban inspired game from 1994 recreated in AutoHotkey.
just me
Posts: 7291
Joined: 02 Oct 2013, 08:51
Location: Germany

Re: Draw a colored outline on a GUI

12 May 2016, 04:14

... or this (a modernized version of an old function)?

Code: Select all

#NoEnv
Gui, Margin, 10, 10
GuiAddBorder("Red", 4, "xm ym w400 h200")
Gui, Add, Text, xp yp wp hp Center +0x0200 BackgroundTrans, Border Example ; 0x0200 centers single-line text vertically
Gui, Show, , Border Example
Return
GuiClose:
ExitApp
; ==================================================================================================================================
; Adds a border-like text control to the current default GUI
; ==================================================================================================================================
GuiAddBorder(Color, Width, PosAndSize) {
   ; -------------------------------------------------------------------------------------------------------------------------------
   ; Color        -  border color as used with the 'Gui, Color, ...' command, must be a "string"
   ; Width        -  the width of the border in pixels
   ; PosAndSize   -  a string defining the position and size like Gui commands, e.g. "xm ym w400 h200".
   ;                 You should not pass other control options!
   ; -------------------------------------------------------------------------------------------------------------------------------
   LFW := WinExist() ; save the last-found window, if any
   DefGui := A_DefaultGui ; save the current default GUI
   Gui, Add, Text, %PosAndSize% +hwndHTXT
   GuiControlGet, T, Pos, %HTXT%
   Gui, New, +Parent%HTXT% +LastFound -Caption ; create a unique child Gui for the text control
   Gui, Color, %Color%
   X1 := Width, X2 := TW - Width, Y1 := Width, Y2 := TH - Width
   WinSet, Region, 0-0 %TW%-0 %TW%-%TH% 0-%TH% 0-0   %X1%-%Y1% %X2%-%Y1% %X2%-%Y2% %X1%-%Y2% %X1%-%Y1%
   Gui, Show, x0 y0 w%TW% h%TH%
   Gui, %DefGui%:Default ; restore the default Gui
   If (LFW) ; restore the last-found window, if any
      WinExist(LFW)
}
JJohnston2
Posts: 193
Joined: 24 Jun 2015, 23:38

Re: Draw a colored outline on a GUI

12 May 2016, 23:50

Wow!!! These are both great... exactly what I was hoping to find. :bravo:

The GuiAddBorder function is especially easy to use since I can give it a return value of the text control handle and subsequently modify the border or turn it on/off... almost too easy to use, although I would have never dreamed up how to implement it from scratch, which looks quite clever.

Thanks a bunch for posting these code items and the link to other post as well... appreciated.
takayo97
Posts: 62
Joined: 09 Jun 2018, 16:30

Re: Draw a colored outline on a GUI

06 Jan 2020, 17:45

just me wrote:
12 May 2016, 04:14
... or this (a modernized version of an old function)?

Code: Select all

#NoEnv
Gui, Margin, 10, 10
GuiAddBorder("Red", 4, "xm ym w400 h200")
Gui, Add, Text, xp yp wp hp Center +0x0200 BackgroundTrans, Border Example ; 0x0200 centers single-line text vertically
Gui, Show, , Border Example
Return
GuiClose:
ExitApp
; ==================================================================================================================================
; Adds a border-like text control to the current default GUI
; ==================================================================================================================================
GuiAddBorder(Color, Width, PosAndSize) {
   ; -------------------------------------------------------------------------------------------------------------------------------
   ; Color        -  border color as used with the 'Gui, Color, ...' command, must be a "string"
   ; Width        -  the width of the border in pixels
   ; PosAndSize   -  a string defining the position and size like Gui commands, e.g. "xm ym w400 h200".
   ;                 You should not pass other control options!
   ; -------------------------------------------------------------------------------------------------------------------------------
   LFW := WinExist() ; save the last-found window, if any
   DefGui := A_DefaultGui ; save the current default GUI
   Gui, Add, Text, %PosAndSize% +hwndHTXT
   GuiControlGet, T, Pos, %HTXT%
   Gui, New, +Parent%HTXT% +LastFound -Caption ; create a unique child Gui for the text control
   Gui, Color, %Color%
   X1 := Width, X2 := TW - Width, Y1 := Width, Y2 := TH - Width
   WinSet, Region, 0-0 %TW%-0 %TW%-%TH% 0-%TH% 0-0   %X1%-%Y1% %X2%-%Y1% %X2%-%Y2% %X1%-%Y2% %X1%-%Y1%
   Gui, Show, x0 y0 w%TW% h%TH%
   Gui, %DefGui%:Default ; restore the default Gui
   If (LFW) ; restore the last-found window, if any
      WinExist(LFW)
}
How to modify to support any of windows id if a script has more than one gui window.
The function could create on default gui #1 window. I canno draw a border on gui #2 window on the same script
User avatar
Hellbent
Posts: 1058
Joined: 23 Sep 2017, 13:34

Re: Draw a colored outline on a GUI

06 Jan 2020, 22:43

takayo97 wrote:
06 Jan 2020, 17:45
How to modify to support any of windows id if a script has more than one gui window.
The function could create on default gui #1 window. I canno draw a border on gui #2 window on the same script
Here is one way you can go about adding simple Scalable graphics to any number of gui's using GDIP and this script
https://www.autohotkey.com/boards/viewtopic.php?f=6&t=62550

***Add the path to your copy of GDIP at the top of the script***

This is just one of many ways this can be done / used

Code: Select all

;***************************************************************************************************
;***************************************************************************************************
;***************************************************************************************************
#Include <My Altered Gdip Lib>  ;<------       Replace with your copy of GDIP
;***************************************************************************************************
;***************************************************************************************************
;***************************************************************************************************
#SingleInstance,Force
OnExit, GuiClose
pToken:=Gdip_Startup()

Loop 25	{
	AddWindow()  ;Adding multiple gui's for the purpose of this demo
}
return

GuiClose:
GuiContextMenu:
*ESC::
	Gdip_Shutdown(pToken)
	ExitApp
	
AddWindow(){
	static WinName:=0
	WinName++
	Obj:="Border" WinName
	Gui,% WinName ":New",+AlwaysOnTop -DPIScale
	Gui,% WinName ":Color",666666
	Gui,% WinName ":Margin",0,0
	Gui,% WinName ":Font",cwhite s10 Bold ,Segoe UI
	Gui,% WinName ":Add",Picture,xm ym BackgroundTrans 0xE hwndhwnd,
	HB_BITMAP_MAKER(%OBJ%:={w:Ran(100,900),h:Ran(100,500),Hwnd:hwnd})
	Gui,% WinName ":Add",Text,% "x30 ym w" %OBJ%.W-60 " h" %OBJ%.H " Center BackgroundTrans 0x200",Your Text Here
	Gui,% WinName ":Show",% "w" %OBJ%.W " h" %OBJ%.H
	%OBJ%:=""
}

Ran(Min,Max){
	Random,Out,Min,Max
	return Out
}

HB_BITMAP_MAKER(Obj){
	;Bitmap Created Using: HB Bitmap Maker
	pBitmap:=Gdip_CreateBitmap( Obj.W , Obj.H ) 
	G := Gdip_GraphicsFromImage( pBitmap )
	Gdip_SetSmoothingMode( G , 2 )
	Pen := Gdip_CreatePen( "0xFF000000" , 10 )
	Gdip_DrawRoundedRectangle( G , Pen , 10 , 10 , Obj.W-20 , Obj.H-20 , 20 )
	Gdip_DeletePen( Pen )
	Pen := Gdip_CreatePen( "0xFF000000" , 12 )
	Gdip_DrawRoundedRectangle( G , Pen , 20 , 21 , Obj.W-41 , Obj.H-42 , 10 )
	Gdip_DeletePen( Pen )
	Pen := Gdip_CreatePen( "0xFFFFDD00" , 10 )
	Gdip_DrawRoundedRectangle( G , Pen , 12 , 12 , Obj.W-24 , Obj.H-24 , 20 )
	Gdip_DeletePen( Pen )
	Pen := Gdip_CreatePen( "0xFF333333" , 10 )
	Gdip_DrawRoundedRectangle( G , Pen , 19 , 20 , Obj.W-39 , Obj.H-40 , 12 )
	Gdip_DeletePen( Pen )
	Pen := Gdip_CreatePen( "0xFFFFAA00" , 8 )
	Gdip_DrawRoundedRectangle( G , Pen , 20 , 21 , Obj.W-41 , Obj.H-42 , 10 )
	Gdip_DeletePen( Pen )
	Gdip_DeleteGraphics( G )
	Obj.Bitmap:=Gdip_CreateHBITMAPFromBitmap(pBitmap)
	Gdip_DisposeImage(pBitmap)
	SetImage(Obj.Hwnd,Obj.Bitmap)
	DeleteObject(Obj.Bitmap)
}

.
20200106224110.png
20200106224110.png (46.7 KiB) Viewed 992 times
takayo97
Posts: 62
Joined: 09 Jun 2018, 16:30

Re: Draw a colored outline on a GUI [Solved]

07 Jan 2020, 18:02

I'll take a look. Thanks.
User avatar
Hellbent
Posts: 1058
Joined: 23 Sep 2017, 13:34

Re: Draw a colored outline on a GUI [Solved]

08 Jan 2020, 01:11

takayo97 wrote:
07 Jan 2020, 18:02
I'll take a look. Thanks.
For very simple outlines I often use these functions I made. Not suitable in all cases, but very easy to use.

Code: Select all

DRAW_OUTLINE( GUI_NAME , X , Y , W , H , COLOR1 :="BLACK", COLOR2 := "BLACK" , THICKNESS := 1 ) {
	GUI , % GUI_NAME ": ADD" , PROGRESS , % "X" X " Y" Y " W" W " H" THICKNESS " BACKGROUND" COLOR1 
	GUI , % GUI_NAME ": ADD" , PROGRESS , % "X" X " Y" Y " W" THICKNESS " H" H " BACKGROUND" COLOR1 
	GUI , % GUI_NAME ": ADD" , PROGRESS , % "X" X " Y" Y + H - THICKNESS " W" W " H" THICKNESS " BACKGROUND" COLOR2 
	GUI , % GUI_NAME ": ADD" , PROGRESS , % "X" X + W - THICKNESS " Y" Y " W" THICKNESS " H" H " BACKGROUND" COLOR2 	
}
DRAW_LINE( GUI_NAME , X , Y , W , H , COLOR ) {
	GUI , % GUI_NAME ": ADD" , PROGRESS , % "X" X " Y" Y " W" W " H" H " BACKGROUND" COLOR 
}

Here is an example.

Code: Select all

#SingleInstance,Force

Gui,1:+AlwaysOnTop
Gui,1:Color,333538
;----------------------------------------------------------------------------------------------------------------------------------
DRAW_OUTLINE( GUI_NAME := 1 , x := 10 , y := 10 , w := 280 , h := 180 , COLOR1 :="f0f0f0", COLOR2 := "777777" , THICKNESS := 1 )
DRAW_OUTLINE( GUI_NAME := 1 , x := 20 , y := 20 , w := 260 , h := 160 , COLOR1 :="aa0000", COLOR2 := "880000" , THICKNESS := 5 )
DRAW_OUTLINE( GUI_NAME := 1 , x := 40 , y := 30 , w := 220 , h := 140 , COLOR1 :="006699", COLOR2 := "006699" , THICKNESS := 2 )
;----------------------------------------------------------------------------------------------------------------------------------
DRAW_LINE( GUI_NAME := 1 , x := 45 , y := 55 , w := 100 , h := 5 , COLOR := "Aqua" )
DRAW_LINE( GUI_NAME := 1 , x := 45 , y += 10 , w := 150 , h := 3 , COLOR := "888888" )
DRAW_LINE( GUI_NAME := 1 , x := 55 , y += 10 , w := 100 , h := 50 , COLOR := "lime" )
;----------------------------------------------------------------------------------------------------------------------------------
Gui,1:Show,w300 h200

return
GuiClose:
GuiContextMenu:
*ESC::
    ExitApp

DRAW_OUTLINE( GUI_NAME , X , Y , W , H , COLOR1 :="BLACK", COLOR2 := "BLACK" , THICKNESS := 1 ) {
	GUI , % GUI_NAME ": ADD" , PROGRESS , % "X" X " Y" Y " W" W " H" THICKNESS " BACKGROUND" COLOR1 
	GUI , % GUI_NAME ": ADD" , PROGRESS , % "X" X " Y" Y " W" THICKNESS " H" H " BACKGROUND" COLOR1 
	GUI , % GUI_NAME ": ADD" , PROGRESS , % "X" X " Y" Y + H - THICKNESS " W" W " H" THICKNESS " BACKGROUND" COLOR2 
	GUI , % GUI_NAME ": ADD" , PROGRESS , % "X" X + W - THICKNESS " Y" Y " W" THICKNESS " H" H " BACKGROUND" COLOR2 	
}
DRAW_LINE( GUI_NAME , X , Y , W , H , COLOR ) {
	GUI , % GUI_NAME ": ADD" , PROGRESS , % "X" X " Y" Y " W" W " H" H " BACKGROUND" COLOR 
}
Or here is a proper example.

Image

Return to “Ask For Help”

Who is online

Users browsing this forum: Google [Bot], jarhead, Jovannb, keylo, Lem2001, mammoet, mikeyww and 60 guests