How to bring control on top

[abbasaif]

Hi,

I am facing a problem in showing the container to the front of all.
In one container I placed an image and in click event of it I resize the container according to the grid inside the same container.
Everything is working except when I placed this image within another container, it is not going out the border of the container.
How can I show it to required size.

Please find the image (Img1.gif), (it is what I am facing)
Please find the image (Img2.gif), (which is required)

Kindly suggest me.

Thanks

Abbasaif

 

[GriffMG]

Use ZORDER
From the help:

Places a specified form or control at the front or back of the z-order within its graphical level.
[Object.]ZOrder([nOrder])

nOrder

Specifies an integer indicating the position of the object relative to other objects.
If you omit nOrder, the setting is 0.

Setting Description
0 (Default) The object is positioned at the front of the z-order.

1 The object is positioned at the back of the z-order.



Regards

Griff
Keep [Smile]ing

There are 10 kinds of people in the world, those who understand binary and those who don't.

I'm trying to cut down on the use of shrieks (exclamation marks), I'm told they are !good for you. ​

 

[Koen Piller]

Hi,

It seems to me you would like to have a colored heading on your grid's header. You want to place a container over your grid. For that you have several options.
1) place the colored heading container manualy on your grid and if ness, click on the VFP menu: Format-> Bring to Front
or
2) color the headings: Grid.Themes = .F. in your Header select the color you want for backcolor

Rgds,

Koen

 

[abbasaif]

Hi

Places a specified form or control at the front or back of the z-order within its graphical level.
[Object.]ZOrder([nOrder])

I did the same, but no luck. It is not going out of the horizon of the parent container.

Abbasaif

 

[abbasaif]

Hi,

It seems to me you would like to have a colored heading on your grid's header.

No, I just wanted to display the container of the "help" outside of the parent container.

Thanks

Abbasaif

 

[Olaf Doschke]

If something is inside a container, you have to call Zorder(0) on the container to bring the full container to the top-
But what you not will be able to do is set a control's parent to let it swap position in the object hierarchy, .Parent is a read-only property.
And you also can't let the container move up its child object to the same hierarchy level.

If you want the freedom to move things around in z-order per individual control, you can't use the container concept. Everything would need to be directly on the form canvas with object name path THISFORM.objectnameX so it can be put in front of other THISFORM.objectnameY objects. But I'd not recommend that, as that complicates other things, for sure. For example, maintaining the single objects in classes. You can't even write code about two controls belonging to a group like a search textbox and a grid when you give up the control concept. That includes the great idea to make use of the control base class to create such groups based on them instead of containers. They also will mean you can only change the outmost control object z-order.

Bye, Olaf.

Olaf Doschke Software Engineering

https://www.doschke.name

 

[Koen Piller]

Mr. Abbasaif,

I now understand you would like to show a container inside an other container. You will have to play with the Zorder()

try this:

**************************************************
*-- Class:        zordertest
*-- ParentClass:  form
*-- BaseClass:    form
*-- Time Stamp:   11/12/19 09:40:08 PM

PUBLIC oForm as Form
oForm = CREATEOBJECT('ZorderTest')
oForm.Show(2)
RETURN

DEFINE CLASS zordertest AS form


	Top = 0
	Left = 0
	Height = 288
	Width = 681
	DoCreate = .T.
	Caption = "Form1"
	Name = "Form1"


	ADD OBJECT command1 AS commandbutton WITH ;
		Top = 24, ;
		Left = 432, ;
		Height = 37, ;
		Width = 97, ;
		Caption = "Show Yellow", ;
		Name = "Command1"


	ADD OBJECT command2 AS commandbutton WITH ;
		Top = 24, ;
		Left = 576, ;
		Height = 37, ;
		Width = 97, ;
		Caption = "HIde Yellow", ;
		Name = "Command2"


	ADD OBJECT container2 AS container WITH ;
		Top = 72, ;
		Left = 168, ;
		Width = 108, ;
		Height = 96, ;
		BackColor = RGB(255,255,0), ;
		Name = "Container2"


	ADD OBJECT container1 AS container WITH ;
		Top = 48, ;
		Left = 120, ;
		Width = 200, ;
		Height = 200, ;
		BackColor = RGB(255,0,0), ;
		Name = "Container1"


	PROCEDURE command1.Click
		Thisform.Container2.ZOrder(0)
	ENDPROC


	PROCEDURE command2.Click
		Thisform.Container2.ZOrder(1)
	ENDPROC


