How can i define a ItemTemplate for RadRibbonBackstageItem?

5 posts, 2 answers
  1. Thomas
    Thomas avatar
    3 posts
    Member since:
    Sep 2013

    Posted 18 Sep 2013 Link to this post

    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: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?


  2. Answer
    Pavel R. Pavlov
    Admin
    Pavel R. Pavlov avatar
    1182 posts

    Posted 23 Sep 2013 Link to this post

    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
    TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for WPF.
    Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
    Sign up for Free application insights >>
  3. UI for WPF is Visual Studio 2017 Ready
  4. Thomas
    Thomas avatar
    3 posts
    Member since:
    Sep 2013

    Posted 02 Oct 2013 Link to this post

    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: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

  5. Answer
    Pavel R. Pavlov
    Admin
    Pavel R. Pavlov avatar
    1182 posts

    Posted 07 Oct 2013 Link to this post

    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
    TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for WPF.
    Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
    Sign up for Free application insights >>
  6. Thomas
    Thomas avatar
    3 posts
    Member since:
    Sep 2013

    Posted 07 Oct 2013 Link to this post

    Hi,

    many thanks, it works ;-)

Back to Top
UI for WPF is Visual Studio 2017 Ready