RadRibbonView ContextualGroup's PRISM

[Carl]

Hi

I am testing the RadRibbonView using PRISM. The RadRibbonView is set up as a region with modules populating the the View with RadRibbonTabs. I am looking for an example on how to dynamically add closable tab items in a TabControl defined as a separate region in the Shell from the RadRibbonTabs with a contextual group attached to every specific TabItem. So that when I select different TabItems in the TabControl I get a differenct contextual tab in the RadRibbonView for every TabItem.

Is there an example of this you could point me to?

[Tina Stancheva]

Hello Carl,

Please find attached a sample solution that demonstrates how to define RadRibbonView and RadTabControl in a Shell project and populate both from different modules. In order to synchronize the selection within the RibbonView and the TabControl, you will have to somehow bind the selected state of the ContextualTabs to the selected status of the RadTabItems. In the sample solution the ContextualTabs are defined together with the RadTabItems within the same module. This allows them to share the same business context and therefore the IsSelected property of both tabs (contextual and RadTabItem) is bound to the same business value.

Please have a look at the solution and let us know if you need more information.

Regards,
Tina Stancheva
Telerik

[Carl]

Perfect! That’s exactly what I needed. So the ContextualTab and the RadTabItem is sharing the same Viewmodel. Does that mean that I can place RadRibbonButtons with commands in the ContextualTab that will execute things in the RadTabItem?

[Tina Stancheva]

Hi Carl,

You can definitely trigger the same command from buttons within the Contextual RibbonTab and the RadTabItems. The fact that they do share a common ViewModel allows you to reuse and trigger the same methods from both. If you encounter any issues with that, don't hesitate to write back.

Regards,
Tina Stancheva
Telerik

[Carl]

Hi
The sample project you created was very helpful however I am having trouble with the bindigs in my two Views (The RadRibbonTab and the RadTabItem). In my ViewModel I have the header property defined like this; public string Header {get; set;} and in my two views I have the bindings set to; Header="{Binding Path=Header}" just like in your project but the header does not get updated?

The only difference I can see is that I register the views and set the DataContext via a command from another ViewModel and you did that in the Module. This is because I don’t want to show the ContextTab and The TabItem until a button is clicked in the RadRibbonView.

Any ideas on this problem?

[Carl]

Never mind!

I discovered that I was registering the Views and setting the DataContext like this:

RadRibbonContextTabView radRibbonContextTabView = _container.Resolve<RadRibbonContextTabView>();
RadTabItemView radTabItemView = _container.Resolve<RadTabItemView>();
radRibbonContextTabView.DataContext = radTabItemView.DataContext = new ContextTabTabItemViewModel();

_regionManager.RegisterViewWithRegion("RibbonRegion", typeof(RadRibbonContextTabView));
_regionManager.RegisterViewWithRegion("TabRegion", typeof(RadTabItemView));

I was never using the resolved Views.

Instead of doing this (which works):

RadRibbonContextTabView radRibbonContextTabView = _container.Resolve<RadRibbonContextTabView>();
RadTabItemView radTabItemView = _container.Resolve<RadTabItemView>();
radRibbonContextTabView.DataContext = radTabItemView.DataContext = new ContextTabTabItemViewModel();

_regionManager.RegisterViewWithRegion("RibbonRegion", () => radRibbonContextTabView);
_regionManager.RegisterViewWithRegion("TabRegion", () => radTabItemView);

[Carl]

I added a Style for my RadTabItems it in the RadRibbonTab ItemContainerStyle in my Shell. The Style has a Button to be able to close the tabs. I found this in a sample project posted in the TabControl forum. I am using a RoutedEventHelper class to fire the click event of this button. I have the following code in my Shell:

public Shell()

{

    InitializeComponent();

 

    EventManager.RegisterClassHandler(typeof(RadTabItem), RoutedEventHelper.CloseTabEvent, new RoutedEventHandler(OnCloseClicked));

}

        private void OnCloseClicked(object sender, RoutedEventArgs e)
        {
            RadTabItem tabItem = sender as RadTabItem;
            IRegionManager rm = RegionManager.GetRegionManager(this);
            rm.Regions["TabItemRegion"].Remove(tabItem);
        }

 However I also need to remove the RadRibbonContextTabView that is sharing the same ViewModel as the TabItemView and set the RadRibbonContextualGroup IsActive property to false. I need to bind IsActive to some property but I cant figure out where and how?

[Tina Stancheva]

Hello Carl,

As you have added the OnCloseClicked implementation in the shell project, you can create a ShellViewModel and add an IsActive property in it. You can even add multiple properties - one for each ContextualGroup defined within the RadRibbonView. In the OnCloseClicked() implementation you can easily get the DataContext of the Shell view and set the corresponding IsActive property to false.

If you have any troubles implementing this approach, you can create a support ticket and send your current implementation. If you describe in more details your requirements (if there will be only one or multiple ContextualGroups), we will do our best to extend it to demonstrate an approach that can work for you.

Regards,
Tina Stancheva
Telerik

[Carl]

Thank you for pointing me in the right direction. It worked perfectly! When I close the TabItem I get the DataContext of the Shell just as you told me. When the TabItems is added to the region I use the EventAggregator and set the IsActive property to true from another ViewModel by subscribeing to an event in my ShellViewModel

[Fred Lackey]

Great example, Tina.  

[Thomas]

Hi Tina, the sample is very nice but out of date. Is there a chance to update this to the latest version of Prism and Telerik?

best regards 

Thomas

[Vladimir Stoyanov]

Hello Thomas,

I am attaching the sample project modified to use the latest version of Prism and UI for WPF. The necessary changes were only on the Prism side. You can take a look at the following forum thread for more information on upgrading Prism: How to implement the new PrismApplication to replace the Bootstrapper class.

Hope this helps.

Regards,
Vladimir Stoyanov
Progress Telerik

[Thomas]

Hi Vladimir,

Thank you for the fast answer, it works. But one thing is not really clear for me. If I want to use the Shell Window based on RadRibbonWindow the Dependency Injection works and compiled without any error. But the form is empty. For me, it looks like a mismatch between the PrismApplicationBase (based on Window Class) and the RadRibbonWindow. I also found a listed issue on https://github.com/PrismLibrary/Prism/issues/1413. This describes my root issue. 

I also create a Ticket to your Support Team.

I'll post the feedback...

Best Regards

Thomas