Forums - CSHTML5

How do I add overlay on particular container control?

e.g. I have a grid and it contains a textbox
now I want to add overlay on that grid and show some message, the contents of the grid being hidden,

How this can be achieved?

Hi,

You can see an example in the sample "Showcase" application: the initial "Welcome" screen is an overlay of the underlying elements. To view the "Showcase" sample, open Visual Studio and click "File" => "New" => "Project" => "C#/XAML for HTML5" => "Sample Controls Showcase".

The way to achieve this is to put a surrounding Grid with only 1 cell, and then add a child to that Grid. When you add a child to a Grid that has only one cell, the child takes the whole size of the grid, thus hiding the underlying Grid content.

Please feel free to let me know if it is not very clear.

Regards,
JS-Support

Thanks for your reply.

How to add overlay on existing grid or panel?

e.g.
I have a grid/panel which contains certain controls and I want to add overlay on that grid

Hi,

Let's assume you have the following XAML:



You can display an overlay by surrounding the original panel using another Grid, in which you add the overlay element, like this:



Regards,
JS-Support