PC SOFT

FOROS PROFESIONALES
WINDEVWEBDEV y WINDEV Mobile

Inicio → WINDEV 26 → Auto resizing button's on full screen
Auto resizing button's on full screen
Iniciado por Timothy V, 01,ago. 2022 12:23 - 3 respuestas
Publicado el 01,agosto 2022 - 12:23
Hi all,

First of all, i'm new to Windev and i'm trying to find my way in it.

I struggle on my first little problem.
I'm making a little app with 9 buttons on it. They have to be a fluid width and high. I'm trying to use Anchors for this.
But it is just not working out for me.
I'm able to use fluid width or fluid heigh seperatly, then everything looks ok. But if try to do both at the same time, the buttons are overlapping.

See my examples with width, height and then the messed up all.

Fluid width:




Fluid height:




Fluid all:




I hope somebody here could help me into the righ direction.
Miembro registrado
92 mensajes
Publicado el 04,agosto 2022 - 13:07
Hello Timothy,

i was also not able to get it work using anchors, i would guess, one corner of the control is allways fixed (anchored) to a border or corner.

as workaround you can do this by coding like:

in the global declaration section of your place something like this
[Procedure MyWindow()
CONSTANT
//Define the Offsets
distanceBorderTop = 20
distanceBorderBottom = 20
distanceBorderLeft = 4
distanceBorderRight = 4
SpaceBetweenButtons = 3
//summarize the space
DistanceHorz = distanceBorderLeft + distanceBorderRight + (2 * SpaceBetweenButtons)
DistanceVert = distanceBorderTop + distanceBorderBottom + (2 * SpaceBetweenButtons)
END

//Helper-Structure, because array [x,y] of Control can not be declared
ST_Button is structure
btn is Control
END

//Reference Buttons in a 3x3 Array
garrButtons is array [3,3] of ST_Button
//Init Reference-Array
garrButtons[1,1].btn <- BTN_TopLeft
garrButtons[1,2].btn <- BTN_TopCenter
garrButtons[1,3].btn <- BTN_TopRight
garrButtons[2,1].btn <- BTN_CenterLeft
garrButtons[2,2].btn <- BTN_CenterCenter
garrButtons[2,3].btn <- BTN_CenterRight
garrButtons[3,1].btn <- BTN_BottomLeft
garrButtons[3,2].btn <- BTN_BottomCenter
garrButtons[3,3].btn <- BTN_BottomRight


Create also a procedure in your window like

//Calculate Metrics and Positions of Buttons
Procedure actOnReSize()
//Claculate new Buttonsizes
btnWidth is int = (WinInWidth(WIN_Main) - DistanceHorz) / 3
btnHeight is int = (WinInHeight(WIN_Main) - DistanceVert) / 3

FOR x = 1 TO 3
FOR y = 1 TO 3
//set new width and height
garrButtons[x,y].btn..Width = btnWidth
garrButtons[x,y].btn..Height = btnHeight
//set new Position
garrButtons[x,y].btn..X = distanceBorderLeft + ((x-1) * SpaceBetweenButtons) + ((x-1)*btnWidth)
garrButtons[x,y].btn..Y = distanceBorderTop + ((y-1) * SpaceBetweenButtons) + ((y-1)*btnHeight)
END
END


in the end of initialization section of your window
actOnReSize() //Init


add the resizing-event to your window and place there also
actOnReSize() //Recalculate


thats all, maybe there is a better solution

meikl ;)
Publicado el 05,agosto 2022 - 11:57
Thanks!
Was able to get it working with your scripts!
Publicado el 17,agosto 2022 - 11:55
meikl wrote:
Hello Timothy,

i was also not able to get it work using anchors, i would guess, one corner of the control is allways fixed (anchored) to a border or corner.

as workaround you can do this by coding like:

in the global declaration section of your place something like this
[Procedure MyWindow()
CONSTANT
//Define the Offsets
distanceBorderTop = 20
distanceBorderBottom = 20
distanceBorderLeft = 4
distanceBorderRight = 4
SpaceBetweenButtons = 3
//summarize the space
DistanceHorz = distanceBorderLeft + distanceBorderRight + (2 * SpaceBetweenButtons)
DistanceVert = distanceBorderTop + distanceBorderBottom + (2 * SpaceBetweenButtons)
END

//Helper-Structure, because array [x,y] of Control can not be declared
ST_Button is structure
btn is Control
END

//Reference Buttons in a 3x3 Array
garrButtons is array [3,3] of ST_Button
//Init Reference-Array
garrButtons[1,1].btn <- BTN_TopLeft
garrButtons[1,2].btn <- BTN_TopCenter
garrButtons[1,3].btn <- BTN_TopRight
garrButtons[2,1].btn <- BTN_CenterLeft
garrButtons[2,2].btn <- BTN_CenterCenter
garrButtons[2,3].btn <- BTN_CenterRight
garrButtons[3,1].btn <- BTN_BottomLeft
garrButtons[3,2].btn <- BTN_BottomCenter
garrButtons[3,3].btn <- BTN_BottomRight


Create also a procedure in your window like

//Calculate Metrics and Positions of Buttons
Procedure actOnReSize()
//Claculate new Buttonsizes
btnWidth is int = (WinInWidth(WIN_Main) - DistanceHorz) / 3
btnHeight is int = (WinInHeight(WIN_Main) - DistanceVert) / 3

FOR x = 1 TO 3
FOR y = 1 TO 3
//set new width and height
garrButtons[x,y].btn..Width = btnWidth
garrButtons[x,y].btn..Height = btnHeight
//set new Position
garrButtons[x,y].btn..X = distanceBorderLeft + ((x-1) * SpaceBetweenButtons) + ((x-1)*btnWidth)
garrButtons[x,y].btn..Y = distanceBorderTop + ((y-1) * SpaceBetweenButtons) + ((y-1)*btnHeight)
END
END


in the end of initialization section of your window
actOnReSize() //Init


add the resizing-event to your window and place there also
actOnReSize() //Recalculate


thats all, maybe there is a better solution

meikl ;)


Thanks these worked for my [url=https://howtowp.com/]How-to WP[/url] website.