How to set window content like toolbar bar and/or status bar

Jun 5, 2013 at 8:07 PM
Edited Jun 5, 2013 at 8:13 PM
Follow simple steps to allow you to create static(without changing) content in the main window without losing the great ability to use the "BBCode" for navigation:

This may resolve such issues:
Have on hand:
In ...\Windows\Controls\ModernFrame.cs add two DependencyProperties below:
public static readonly DependencyProperty FrameTopContentProperty
                = DependencyProperty.Register("FrameTopContent",
                typeof(object), typeof(ModernFrame),
                new PropertyMetadata(null));

public object FrameTopContent
{
    get { return (object)GetValue(FrameTopContentProperty); }
    set { SetValue(FrameTopContentProperty, value); }
}

public static readonly DependencyProperty FrameBottonContentProperty
                = DependencyProperty.Register("FrameBottonContent",
                typeof(object), typeof(ModernFrame),
                new PropertyMetadata(null));

public object FrameBottonContent
{
    get { return (object)GetValue(FrameBottonContentProperty); }
    set { SetValue(FrameBottonContentProperty, value); }
}
In ...\Themes\ModernFrame.xaml change ModernFrame style ControlTemplate simply adding grid lines on grid inside border, set Grid.Row for TransitioningContentControl, ProgressBar and add the hosts like:
<Grid HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
      VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
      Margin="{TemplateBinding Padding}">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>

    <controls:TransitioningContentControl 
          Grid.Row="1" 
          Content="{TemplateBinding Content}"
          ContentTemplate="{TemplateBinding ContentTemplate}"
          ContentTemplateSelector="{TemplateBinding ContentTemplateSelector}"
          Margin="{TemplateBinding Padding}" />
    <!-- added to suport custom content -->
    <ContentControl Content="{TemplateBinding FrameTopContent}"/>
    <ContentControl Grid.Row="2" Content="{TemplateBinding FrameBottonContent}"/>

    <!-- display progress bar while content is being loaded -->
    <ProgressBar IsIndeterminate="True" Grid.Row="1"
                 HorizontalAlignment="Stretch"
                 VerticalAlignment="Top"
                 Height="4"
                 Margin="0,-4,0,0"
                 Visibility="{TemplateBinding IsLoadingContent, 
                 Converter={StaticResource BooleanToVisibilityConverter}}" />
</Grid>
This has to be done here so do not miss the navigation capability of the "BBCode" if used in a content.

In ...\Windows\Controls\ModernWindow.cs nearly the same:
public static readonly DependencyProperty FrameTopContentProperty
                = DependencyProperty.Register("FrameTopContent",
                typeof(object), typeof(ModernWindow),
                new PropertyMetadata(null));

public object FrameTopContent
{
    get { return (object)GetValue(FrameTopContentProperty); }
    set { SetValue(FrameTopContentProperty, value); }
}

public static readonly DependencyProperty FrameBottonContentProperty
                = DependencyProperty.Register("FrameBottonContent",
                typeof(object), typeof(ModernWindow),
                new PropertyMetadata(null));

public object FrameBottonContent
{
    get { return (object)GetValue(FrameBottonContentProperty); }
    set { SetValue(FrameBottonContentProperty, value); }
}
And finally in a small ModernWindow Template change ModernFrame adding like:

FrameTopContent="{TemplateBinding FrameTopContent}"
FrameBottonContent="{TemplateBinding FrameBottonContent}"
<!-- content frame -->
<controls:ModernFrame 
      x:Name="ContentFrame" 
      Grid.Row="3" 
      Grid.RowSpan="2" 
      Margin="36,8,16,16" 
      Source="{Binding ContentSource, 
          RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}" 
      ContentLoader="{TemplateBinding ContentLoader}"
      FrameTopContent="{TemplateBinding FrameTopContent}"
      FrameBottonContent="{TemplateBinding FrameBottonContent}"/>
Done.

Use:
<mui:ModernWindow.FrameTopContent>
    <controls:AppBar/>
</mui:ModernWindow.FrameTopContent>
<mui:ModernWindow.FrameBottonContent>
    <controls:AppBar/>
</mui:ModernWindow.FrameBottonContent>
Would be nice if in the next release!
Jun 8, 2013 at 4:58 PM
Thanks for revealing this to me! I have been struggling for two days to get a way to put a log out/exit button on the bottom of my app and your approach solved it for me.

Coming from a web/asp.net camp I have been looking for a kind of master page functionality in wpf navigation apps for a long time. I feel that this excellent framework should have some way of defining application level functionality more easily than what is possible at the moment. But anyways, I now have a way to put content in my main window. here is what I ended up with:
<!--<mui:ModernWindow.MenuLinkGroups> and bla, bla bla goes here --!>
<mui:ModernWindow.FrameBottomContent>
        <WrapPanel Height="25" VerticalAlignment="Bottom" HorizontalAlignment="Right">
            <mui:ModernButton Content="logout"></mui:ModernButton>
            <mui:ModernButton Content="exit"></mui:ModernButton>
        </WrapPanel>
