After deciding to not go with PRISM and even left MEF for the great frontier we decided we still needed the idea of composite UI containers. It turns out the implementation of such containers is borderline trivial with the knowledge of attributes.
Lets explore one of our most common UI issues, tab controls. So first lets look at our Core person form.
As you can see we have a tab control down at the bottom. In our modular framework though, addresses and people have to be linked together with another module. So how did the Addresses tab get there?
Simple an attribute and our own special modular tab control.
<my1:ModularTabControl x:Name="PersonEditTabs" Grid.Row="1"/>
[ModularControls.ModularUIItem(ParentName = "PersonEditTabs")]
public partial class PersonAddressTab : TabItem
With these two controls, our tab control is linked in, but how does it work?
Inside the modular tab control we have embedded code that searches for attributes of ModularControls that have the same name and target a tab item. Then we simply load them in.
Lets add Documents now!
<sdk:TabItem x:Class="RiteTrack.PersonDocumentsModule.PersonDocuments"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk"
d:DesignHeight="300" d:DesignWidth="400" Header="Documents">
<Grid x:Name="DocumentsLayoutRoot" Background="White">
<TextBlock Text="Coming soon!!!">TextBlock>
Grid>
sdk:TabItem>
[ModularControls.ModularUIItem(ParentName="PersonEditTabs")]
public partial class PersonDocuments : TabItem
With a simple Visual Studio template we will be publishing you can add these tabs like hot cakes…
So the bad news is that we are forced into global namescoping here. The good news is, with the proper design that shouldn’t be a problem.
Our solution achieves IOC and truly modular UI.
We have added Tabcontrols, Stackpanels, WrapPanels and accordions so far. Look for the upcoming 4.1 release to see the insides of these controls (hint there is only about 10 lines of code in each!).