Linear navigation in WPF MVVM

Question

Hi, I'm using the Cinch MVVM framework, however I think this is something that relates to all WPF approaches.

I want to have a primary screen - Shell or MainWindow - which then contains various viewmodels. To navigate between viewmodels I'm using (or going to use) a tab control styled as a button strip with the content area beneath - which is all ok as I add the viewmodels to the tabcontrol (well to the 'Views' collection which is bound to the tab control) at runtime.

A screen that doesn't fit into this methodology is the sign in screen, which I don't really want to add to the tab control - preferably it should be in it's own usercontrol which takes up the entire screen apart from covering the logo; that is, I would like it to appear in the same window rather than a popup dialog, however I'm not sure how to add/ remove controls dynamically and then add subsequent tabcontrol once the user has signed in successfully (and remove the sign in screen). What containers should be used?

TIA.

Answer 1

The easiest way is put your tabcontrol in a Grid without columns and rows so it fill the grid by default. Then add an extra grid or loginusercontrol to the grid as shown below. The moment a user needs to login you can set the visibility of the MainTabControl" to collapsed and of the LoginGrid to Visible and switch it back after a succesfull login. I hope that the xaml below will help you enough.

<Grid>
    <TabControl x:Name="MainTabControl" Visiblity="Visible">
        ... put your tabs here ...
    </TabControl>
    <Grid x:Name="LoginGrid" Background="#60FFFFFF" Visibility="Collapsed">
        ... put your usercontrol to login here or the login controls themself
    </Grid>
</Grid>

Answer 2

You could use a ContentControl with content bound to a view model. So you'd have two view-models representing the sign-in screen and the main screen and use DataTemplate to display appropriate screen.

<Window.Resources>
...
<DataTemplate DataType="{x:Type my_view_models:SignInViewModel}">
  <my_controls:SignInScreenView />
</DataTemplate>
...
</Window.Resources>

<ContentControl Content={Binding} />