Silverlight 4: Need help with Iteration - silverlight-4.0

Question

I'm having trouble with thinking of a solution that I'm trying to build, maybe someone here is able to guide me to the right direction.
I have a list of processes that belong to a processflow, these processes might have childs, and these childs might also have childs and so on.
The list looks like this:
ProcID ChildOFID
1 0 (means no child)
2 1
3 2
4 3
5 3
6 5
As you can see Proc "3" contains 2 childs, of which one (5) also has a child (6).
I want to iterate over this list and draw objects for them on a canvas.
Right now I have the following code but it requires me to write up a loop for every level that I want to show.
int prev_location_left = 0;
int prev_location_top = 0;
// Select Last ProcessStep (has no PreID!)
var lastProcess = (from p in processlist
where p.PreID == 0
select p).FirstOrDefault<ProcessStep>();
if (lastProcess != null)
{
create_processStep(lastProcess.ProcessID,
lastProcess.Name,
lastProcess.ProcessTypeID,
(900),
(30),
lastProcess.CummulativeCT,
lastProcess.WaitingTimeActual,
lastProcess.ValueAddTimeActual,
lastProcess.ProcessStepTime);
prev_location_left = 900;
prev_location_top = 30;
}
// Select all the ProcessSteps that are a child of the last(first) one.
var listChilds = (from p in processlist
where p.PreID == lastProcess.ProcessID
select p);
int childscount = listChilds.Count();
int cnt = 0;
foreach (ProcessStep ps in listChilds)
{
create_processStep(ps.ProcessID,
ps.Name,
ps.ProcessTypeID,
(prev_location_left - (150) ),
(30 + (60 *cnt)),
ps.CummulativeCT,
ps.WaitingTimeActual,
ps.ValueAddTimeActual,
ps.ProcessStepTime);
var listChilds2 = (from p in processlist
where p.PreID == ps.ProcessID
select p);
int cnt2 = 0;
foreach (ProcessStep ps2 in listChilds2)
{
create_processStep(ps2.ProcessID,
ps2.Name,
ps2.ProcessTypeID,
(prev_location_left - (300) ),
(30 + (60 *cnt2)),
ps2.CummulativeCT,
ps2.WaitingTimeActual,
ps2.ValueAddTimeActual,
ps2.ProcessStepTime);
var listChilds3 = (from p in processlist
where p.PreID == ps2.ProcessID
select p);
int cnt3 = 0;
foreach (ProcessStep ps3 in listChilds3)
{
create_processStep(ps3.ProcessID,
ps3.Name,
ps3.ProcessTypeID,
(prev_location_left - (450)),
(30 + (60 * cnt2)),
ps3.CummulativeCT,
ps3.WaitingTimeActual,
ps3.ValueAddTimeActual,
ps3.ProcessStepTime);
cnt3 = cnt3 + 1;
}
cnt2 = cnt2 + 1;
}
cnt = cnt + 1;
}
So what needs to be done is the following:
Get last process (the one with PreId == 0)
Check what his childs are and draw them on canvas: Left -150, first child on Top 30, Second on Top 90, Third on Top 150 and so on.
Now for every child found I also need to check if they have childs and do the same logic again, i'm having trouble making this a sort-endless loop.
Help! :)

Answer 1

You could create a recursive parent/child object and bind to it with your view. Below is a very basic example using the data that you've provided.
MainPage.xaml
<UserControl x:Class="SilverlightApplication4.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
xmlns:local="clr-namespace:SilverlightApplication4"
d:DesignHeight="300" d:DesignWidth="400">
<UserControl.DataContext>
<local:MainPage_ViewModel/>
</UserControl.DataContext>
<Canvas>
<local:RecursiveView DataContext="{Binding RecursiveObject}"/>
</Canvas>
MainPage_ViewModel.cs
public class MainPage_ViewModel
{
public MainPage_ViewModel()
{
List<KeyValuePair<int, int>> collection = new List<KeyValuePair<int, int>>()
{
new KeyValuePair<int,int>(1,0),
new KeyValuePair<int,int>(2,1),
new KeyValuePair<int,int>(3,2),
new KeyValuePair<int,int>(4,3),
new KeyValuePair<int,int>(5,3),
new KeyValuePair<int,int>(6,5)
};
KeyValuePair<int, int> parent = collection.Where(kvp => kvp.Value == 0).First();
collection.Remove(parent);
RecursiveObject recursiveObject = new RecursiveObject()
{
root = parent.Key
};
populateChildren(recursiveObject, collection);
this.RecursiveObject = recursiveObject;
}
public RecursiveObject RecursiveObject
{
get { return recursiveObject; }
set { recursiveObject = value; }
}
private RecursiveObject recursiveObject;
private void populateChildren(RecursiveObject parent, List<KeyValuePair<int, int>> list)
{
List<KeyValuePair<int, int>> children = list.Where(kvp => kvp.Value == parent.root).ToList();
children.ForEach(child => list.Remove(child));
children.ForEach(child =>
{
RecursiveObject newChild = new RecursiveObject() { root = child.Key };
parent.Children.Add(newChild);
populateChildren(newChild, list);
});
}
}
RecursiveObject.cs
public class RecursiveObject
{
public int root { get; set; }
public List<RecursiveObject> Children
{
get { return children; }
set { children = value; }
}
private List<RecursiveObject> children = new List<RecursiveObject>();
}
RecursiveView.xaml
<UserControl x:Class="SilverlightApplication4.RecursiveView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
xmlns:local="clr-namespace:SilverlightApplication4"
d:DesignHeight="300" d:DesignWidth="400">
<StackPanel Margin="30,0,0,0">
<TextBlock Text="{Binding root}"/>
<ItemsControl ItemsSource="{Binding Children}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<local:RecursiveView DataContext="{Binding}"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</StackPanel>
Image of output:
I just placed a margin of '30' on the left of each child, but you could adjust it to be whatever you'd like. Not sure if this helps, I just thought it was a fun challenge to try :)