How to Set the Title Bar of a Form Window Using XAML

How to Set the Title Bar of a Form Window Using XAML

  • Comments 2
  • Likes

So – I learned a cool new trick today – how to set the title bar of a form window using XAML and so I thought I would share.  Remember the Service Request project that we created awhile back?  Well – In that original version the title bar would say ‘Form Host’ since I hadn’t done anything to set it:

image

Now, by adding the bit of XAML below the title bar will read “<Work Item ID> : <Work Item Title>” like this:

image

The title bar will reflect any changes to the title property as the property is changed.

This is the bit of XAML that needed to be added to the form immediately after the opening <UserControl> element and the before the opening <Grid> element:

 

<scwpf:BusinessLogic.Rules>
        <scwpf:RuleCollection>
            <!-- Set Window Title -->
            <scwpf:Rule>
                <scwpf:Rule.Triggers>
                    <scwpf:PropertyChangedTrigger Binding="{Binding RelativeSource={x:Static RelativeSource.Self}, Path=DataContext}"/>
                    <scwpf:RoutedEventTrigger RoutedEvent="FrameworkElement.Loaded"/>
                    <scwpf:PropertyChangedTrigger Binding="{Binding Path=Title}"/>
                    <scwpf:PropertyChangedTrigger Binding="{Binding Path=Id}"/>
                </scwpf:Rule.Triggers>
                <scwpf:Rule.Conditions>
                    <scwpf:PropertyMatchCondition Binding="{Binding RelativeSource={x:Static RelativeSource.Self}, Path=DataContext}" Operation="NotEquals">
                        <scwpf:PropertyMatchCondition.Value>
                            <x:Null/>
                        </scwpf:PropertyMatchCondition.Value>
                    </scwpf:PropertyMatchCondition>
                    <scwpf:PropertyMatchCondition Binding="{Binding RelativeSource={x:Static RelativeSource.Self}, Path=IsLoaded}">
                        <scwpf:PropertyMatchCondition.Value>
                            <sys:Boolean>True</sys:Boolean>
                        </scwpf:PropertyMatchCondition.Value>
                    </scwpf:PropertyMatchCondition>
                </scwpf:Rule.Conditions>
                <scwpf:ModifyPropertyAction Binding="{Binding RelativeSource={x:Static RelativeSource.Self},
                                                              Path=(views:FormView.WindowTitle),
                                                              Mode=TwoWay}">
                    <scwpf:ModifyPropertyAction.ValueBinding>
                        <MultiBinding Mode="OneWay">
                            <MultiBinding.Converter>
                                <scwpf:FormatterConverter>{0}: {1}</scwpf:FormatterConverter>
                            </MultiBinding.Converter>
                            <Binding Path="Id" Mode="OneWay" FallbackValue="[New Service Request]"/>
                            <Binding Path="Title" Mode="OneWay" FallbackValue=""/>
                        </MultiBinding>
                    </scwpf:ModifyPropertyAction.ValueBinding>
                </scwpf:ModifyPropertyAction>
            </scwpf:Rule>
        </scwpf:RuleCollection>
    </scwpf:BusinessLogic.Rules>

The trigger part tells the form to evaluate the business rule on initial load of the form and anytime the title or ID properties change.  The Conditions indicate that this should only be run when the form has a DataContext and that it is completely loaded.  The ModifyPropertyAction specifies the logic to set the title bar property.  Notice how the Path points to view:FormView:WindowTitle.  That’s the trick to set the title bar.  In this case you could put any kind of XAML inside of the .ValueBinding element.  In this case I used a MultiBinding element and a FormatterConverter to put the Title and ID together separated by a colon.

This update has been checked into the CodePlex project if you want to download it and take a look at it:

http://scsmservicerequest.codeplex.com ChangeList 78032

Your comment has been posted.   Close
Thank you, your comment requires moderation so it may take a while to appear.   Close
Leave a Comment
  • Hi Travis,

    First, let me thank you for all the information I was able to gather on your blog in the last year.

    Fantanstic!

    In the above code, I get an error because "scwpf" is not referenced and therefore "businesslogic.rules" (or any other) is not found.

    Could you please let me know which reference is needed in the XAML for this to work?

    Thanks a lot,

    Stephane

  • @Stephane -

    I'm not exactly sure.  Please download and take a look at the Service Request project linked to at the beginning of this blog post.  You can see the references there.  Also look in the <UserControl> element in the XAML for the scwpf namespace declaration.