DataBinding Ribbon Tabs

[jed]

Hi

I have the following simple Objects (Tablist):

class tabObject
   {

       public string Header { set; get; }

   }

class tabsObjects

   {

       public string Header { set; get; }

       private List<tabObject> _tabs = new List<tabObject>();

       public tabsObjects()

       {

           _tabs.Add(new tabObject { Header = "Tab1" });

           _tabs.Add(new tabObject { Header = "Tab2" });

           _tabs.Add(new tabObject { Header = "Tab3" });

       }

       public List<tabObject> Tabs

       {

           get { return _tabs; }

           set { _tabs = value; }

       }

   }

my xaml:

<Window x:Class="RibbonTest.MainWindow"
                xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
                xmlns:code="clr-namespace:RibbonTest"
                Title="MainWindow" Height="350" Width="525">
    <Window.DataContext>
        <code:tabsObjects/>
    </Window.DataContext>
    <Window.Resources>
        <DataTemplate DataType="{x:Type code:tabObject}">
            <telerik:RadRibbonTab Header="{Binding Path=Header}">
                <telerik:RadRibbonGroup Header="Group1">
                </telerik:RadRibbonGroup>
                <telerik:RadRibbonGroup Header="Group2">
                </telerik:RadRibbonGroup>
                <telerik:RadRibbonGroup Header="Group3">
                </telerik:RadRibbonGroup>
            </telerik:RadRibbonTab>
        </DataTemplate>
    </Window.Resources>
    <Grid>
        <telerik:RadRibbonView VerticalAlignment="Top" ItemsSource="{Binding Tabs}">
        </telerik:RadRibbonView>
    </Grid>
</Window>

the result is attached, as you see the 3 Tabs were generated as expected, but the RibbonGroups are missing.

In the DesignView i get an Exception if i click in the line <telerik:RadRibbonTab Header="{Binding Path=Header}"> or </telerik:RadRibbonTab> the Designer crashes with this Exception: ArgumentException: Property Items not found in the property collection

has anyone an idea whats missing or wrong?

Thanks in advance

unfortunately attaching the project is not allowed


[jed]

finaly found the Solution.. had to think another way:

class groupObject : INotifyPropertyChanged
    {
        private string _header;
        public string Header
        {
            set
            {
                _header = value;
                RaisePropertyChanged("Header");
            }
            get { return _header; }
        }

        public event PropertyChangedEventHandler PropertyChanged;

        private void RaisePropertyChanged(string propertyName)
        {
            PropertyChangedEventHandler handler = PropertyChanged;
            if (handler != null)
            {
                handler(this, new PropertyChangedEventArgs(propertyName));
            }
        }
    }

class tabObject
    {
        public string Header { set; get; }
        private ObservableCollection<groupObject> _groups = new ObservableCollection<groupObject>();
        public ObservableCollection<groupObject> Groups
        {
            get { return _groups; }
            set
            {
                _groups = value;
            }
        }
    }

 class tabsObjects
    {
        public string Header { set; get; }
        public List<tabObject> _tabs = new List<tabObject>();
        public tabsObjects()
        {
            _tabs.Add(new tabObject { Header = "Tab1", Groups = new ObservableCollection<groupObject>() { new groupObject { Header = "Group 1" }, new groupObject { Header = "Group 2" }, new groupObject { Header = "Group 3" } } });
            _tabs.Add(new tabObject { Header = "Tab2", Groups = new ObservableCollection<groupObject>() { new groupObject { Header = "Group 1" }, new groupObject { Header = "Group 3" } } });
            _tabs.Add(new tabObject { Header = "Tab3", Groups = new ObservableCollection<groupObject>() { new groupObject { Header = "Group 1" }, new groupObject { Header = "Group 7" }, new groupObject { Header = "Group 8" } } });
        }
        public List<tabObject> Tabs
        {
            get { return _tabs; }
        }
    }

xaml very simple, no DataTemplates needed:

<Window xmlns:my="http://schemas.microsoft.com/winfx/2006/xaml/presentation/ribbon"  x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:code="clr-namespace:RibbonTest"
        Title="MainWindow" Height="350" Width="525" x:Name="mainWindow">

    <Window.DataContext>
        <code:tabsObjects/>
    </Window.DataContext>

    <Window.Resources>
        <!-- RibbonTab -->
        <Style TargetType="{x:Type my:RibbonTab}">
            <Setter Property="Header" Value="{Binding Header}" />
            <Setter Property="ItemsSource" Value="{Binding Groups}" />
        </Style>
        <!-- RibbonGroup -->
        <Style TargetType="{x:Type my:RibbonGroup}">
            <Setter Property="Header" Value="{Binding Header}" />
        </Style>
    </Window.Resources>

    <DockPanel LastChildFill="True">
        <my:Ribbon DockPanel.Dock="Top" ItemsSource="{Binding Tabs}"/>
        <ContentControl/>
    </DockPanel>
</Window>

INotifyPropertyChanged works fine

very good MVVM Example for Ribbon Binding in this Sample: http://www.microsoft.com/en-us/download/details.aspx?id=11877