Binding OutlookBar to hierarchical object collection

2 posts, 0 answers
  1. Johan
    Johan avatar
    1 posts
    Member since:
    Mar 2014

    Posted 18 Mar 2014 Link to this post

    Hi,

    I am learning to use the Telerik tools and would like to do the following:

    I have a collection of viewmodels I would like to link to the RadOutlookbar, the collection is structured as this
    OutLookItems collection
      Element1 (header, title)
        subElement1(title, viewmodel1)
        subElement2(title, viewmodel2)
      Element2 (header, title)
        subElement3(title, viewmodel3)
        subElement4(title, viewmodel4)

    I managed to link the main level (Element1, Element2) to the RadOutlookbar and I can see them on the screen.
    But I fail to link the second level the a RadListbox that I defined as contenttemplate  in the RadOutlookbar.

    What I need to add to get this working?

    Johan
     
  2. Boris
    Admin
    Boris avatar
    276 posts

    Posted 21 Mar 2014 Link to this post

    Hello Johan,

    I attached a sample project that demonstrates how you can bind RadOutblokBar to a collection of business objects. You can set the ContentTemplate property of the RadOutlookBarItem through style like so:

    <Style TargetType="telerik:RadOutlookBarItem">
                <Setter Property="Header" Value="{Binding Header}" />
     
                <Setter Property="ContentTemplate">
                    <Setter.Value>
                        <DataTemplate>
                            <telerik:RadListBox ItemsSource="{Binding ListBoxItems}">
                                <telerik:RadListBox.ItemTemplate>
                                    <DataTemplate>
                                        <TextBlock Text="{Binding ItemName}" />
                                    </DataTemplate>
                                </telerik:RadListBox.ItemTemplate>
                            </telerik:RadListBox>
                        </DataTemplate>
                    </Setter.Value>
                </Setter>
            </Style>

    Please examine the provided solution and let us know if this helps.

    Regards,
    Boris Penev
    Telerik
     

    Build cross-platform mobile apps using Visual Studio and .NET. Register for the online webinar on 03/27/2014, 11:00AM US ET.. Seats are limited.

     
  3. UI for WPF is Visual Studio 2017 Ready
Back to Top