This is a migrated thread and some comments may be shown as answers.

How to represent Model with TreeListView

6 Answers 25 Views
TreeListView
This is a migrated thread and some comments may be shown as answers.
Mikel
Top achievements
Rank 1
Mikel asked on 05 Apr 2016, 11:31 AM

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

 

 

 

 

 

6 Answers, 1 is accepted

Sort by
0
Mikel
Top achievements
Rank 1
answered on 05 Apr 2016, 11:35 AM

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!

 

0
Dilyan Traykov
Telerik team
answered on 08 Apr 2016, 10:50 AM
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.
0
Mikel
Top achievements
Rank 1
answered on 14 Apr 2016, 10:41 AM

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!

0
Dilyan Traykov
Telerik team
answered on 18 Apr 2016, 02:16 PM
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.
0
Mikel
Top achievements
Rank 1
answered on 19 Apr 2016, 07:00 AM

Thank you so much!

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

0
Dilyan Traykov
Telerik team
answered on 21 Apr 2016, 07:51 AM
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.
Tags
TreeListView
Asked by
Mikel
Top achievements
Rank 1
Answers by
Mikel
Top achievements
Rank 1
Dilyan Traykov
Telerik team
Share this question
or