ENDDEFINE
*
*-- EndDefine: zordertest
**************************************************

Koen

 

[abbasaif]

Thanks Mr. Koen Piller

Thanks for the reply,

Let me explain you again by taking the example of your code:

1. Kindly reduce the size of the red container
2. Increase the size of the yellow container than the red container, and keep it visible.
3. Keep the Yellow Container inside the red container.
3. Put the "Show Yellow" command button inside the yellow container.
4. Now, what I want if I click on "Show Yellow" button the Yellow container which is now
in bigger size than the red container should display in full.

I hope I tried to explain you.

Regards

Abbasaif

 

[Olaf Doschke]

Dear Abbasaif,

in Koen's code you can do that, simply change the Width/Height for container1 and 2 as you like. But in your situation, I strongly assume the containers are nested. An outer container always clips its content. You also can't put the inner conatiner outside of the outer container, you can't change the parent object at runtime. Only then it could overlap outside. VFP is NOT HTML, where things "inside" other things are allowed to overlap and flow outside.

That's what I already said.

If your two containers are not nested inside each other you call ZORDER(0) on the container you want to be on top.

This modifies Kiens code with overlapping container sizes putting on or the other on top instead of putting one on top or to the back. Just another strategy to do the same thing, but concentrating on the "make this top" aspect only using ZORDER(0)

**************************************************
*-- Class:        zordertest
*-- ParentClass:  form
*-- BaseClass:    form
*-- Time Stamp:   11/12/19 09:40:08 PM

PUBLIC oForm as Form
oForm = CREATEOBJECT('ZorderTest')
oForm.Show(2)
RETURN

DEFINE CLASS zordertest AS form

   Top = 0
   Left = 0
   Height = 288
   Width = 681
   DoCreate = .T.
   Caption = "Form1"
   Name = "Form1"


   ADD OBJECT command1 AS commandbutton WITH ;
      Top = 110, ;
      Left = 333, ;
      Height = 37, ;
      Width = 197, ;
      Caption = "Bring red to the top", ;
      Name = "Command1"


   ADD OBJECT command2 AS commandbutton WITH ;
      Top = 150, ;
      Left = 333, ;
      Height = 37, ;
      Width = 197, ;
      Caption = "Bring yellow to the top", ;
      Name = "Command2"


   ADD OBJECT container1 AS container WITH ;
      Top = 50, ;
      Left = 100, ;
      Width = 100, ;
      Height = 200, ;
      BackColor = RGB(255,0,0), ;
      Name = "Container1"

   ADD OBJECT container2 AS container WITH ;
      Top = 100, ;
      Left = 50, ;
      Width = 200, ;
      Height = 100, ;
      BackColor = RGB(255,255,0), ;
      Name = "Container2"

   PROCEDURE command1.Click
      Thisform.Container1.ZOrder(0)
   ENDPROC


   PROCEDURE command2.Click
      Thisform.Container2.ZOrder(0)
   ENDPROC


ENDDEFINE
*
*-- EndDefine: zordertest
**************************************************

This is only possible, because the containers are not nested, they both are objects direclty on the form, they just have a z-order anyway. Once you nest containers overlapping becomes impossible. It's like wanting controls to stick outside the form itself. Once something is inside a container, the outside container is the maximum rectabgle area it shows, just like controls you shift to control.top>form.height or control.left>form.widht are invisible, they don't appear belo or right of the form.

Bye. Olaf.

Olaf Doschke Software Engineering

https://www.doschke.name

 

[abbasaif]

Thanks Mr. Olaf

I will check it

Abbassaif

 

[abbasaif]

Thanks for the reply and sorry for the delay.

Actually I want the parent container in the back (Zorder(1)) of the child container.

There is an image of search in child container on which if it is clicked the child container (which is bigger in size of the parent container) should come out of the parent container boundary.

Regards

Abbassaif

 

[Olaf Doschke]

... the child container ... should come out of the parent container boundary.

Well, you can't have that.

An outer container always clips its content. You also can't put the inner conatiner outside of the outer container, you can't change the parent object at runtime.

But what you not will be able to do is set a control's parent to let it swap position in the object hierarchy1, .Parent is a read-only property.
And you also can't let the container move up its child object to the same hierarchy level.

