Support for IsSynchronizedWithCurrentItem

[Mark]

Hello,

As I am attempting to replace my stock WPF TabControl's with RadTabControl's it seems that the RadTabControl does not have a  IsSynchronizedWithCurrentItem property - which is especially useful when binding to observable collections.  Am I missing something simple, or do I need to actually implement this functionality as one would in Silverlight?

Thanks,
Mark.

[Valentin.Stoychev]

Hi Mark,

The TabControl in WPF is inheriting this property from its base "Selector" class. In Silverlight there is not such property in the base Selector class - thus our RadTabControl lack this property aswell.

You can check how to implement this in this article:
http://geekswithblogs.net/lbugnion/archive/2009/02/14/simulating-issynchronizedwithcurrentitem-in-silverlight-part-1.aspx
ttp://geekswithblogs.net/lbugnion/archive/2009/02/18/simulating-issynchronizedwithcurrentitem-in-silverlight-part-2.aspx  

Best wishes,
Valentin.Stoychev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Mark]

Hi Valentin,

I thought this might be the reason.  I was hoping though that since this control set is for WPF, and there is a different set for Silverlight, that you might consider including it in a future release.

Thanks,
Mark.

[Valentin.Stoychev]

Hello Mark,

There will be some improvements in SL3 about this particular behavior, but I'm not sure still if we will be able to use them in our control. We should wait until SL3 RTW.

Kind regards,
Valentin.Stoychev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Daniel Varrin]

Hi Valentin,

I was trying to implement the IsSynchronizedWithCurrentItem, but I was not able to make it work. In the example there are 3 controls bound together, but in my case I have a main control which is bound to an object containing a list, and it contains a data template bound to the list to display the tab for each item in the list.

<

 

 

HeaderedContentControl 
    Content="{Binding Path=Workspaces}"    
    ContentTemplate="{StaticResource WorkspacesTemplate}"

 

 

 

    Header="Workspaces"

 

 

 

    Style="{StaticResource MainHCCStyle}"

 

 

 

/>

 

<

 

 

DataTemplate x:Key="WorkspacesTemplate">

 

 

 

 

 

 

 

 

    <telerikNavigation:RadTabControl

 

 

 

 

 

 

 

        ex:SelectorExtension.IsSynchronizedWithCurrentItem="True"

 

 

 

 

 

 

 

        ItemsSource="{Binding}"

 

 

 

        ItemTemplate="{StaticResource ClosableTabItemTemplate}"

 

 

 

 

 

 

 

        Margin="4"

 

 

 

 

 

 

 

    />

 

 

 

 

 

 

 

 

</DataTemplate>

I've created the ObservableCollectionEx class and used it as the data structure for my list. Then when I add an item in the list I call a method "setActiveItem(newItem)" in which I'm calling the OnPropertyChanged("listOfItems").

But Nothing is working and the new item is not set as active. Is there something I am doing wrong?

Best regards,
Daniel

 

[Miroslav]

Hello Daniel Varrin,

The IsSynchronizedWithCurrentItem property means that the selection in the controls will be synchronized.

Some details of your implementation are missing but here is what you can do:
- Add a SelectedItem observable property to the ObservableCollectionEx class.
- Bind the selected item in the controls where you want this to be active (like the TabControl), like so:

SelectedItem="{Binding ItemsSource.SelectedItem, RelativeSource={RelativeSource Self}}"

This should be a generic solution that works with other controls as well.

Do you think that will work for you?

Best wishes,
Miroslav
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Ariel Gonzalez]

Hi

I have the same problem here. I tried to add an ActiveWorkspace property to my ViewModel and I keep that updated every time a new Workspace is added to the ObservableCollection and also when a workspace is closed. Therefore all the times ActiveWorkspace it will point to the Current Default view of the CollectionViewSource. Now when I put the SelectedItem to bind to the ActiveWorkspace property nothing happens. 

Any help on this

Thanks,

Ariel

[Ariel Gonzalez]

Hi Everyone

I coded a workaround for this problem.

I create an ActiveWorkSpace property on my MainWindowViewModel:

#region ActiveWorkSpace

WorkspaceViewModel _activeWorkSpace;

public WorkspaceViewModel ActiveWorkSpace

{

get

{

return _activeWorkSpace;

}

set

{

if (_activeWorkSpace != value)

{

_activeWorkSpace = value;

OnPropertyChanged("ActiveWorkSpace");

}

}

}

#endregion

It is VERY IMPORTANT that you add the last line in the setter "OnPropertyChanged("ActiveWorkSpace")" that's the Trick.

Of course you have to keep updated that property in two places: When you add a new tab and when you close one.

When adding a new tab:

        void SetActiveWorkspace(WorkspaceViewModel workspace)
        {
            ICollectionView collectionView = CollectionViewSource.GetDefaultView(this.Workspaces);
            if (collectionView != null)
                collectionView.MoveCurrentTo(workspace);
            this.ActiveWorkSpace = workspace;
        }

If you noticed the only new there is the last line where we actually set that the ActiveWorkSpace is the new one created

When a workspace is closed:

        void OnWorkspaceRequestClose(object sender, EventArgs e)
        {
            bool ChangeActive = false;
            WorkspaceViewModel newActive = null;
            WorkspaceViewModel workspace = sender as WorkspaceViewModel;
            workspace.Dispose();

            if (this.ActiveWorkSpace == workspace)
            {
                ChangeActive = true;
                int activeIndex = Workspaces.IndexOf(ActiveWorkSpace);
                newActive = Workspaces.ElementAtOrDefault(activeIndex + 1) ?? Workspaces.ElementAtOrDefault(activeIndex - 1);
            }

            this.Workspaces.Remove(workspace);

            if (ChangeActive) ActiveWorkSpace = newActive;
        }

Then you have to change your code in the XAML file and add this SelectedItem="{Binding Path=ActiveWorkSpace,Mode=TwoWay}" to the RadTabControl tag:

            <telerik:RadTabControl Grid.Row="2"  Name="radTabControl"  ItemsSource="{Binding Path=Workspaces}" ItemTemplate="{StaticResource ClosableTabItemTemplate}"
                                   SelectedItem="{Binding Path=ActiveWorkSpace,Mode=TwoWay}"
                               ReorderTabRows="True"
                               DropDownDisplayMode="WhenNeeded"
                               ScrollMode="Item"
                                   telerik:StyleManager.Theme="Summer"
                               />

I don't know why but it should perfectly work only changing the XAML code but for some reason it doesn't work so here it is the last but not least piece of code, this goes in your MainWindow.xaml.cs (Yes!! I know that shouldn't be any code there but that is why is a workaround), well rigth to the point here you have my code behind file:

    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            var ViewModel = new MainWindowViewModel();

            EventHandler handler = null;
            handler = delegate
            {
                ViewModel.RequestClose -= handler;
                this.Close();
            };

            ViewModel.RequestClose += handler;

            ViewModel.PropertyChanged += OnViewModelPropertyChanged;

            this.DataContext = ViewModel;
        }

        private void OnViewModelPropertyChanged(object sender, PropertyChangedEventArgs e)
        {
            switch (e.PropertyName)
            {
                case "ActiveWorkSpace":
                    var activeWS = (sender as MainWindowViewModel).ActiveWorkSpace;
                    if (activeWS != null) this.radTabControl.SelectedItem = activeWS;
                    break;
            }
        }
    }

Well this WORKS PERFECTLY FOR ME so I hope it goes the same way for you. Hope that in the future versions of RadControl for WPF there will be support for the IsSynchronizedWithCurrentItem right away in the XAML file.

Enjoy

Ariel