Web Container Control
From Xojo Documentation
The Container Control is a special control that can contain any other control (including other Container Controls). A Container Control can be used to:
- Organize groups of controls into reusable interface components
- Create custom controls made up of other controls
- Increase encapsulation and simplify complex web page layouts
- Create dynamic web page layouts
To use a Container Control on a web page, you first have to add one to your project using the Insert ↠ Container Control menu from the Insert button or menu.
When you click on a Container Control in the Navigator, a Layout Editor very similar to the Web Page Layout Editor appears. In this Layout Editor, you can add controls to the Container Control.
You have two ways to add a Container Control to your web page layout. First, you can drag it from the Navigator onto the Web Page Layout Editor. Or you can find it in the Library in the Project Controls section and drag it from there to the Web Page Layout Editor.
A Container Control itself is invisible in built applications. Your application only see the controls on the Container Control and not the Container Control itself.
Container Controls are commonly used to simplify web page layouts. In addition to adding a Container Control directly to your layout, you can also add Container Controls dynamically at run-time.
Dynamically Adding Container Controls at Run-Time
Use the EmbedWithin method to add a Container Control that you've added to your project to a Web Page at runtime. This code in the Shown event handler of a Web Page adds a Container Control to the top-left corner of the page:
To remove a container, you call its Close method. This means you'll need to keep a reference to the container so rather than declaring a variable to it in a method (which won't exist in other methods), so you should instead use a property. This code adds a container to a page using an existing properfy of the page (MainContainer As MyContainer):
This code in a button's Action event handler can now remove the container:
These projects demonstrate ways to use Container Controls: