How can i define a ItemTemplate for RadRibbonBackstageItem?

[Thomas]

Hi,

I am trying to use dynamic BackstageItems. But how can i define a correct DataTemplate where all Bindings work?

Her my code...

<telerik:RadRibbonWindow
    x:Class="WpfRibbonBackstage.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:telerik="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.RibbonView"
    Title="MainWindow" Height="350" Width="525">
    <Grid>

        <Grid.Resources>

            <DataTemplate x:Key="BackstageSmallButtonTemplate">

                <telerik:RadRibbonBackstageItem Header="{Binding Text}"
                                                IsDefault="{Binding IsDefault}"
                                                IsSelectable="{Binding IsSelectable}"
                                                IsGroupSeparator="{Binding IsGroupSeparator}"
                                                CloseOnClick="{Binding CloseOnClick}"/>

            </DataTemplate>

        </Grid.Resources>

        <telerik:RadRibbonView   x:Name="Ribbon"
                                Title="Test"
                                ApplicationButtonContent="FILE"
                                ApplicationButtonVisibility="Visible"
                                 >

            <telerik:RadRibbonTab Header="Home"></telerik:RadRibbonTab>

            <telerik:RadRibbonView.Backstage>

                <telerik:RadRibbonBackstage ItemsSource="{Binding BackstageItems}"
                                            ItemTemplate="{StaticResource BackstageSmallButtonTemplate}"
                                            SelectedItem="{Binding SelectedBackstageItem}">

                </telerik:RadRibbonBackstage>

            </telerik:RadRibbonView.Backstage>

        </telerik:RadRibbonView>


    </Grid>
</telerik:RadRibbonWindow>

The Header binding works, but all other not!
Waht is wrong?

[Pavel R. Pavlov]

Hi Thomas,

Thank you for providing us with detailed information about your scenario. I can see in your snippet that you define a RadRibbonBackstageItem in your custom DataTemplate. Please note that your custom DataTemplate will be wrapped in a RadRibbonBackstageItem, hence with the current definition, the RadRibbonView will nest two RadRibbonBackstageItems one in another. You can set the bindings you need in a Style which targets the RadRibbonBackstageItem.

On the other hand, you need to have in mind, when you work with the RadRibbonBackstage, that it actually is a RadTabControl. This is why you need to specify ItemsSource, ItemTemplate and ContentTemplate.

For your convenience I prepared a sample project demonstrating how you can implement your approach in MVVM scenario. Please take a look at the attachment and let me know if you need any further assistance.

Regards,
Pavel R. Pavlov
Telerik

[Thomas]

Hi Pavel,

many thanks for your example!

But...
...this example works fine with the normal binraies!
When i use the NoXaml binaries, the backstage buttons arent visible!

I have added  the themes in the app.xaml, an added a reference to "Telerik.Windows.Themes.Windows8" !

<Application x:Class="RibbonView_WPF_Backstage_MVVM.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
             StartupUri="MainWindow.xaml">
    <Application.Resources>

        <ResourceDictionary>

            <LinearGradientBrush x:Key="RibbonnBackStage_DottedLineBrush" MappingMode="Absolute" SpreadMethod="Repeat" StartPoint="0,0.5" EndPoint="4,0.5">
                <GradientStop Offset="0" Color="#40000000" />
                <GradientStop Offset="0.5" Color="#40000000" />
                <GradientStop Offset="0.501" Color="Transparent" />
            </LinearGradientBrush>


            <DataTemplate x:Key="ContentTemplate">
                <TextBlock Text="{Binding Header}" />
            </DataTemplate>

            <DataTemplate x:Key="SelectedContentTemplate">
                <TextBlock Text="{Binding SelectedContent}" />
            </DataTemplate>

            <Style x:Key="BackstageGroupSeparator" TargetType="telerik:RadRibbonBackstageItem">
                <Setter Property="IsHitTestVisible" Value="False" />
                <Setter Property="IsTabStop" Value="False" />
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="telerik:RadRibbonBackstageItem">
                            <Rectangle Height="1"
                                   Margin="18 0 10 4"
                                   Fill="{StaticResource RibbonnBackStage_DottedLineBrush}" />
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>

            <Style TargetType="telerik:RadRibbonBackstageItem">
                <Setter Property="IsDefault" Value="{Binding IsDefault}" />
                <Setter Property="IsSelectable" Value="{Binding IsSelectable}" />
                <Setter Property="IsGroupSeparator" Value="{Binding IsGroupSeparator}" />
                <Setter Property="CloseOnClick" Value="{Binding CloseOnClick}" />
            </Style>

            <ResourceDictionary.MergedDictionaries>

                <ResourceDictionary Source="/Telerik.Windows.Themes.Windows8;component/themes/System.Windows.xaml" />
                <ResourceDictionary Source="/Telerik.Windows.Themes.Windows8;component/themes/Telerik.Windows.Controls.xaml" />
                <ResourceDictionary Source="/Telerik.Windows.Themes.Windows8;component/themes/Telerik.Windows.Controls.Navigation.xaml" />
                <ResourceDictionary Source="/Telerik.Windows.Themes.Windows8;component/themes/Telerik.Windows.Controls.Input.xaml" />
                <ResourceDictionary Source="/Telerik.Windows.Themes.Windows8;component/themes/Telerik.Windows.Controls.RibbonView.xaml" />

            </ResourceDictionary.MergedDictionaries>

        </ResourceDictionary>

    </Application.Resources>
</Application>

What is missing???

best regards
Thomas

[Pavel R. Pavlov]

Hello,

When using our NoXaml binaries you need to have in mind that you must base your custom Style on the default one. By doing so the .NET framework will override only the properties that you have defined in your custom Style. Otherwise, all properties that you have not defined in your custom Style will be discarded.

You can find more information about using our ImplicitStyles here.

I hope this will clarify all your concerns.

Regards,
Pavel R. Pavlov
Telerik

[Thomas]

Hi,

many thanks, it works ;-)