RadRibbonView Backstage Binding Issue

5 posts, 0 answers
  1. Stephanie
    Stephanie avatar
    3 posts
    Member since:
    Jun 2014

    Posted 22 Jun 2014 Link to this post

    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!
  2. Kiril Vandov
    Admin
    Kiril Vandov avatar
    324 posts

    Posted 24 Jun 2014 Link to this post

    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
     
    Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
     
  3. UI for WPF is Visual Studio 2017 Ready
  4. Stephanie
    Stephanie avatar
    3 posts
    Member since:
    Jun 2014

    Posted 24 Jun 2014 in reply to Kiril Vandov Link to this post

    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>
  5. Stephanie
    Stephanie avatar
    3 posts
    Member since:
    Jun 2014

    Posted 24 Jun 2014 in reply to Stephanie Link to this post

    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.

  6. Lance | Tech Support Engineer, Sr.
    Admin
    Lance | Tech Support Engineer, Sr. avatar
    138 posts

    Posted 25 Jun 2014 Link to this post

    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
     
    Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
     
Back to Top
UI for WPF is Visual Studio 2017 Ready