How to represent Model with TreeListView

7 posts, 0 answers
  1. Mikel
    Mikel avatar
    21 posts
    Member since:
    Feb 2014

    Posted 05 Apr Link to this post

    Hello.

     

    I want to represent my model(see attached image) with TreeListView.

     

    I have achieved to display process, work and drill instructions, but I dont know how to display Tasks and Programs.(see attached image)

     

    A example of my hierachy maybe that:

    ROOT(Process)
      |__ Process_1
                      |__ Process_1.1


                      |__ Drill
      |__ Work_2
                      |__ Task1
                      |__ Task2

     

     

     

     

     

  2. Mikel
    Mikel avatar
    21 posts
    Member since:
    Feb 2014

    Posted 05 Apr Link to this post

    Sorry I posted it unfinished.

    ROOT(Process)
      |__ Process_1
                      |__ Process_1.1
                             |__ Work 1.1.1

                                   |__ Task 1
                      |__ Drill 1.2

                            |__ Program 1
      |__ Work_2
                      |__ Task1
                      |__ Task2

     

    How can I solve It?

     

    Thanks!

     

  3. UI for WPF is Visual Studio 2017 Ready
  4. Dilyan Traykov
    Admin
    Dilyan Traykov avatar
    371 posts

    Posted 08 Apr Link to this post

    Hello Mikel,

    As stated in the RadTreeListView vs RadGridView section of RadTreeListView's Getting Started article, you should use RadTreeListView only when you need to display homogeneous data. For heterogeneous data, you should use a Hierarchical RadGridView. You can then use RadGridView's ChildTableDefinitions and HierarchyChildTemplate to construct the desired hierarchy.

    I hope you find the provided information helpful.

    Regards,
    Dilyan Traykov
    Telerik
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
  5. Mikel
    Mikel avatar
    21 posts
    Member since:
    Feb 2014

    Posted 14 Apr in reply to Dilyan Traykov Link to this post

    Hello Dilyan,

     

    I have achieved it do something similar, using RowDetails and RowDetailsTemplateSelector properties, to show or no RowDetails depending of the object type using in each row. (See attached image1)

     

    Now, I want to generate the functionality of a tree but without being.

    The idea is add Expander in rows that is not implemented default Expander, and add it manually if it is necessary. I have archieved it modifying the CellTemplate of the first collumn. To do it, I have added the Expander depending of the type of object.

     

    Now I try to complete that goals.

    • Goal 1: Change the icon used by the Expander to get the same appearance of the RadTreeViewList.   (See attached image2)
    • Goal 2: Link the Visibility property of the RowDetails, with IsExpanded property of Expander from its row.  (See attached image3)
    • Goal 3: Link object the Visibility property of the Expander, and depending of the the object’s properties, show or not the Expander.
      <telerik:RadExpander
            Grid.Column="0"     
            Visibility="{Binding Path=., Converter={StaticResource
            ResourceKey=Instruction_To_Expander_Visibility},
            UpdateSourceTrigger=PropertyChanged}"
      />

      I have achieved using a converter. The problem is,  the view is not updated if any property from the object changed.
      What can I do for solve that problem? How can I advice to view when any property from the object  has changed?

    • Goal 4: Get the width from left border to, right border of the Expander, and set that distance as row details left margin. It will simulate the indentation of TreeListView. (See attached image4)

    I try different ways to achieve that goals, but I dont accomplish. Could you help me?

     

    Thank you!

  6. Dilyan Traykov
    Admin
    Dilyan Traykov avatar
    371 posts

    Posted 18 Apr Link to this post

    Hello Mikel,

    I will try to target your questions one by one:

    1) You can modify the ControlTemplate of the RadExpander in Blend to your liking as suggested in this forum thread. You could also replace the RadExpander with a RadGridView and modify its GridViewToggleButton ControlTemplate.

    2) I can suggest having a look at this helpful blog post, explaining how to bind to the IsExpandable property of GridViewRow through an attached behavior.

    3) I believe the suggestion from the last step should also be applicable here.

    4) If you decide to use a RadGridView in your RowDetails template, I can offer the following approach, for setting it's left margin:

    public MainWindow()
    {
        InitializeComponent();
        this.clubsGrid.DataLoading += RadGridView_DataLoading;
    }
     
    private void RadGridView_DataLoading(object sender, GridViewDataLoadingEventArgs e)
    {
        GridViewDataControl dataControl = (GridViewDataControl)sender;
        if (dataControl.ParentRow != null)
        {
            dataControl.ShowGroupPanel = false;
            dataControl.AutoGenerateColumns = false;
     
            dataControl.Margin = new Thickness(this.clubsGrid.Columns[0].ActualWidth, 0, 0, 0);
        }
    }

    I hope you find this information helpful.

    Regards,
    Dilyan Traykov
    Telerik
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
  7. Mikel
    Mikel avatar
    21 posts
    Member since:
    Feb 2014

    Posted 19 Apr in reply to Dilyan Traykov Link to this post

    Thank you so much!

    I have accomplished the first goal. I will try others...    :)

  8. Dilyan Traykov
    Admin
    Dilyan Traykov avatar
    371 posts

    Posted 21 Apr Link to this post

    Hello Mikel,

    I'm glad to hear you're making progress. I hope you manage to accomplish your other goals as well.

    Regards,
    Dilyan Traykov
    Telerik
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
Back to Top
UI for WPF is Visual Studio 2017 Ready