</mui:ModernWindow.FrameBottomContent>
Thanks again for the great work!
Jun 10, 2013 at 7:38 PM
Edited Jun 10, 2013 at 7:39 PM
Hi !
I'm really interested in using that code
But, unfortunately, when copy/pasting code into mui-100711 , I'm getting errors as :

Error 1 The member "FrameTopContent" is not recognized or is not accessible. C:\Users\fprovencherleduc\Desktop\ModernUI.1.0.3\mui-100711\1.0\FirstFloor.ModernUI\FirstFloor.ModernUI\Themes\ModernWindow.xaml 145 43 FirstFloor.ModernUI


Duno
Might you provide 1.0.3 with your updated code?
Thanks
Jun 10, 2013 at 8:09 PM
This error is very common in DependencyProperty registered with typeof "third parameter" wrong, check it:

In ModernFrame.cs all DependencyProperty "third parameter" is typeof(ModernFrame);

In ModernWindow.cs all DependencyProperty "third parameter" is typeof(ModernWindow);
Jun 11, 2013 at 11:41 AM
I found my issue !

Note that I'm not really fluid in C Sharp, so the 'why' of the following is unknow for me :)

So,
I had to add commented lines before DependencyProperty declaration ..
?!

i.e.
    /// <summary>
    /// Identifies the FrameTopContentProperty dependency property.
    /// </summary>
    public static readonly DependencyProperty FrameTopContentProperty
            = DependencyProperty.Register("FrameTopContent",
            typeof(object), typeof(ModernWindow),
            new PropertyMetadata(null));
Or else, I was in fact stuck with this kind of error :
** Error 1 Warning as Error: Missing XML comment for publicly visible type or member 'FirstFloor.ModernUI.Windows.Controls.ModernWindow.FrameTopContentProperty' **

So far, I'm now able to use your code! Happy !
Thanks again.
Jun 11, 2013 at 2:23 PM
JorgH wrote:
Thanks for revealing this to me! I have been struggling for two days to get a way to put a log out/exit button on the bottom of my app and your approach solved it for me.

Coming from a web/asp.net camp I have been looking for a kind of master page functionality in wpf navigation apps for a long time. I feel that this excellent framework should have some way of defining application level functionality more easily than what is possible at the moment. But anyways, I now have a way to put content in my main window. here is what I ended up with:
<!--<mui:ModernWindow.MenuLinkGroups> and bla, bla bla goes here --!>
<mui:ModernWindow.FrameBottomContent>
        <WrapPanel Height="25" VerticalAlignment="Bottom" HorizontalAlignment="Right">
            <mui:ModernButton Content="logout"></mui:ModernButton>
            <mui:ModernButton Content="exit"></mui:ModernButton>
        </WrapPanel>
</mui:ModernWindow.FrameBottomContent>
Thanks again for the great work!
How you came up with 2 buttons?
When I add a second control, I'm getting this error : The property ''FrameBottomContent'' can only be set once!
Jun 24, 2013 at 12:19 PM
Fehler 1 Das Tag "ModernWindow.FrameTopContent" ist im XML-Namespace "http://firstfloorsoftware.com/ModernUI" nicht vorhanden. Zeile 29 Position 6. D:\DevTFS\SUPPORT\SUPPORT\MainWindow.xaml 29 6 SUPPORT

i still got this error?? why !!!
Aug 7, 2013 at 4:50 PM
Do we have a working sample that would demonstrate how this would solve the Flyout issue?
Dec 17, 2013 at 4:45 PM
Ditto flyte
Dec 19, 2013 at 12:43 AM
Thanks for the post, just added this and it works great.
Jan 22, 2014 at 9:14 AM
Hi,

I did get it this to work, see link for attached source https://skydrive.live.com/redir?resid=81CD6515C51E0420%21110


Regards
PrakashZa
Jan 25, 2014 at 5:23 AM
Does anybody here have a working sample of a flyout?
Jan 29, 2014 at 4:38 AM
Edited Jan 29, 2014 at 6:17 AM
Hi C0dEn0oB

In the sample I gave an link to above, has the xaml place holders for a status bar. You can further use http://stevenhollidge.blogspot.com/2012/06/silverlight-metro-app-bar.html for example and place the flyout in the

<mui:ModernWindow.FrameBottomContent>
<FlyoutControl .... />
<\mui:ModernWindow.FrameBottomContent>

Maybe someone can assist to metro-rize tho flyout for you.


Regards
PrakashZa
Sep 6, 2014 at 9:18 PM
Edited Sep 7, 2014 at 6:42 AM
FYI, these changes are not compatible with version 1.0.6, unfortunately.

When clicking on menu items, StackOverflowExceptions are thrown in:

VisualTreeHelperEx.GetParent()
NavigationHelper.FindFrame()