RadRibbonView Backstage Binding Issue

[Stephanie]

Hi all,

I'm having an issue where I can't get an object to bind to my backstage view. I've used the code from the website to try and implement a recent file list from a class within another project.

A cut-down version of my BackstageViewModel to demonstrate what I'm calling:

public class BackstageViewModel : IViewModel {

    public RecentFileList RecentFiles { get; set; } // the property I want to point to

    public BackstageViewModel(ApplicationCommandProxy commandProxy, DataHolder data)
    {
        //random setup stuff
    }

    //and so on...
}

The RecentFileList class is a class from the WpfApplicationFramework library. You can obtain the library here. In summary, it's a holder class for a ReadOnlyObservableCollection of RecentFile called RecentFiles.

This is the portion of the code where I'm creating my items control in my backstage where ssm points to the project namespace.

<ItemsControl Name="RecentItem" DataContext="{Binding ssm:BackstageViewModel}" ItemsSource="{Binding RecentFiles.RecentFiles}" Focusable="True" DisplayMemberPath="RecentFiles">
         <ItemsControl.Template>
                    <ControlTemplate>
                           <telerik:RadRibbonButton Width="285" Command="{x:Static commands:ApplicationCommands.RecentDocumentCommand}">
                                    <StackPanel Orientation="Horizontal">
                                            <Image Source="Resources/Open_16.png" />
                                            <StackPanel Margin="3 0 0 0" HorizontalAlignment="Left">
                                                   <TextBlock Margin="0 0 0 2" Text="Example Study" />
                                                   <TextBlock Foreground="DimGray" Text="{Binding Path}" />
                                            </StackPanel>
                                     </StackPanel>
                            </telerik:RadRibbonButton>
                    </ControlTemplate>
          </ItemsControl.Template>
</ItemsControl>

All I need to do is have the ItemsControl populate using the ReadOnlyObservableCollection<RecentFile> from within the RecentFileList object. I'm struggling to get it to bind correctly so any help would be greatly appreciated!

[Kiril Vandov]

Hello Stephanie,

The RadRibbonBackstage is hosted inside an Adorner which have some limitations. For instance when you try to apply an Implicit style to an element located in an Adorner, if you define the style inside the Window.Resources the Adorner can not access the style and it will not be applied. If you need to apply an implicit style to an element of the Adorner you will need to use the App.xaml or the RadRibbonBackstage.Resource in our current case.

I have attached a sample project demonstrating the approach for your convenience.

I hope this information helps.

Kind regards,
Kiril Vandov
Telerik

 

 

[Stephanie]

Hi Kiril,

I've taken in what you've said and I've taken a step back to try and get it to populate the RadRibbonBackstageItem completely from a view model of it's own. All of my other backstageitems work. I made a simple view model based on the BackstageViewModel in your example and it won't even bind the header field. I've attached an image demonstrating this.

This is the code for my backstage. As you can see in the image, all of the other items work. Have I missed a step in my binding process or something?

<telerik:RadRibbonView.Backstage>
    <telerik:RadRibbonBackstage prism:RegionManager.RegionName="{x:Static inf:RegionNames.BackstageRegion}">
        <telerik:RadRibbonBackstageItem CloseOnClick="False" Header="Save" Icon="Resources/Save_16.png" IsSelectable="False" Command="{x:Static commands:ApplicationCommands.SaveCommand}" />
        <telerik:RadRibbonBackstageItem Header="Save As" Icon="Resources/SaveAs_16.png" IsSelectable="False" Command="{x:Static commands:ApplicationCommands.SaveAsCommand}" />
        <telerik:RadRibbonBackstageItem Header="Open" Icon="Resources/Open_16.png" IsSelectable="False" Command="{x:Static commands:ApplicationCommands.OpenCommand}" />
        <telerik:RadRibbonBackstageItem Header="{Binding ssm:RecentFilesViewModel.Header}"/>
        <telerik:RadRibbonBackstageItem IsGroupSeparator="True" />
        <telerik:RadRibbonBackstageItem Header="New" Icon="Resources/New_16.png" IsSelectable="False" Command="{x:Static commands:ApplicationCommands.NewCommand}" />
        <telerik:RadRibbonBackstageItem Header="Add Network" Icon="Resources/New_16.png" IsSelectable="False" Command="{x:Static commands:ApplicationCommands.AddNetworkCommand}" />
        <telerik:RadRibbonBackstageItem Header="Close Study" Icon="Resources/Exit_16.png" IsSelectable="False" Command="{x:Static commands:ApplicationCommands.CloseCommand}" />
        <telerik:RadRibbonBackstageItem Header="Exit" Icon="Resources/Exit_16.png" IsSelectable="False" Command="{x:Static commands:ApplicationCommands.ExitCommand}" />
    </telerik:RadRibbonBackstage>
</telerik:RadRibbonView.Backstage>

[Stephanie]

I've managed to make the header bind by making it static but obviously that's not an option with a recent file list. That will be updated whenever a new file is opened. It seems the ItemsSource won't accept my RecentFile list, even when I make it into an Observable collection.

[Lance | Manager Technical Support]

Hi Stephanie,

Attached is a sample I've written based on your ViewModel. To demonstrate using a ReadOnlyDictionary and a ReadOnlyCollection, I've created two BackstageViewModel objects that are bound to the Recent BackstageItem's lists.

Download, examine and run the demo. You'll see that both lists can be displayed in the Recent items list. You'll find my code comments throughout the app. In particular check out the following locations:

1 - BackstageViewModel.cs
2 - DictionaryToCollectionConverter.cs
3 - MainPage.xaml (scroll down to the "Recent" BackstageItem section)

Also notice how I use a RadRibbonButton in the ItemsControl's DataTemplate. Although I can't see what you're using for your template, I suspect it might be some part of your problem because you report seeing the class name being listed instead of the items.

Thank you for contacting Support and thank you for choosing Telerik.

Regards,
Lance
Telerik