If you need something to appear in front of something else, both have to be on the same hierarchy level. You can't unnest something at runtime, it has to start unnested. So your only solution is not nesting the containers you need to z-order differently at runtime. It should not be hard to do that, because both the things are based on a container anyway.

You have to keep these containers unnested already at design time, then you can zorder them, no matter if you bring something to top with zorder(0) or to the bottom with zorder(1), but nothing brings something out of a parentship.

Bye, Olaf.

Olaf Doschke Software Engineering

https://www.doschke.name

 

[abbasaif]

Thanks Mr. Olaf

I understood very well! let me check other alternatives.

Regards

Abbassaif

 

[Koen Piller]

Mr. Abbasaif,

Would you be able to show us what you are after? And explain the reason.

Regards,

Koen

 

[GriffMG]

I would have thought you could make the one within the parent container visible=.f. and then open a new one outside of the container
and move it to the uppermost position...

Regards

Griff
Keep [Smile]ing

There are 10 kinds of people in the world, those who understand binary and those who don't.

I'm trying to cut down on the use of shrieks (exclamation marks), I'm told they are !good for you. ​

 

[Olaf Doschke]

Griff,

that's a good idea, as long as a container is not needing more than an init gives it, ie.. when it has a state it gets from the interaction that's lost.

But in case the zorder only is necessary to hide something temporary and later make it visible on top again, og course the visible setting is the easiest thing to use. Also in that case the container you want to be on top and larger (wider or higher or both) as a container can't be nested inside.

What's bad design in a situation you need independent cotainers is, when code of one expects the other to be its parent or child object by code referencing it via THIS.PARENT.somcontrolwithintheparentcontainer or via THIS.childcontainert.somecontrolinthechildcontainer. That's obviously causing the dependency you don't want.

If youu have a dependency between two containers that visually should be close togehter then use a new third class, yet another container, sized as large so it can contain both other containers, alsways, and then one of these two can be on top inside the outmost container. And in the simplest case that outmost container is the form itself.

Bye, Olaf.

Olaf Doschke Software Engineering

https://www.doschke.name

 

[Koen Piller]

Olaf,
Are you sure Abbassaif wants the 2 containers to be depended of each other? I can't see this anywhere in this request.
Rgds,
Koen

 

[Olaf Doschke]

He doesn't want that, but they are, they are nested.
At least they're nested, or the advice to use ZORDER would have worked.

If the two containers are nested without addressing each other, then it will be easy to unnest them. Select the inner container, cut it with CTRL+X, step out onto the form level and paste it back in on that level with CTRL+V. And then you can do the ZORDERing. The only other thing to consider in that case is whether you set the containers as opaque or not.

Bye, Olaf.

Olaf Doschke Software Engineering

https://www.doschke.name

 

[Koen Piller]

Olaf,

I am still puzzled, please advise.
You have changed virtualy nothing in my simple test, only the sizes of the boxes. Are they now 'nested'? And if not what are the specifics for containers to be nested?
The way mr. Abbassaif wants his containers:

3. Keep the Yellow Container inside the red container.
3. Put the "Show Yellow" command button inside the yellow container.

Won't work as when you hide the yellow it will also hide the button, consequently you cannot unhide it anymore.
Buttons should be outside the containers.

Regards,

Koen

 

[Olaf Doschke]

Koen,

first let's clear up what nested means. It means that some container is inside another. Noit just visually but as child object.

And with that term defined all I did here in short was:
1. I told what's impossible. For example having a bigger container nested in a smaller container and then letting it show on top and stick out of the smaller container.
2. I showed what's possible. And as I don't see a reason for a use case where one container is completely hidden when it's on bottom, I changed your example to a high and a wide container. If one of the containers was just small so it hides completely, or if it is sufficient to hide, a solution not needing zorder at all would be switching visible .t./.f. And yes, of course that will need extra buttons, or the button making the hidden container visible must be in the other, that IS visible.

But these are details, they are up to Abbassaif.

Let's just wait, because only he can say what of his problem remains. Just one thing is sure: We can't offer a solution for something impossible. If you absolutely need a nested container only partially visible when it's at the back, also clipped by the size of an outer container, then that has to be nested. If you needs to come to top AND stick out, you have to use trickery and have the same container twice, one time nested inside to have that background and clipped behaviour and one time outside to be able to stick out.

Bye, Olaf.



Olaf Doschke Software Engineering

https://www.doschke.name