Stretching your controls to fill a Prism Region

Recently I have been working with Prism to develop a Silverlight application that will handle administrative features of the main solution I am working on. It is a great opportunity for a guy like me to catch up with some design patterns and get hands dirty in Silverlight.

When I was near the completion two modules I realized that my views did not look great when they were hosted in the main UI application. They never stretched (especially my DataGrids) to full size even though at design time all was fine. So without doing any proper research I tried to simulate the whole problem in a simple Silverlight application (with no Prism involved) and guess what – all was working great, my datagrids stretched to fill the pages and it was a full WYSIWYG experience. There was only one other thing left to blame and it was Prism’s Regions – which I was write to put blame on.

John Papa in his blog explains the problem in details and provides a solution (Fill My Prism Region, Please : JohnPapa.net). If you scroll down the comments you will see that there is a great alternative for the coding solution (provided by NVenhola) – I have applied it and it works like a charm. All you have to do is modify the ItemsControl you are using to add a template to use a Grid. Below is the code change I made (add ItemsControl.ItemsPanel and ItemsPanelTemplate, and put a Grid in it).

    1: <ItemsControl Name="CounterDataViewerRegion" 
    2:               Regions:RegionManager.RegionName="CounterDataViewerRegion">
    3:     <ItemsControl.ItemsPanel>
    4:         <ItemsPanelTemplate>
    5:             <Grid/>
    6:         </ItemsPanelTemplate>
    7:     </ItemsControl.ItemsPanel>
    8: </ItemsControl>

Comments

• Anonymous
  May 19, 2011
  Wow, thanks.... i've been trying to find a fix, easy solution, im glad you've pointed this!