I have a JSON, like the image below:
I have a ComboBox inside a ListView. I want to display "pairs" in the ComboBox.
XAML:
<ListView Name="ListPairOption">
<ListView.ItemTemplate>
<DataTemplate x:DataType="data:PairClass">
<StackPanel
x:Name="pilganStack">
<WebView
x:Name="option"
local:MyProperties.HtmlString="{Binding Name}"/>
</StackPanel>
<ComboBox
x:Name="pairOption"
DisplayMemberPath="NameA"
SelectedValue="{Binding ComboBoxClass, Mode=TwoWay}"
ItemsSource="{x:Bind PilihanS}"
PlaceholderText="Pilih" />
</ListView
Codes:
try
{
JsonObject jsonObject = JsonObject.Parse(jsonText);
JsonObject questionObject = jsonObject["EXAM_QUESTION"].GetObject();
ObservableCollection<PairClass> itemL = new ObservableCollection<PairClass>();
JsonArray mapArray = questionObject["map"].GetArray();
foreach (JsonValue mapValue in mapArray)
{
JsonArray mapArrayI = mapValue.GetArray();
PairClass pair = new PairClass();
foreach (JsonValue mapValueI in mapArrayI)
{
try
{
string v = mapValueI.ToString();
pair.Name = v;
}
}
}
itemL.Add(pair);
}
JsonArray pairArray = questionObject["pairs"].GetArray();
string pairString = "";
foreach (JsonValue pairValue in pairArray)
{
JsonArray pairArrayI = pairValue.GetArray();
List<ComboBoxClass> PilihanS = new List<ComboBoxClass>();
foreach (JsonValue pairValueI in pairArrayI)
{
try
{
var collection = Regex.Matches(v, "\\\"(.*?)\\\"");
foreach (var item in collection)
{
string v3 = item.ToString().Trim('"');
pairString = v3;
}
}
}
PilihanS.Add(new ComboBoxClass() { NameA = pairString });
}
ListPairOption.ItemsSource = itemL;
}
PairClass:
public class PairClass
{
public string Name { get; set; }
public ObservableCollection<ComboBoxClass> PilihanS { get; set; }
public PairClass(string name)
{
Name = name;
}
}
public class ComboBoxClass
{
public string NameA { get; set; }
public override string ToString()
{
return this.NameA;
}
}
}
From the code above, I didn't succeed in displaying it into a ComboBox in a ListView so that the ComboBox is empty, as shown below:
How to display it into a ComboBox?
From the code above, I didn't succeed in displaying it into a ComboBox in a ListView so that the ComboBox is empty, as shown below:
If you want to access the property that out of DataType, please using Binding ElementName=Control Name then access the the outside property from the parent DataContext. please note you need to set current page DataContext as this this.DataContext = this;. it could make sure you can access PilihanS where in the code behind from DataTemplate.
<ComboBox
x:Name="pairOption"
ItemsSource="{Binding DataContext.PilihanS, ElementName=ListPairOption}"
PlaceholderText="Pilih" />
code behind
public MainPage()
{
this.InitializeComponent();
this.DataContext = this;
}
public List<ComboBoxClass> PilihanS { get; set;} = new List<ComboBoxClass>();
And delete this line where in your code above List<ComboBoxClass> PilihanS = new List<ComboBoxClass>();
Related
XAML:
<ComboBox x:Name="cmb" HorizontalAlignment="Left"
Margin="183,39,0,0"
VerticalAlignment="Top"
Width="120"
ItemsSource="{Binding FilteredNames, Mode=OneWay}"
IsTextSearchEnabled="True"
IsEditable="True"
TextSearch.Text="{Binding Filter, UpdateSourceTrigger=PropertyChanged}"/>
ViewModel:
public List<string> FilteredNames
{
get
{
return (names.FindAll(x => x.Contains(filter))).ToList<string>();
}
}
public string Filter
{
get
{
return this.filter;
}
set
{
this.filter = value;
NotifyPropertyChanged("FilteredNames");
}
}
public ViewModel()
{
this.names = new List<string>() { "Jerry", "Joey", "Roger", "Raymond", "Jessica", "Mario",
"Jonathan" };
this.filter = "";
}
This is what I have implemented. Please help me out how to get filtered dropdown in combobox.
Like when I input "j", I want to get all the items containing "j" in it.
You should bind string input to ComboBox's Text property:
Text="{Binding Filter, UpdateSourceTrigger=PropertyChanged}"
Also I would suggest using CollectionView for filtering like this:
public ICollectionView FilteredNames { get; set; }
IList<string> names = new List<string>() { "Jerry", "Joey", "Roger", "Raymond", "Jessica", "Mario", "Jonathan" };
public VM()
{
FilteredNames = CollectionViewSource.GetDefaultView(names);
FilteredNames.Filter = (obj) =>
{
if (!(obj is string str))
return false;
return str.Contains(filter);
};
}
string filter = "";
public string Filter
{
get
{
return this.filter;
}
set
{
this.filter = value;
FilteredNames?.Refresh();
}
}
In my current WPF application, it's required to generate columns of a DataGrid dynamically in my ViewModel. For that I have used the approach with System.Windows.Interactivity and behaviors.
Therefore I created ColumnsBehavior exactly like in this post:
Is it possible to get dynamic columns on wpf datagrid in mvvm pattern?
Everything worked fine, when I initialized the bounded list and generated the columns with the bindings.
When I switched to ListBox to show a DataGrid in every ListBoxItem, everything worked great again.
Now I want to add the information (model) to the bounded list at run time.
When a ListBoxItem is selected, the corresponding DataGrid should be displayed. With a Button above the DataGrid I can pass sample data to the bounded list objects. When I hit the Button, the right amount of columns with the right headers are generated, but the rows only appears the next time, in which the ListBoxItem is visible again. This means the data is appearing as recently as I refresh the grid.
To bind the Botton Command property to the ViewModel I used the ActionCommand implementation:
RelayCommand
I am using the MVVM pattern.
This is my ViewModel:
public class ViewModel
{
public ViewModel()
{
ListItems = new ObservableCollection<ListItemModel>();
ListItems.Add(new ListItemModel()
{
IsSelected = true
});
ListItems.Add(new ListItemModel()
{
IsSelected = false
});
FillCommand = new RelayCommand(FillAction);
}
public ObservableCollection<ListItemModel> ListItems { get; set; }
public ListItemModel SelectedListItem { get; set; }
public ICommand FillCommand { get; set; }
public void FillAction(object sender)
{
SelectedListItem.Entries = new ObservableCollection<Entry>()
{
new Entry()
{
Cells = new ObservableCollection<Cell>()
{
new Cell() { Cond1 = 11, Value = 99 },
new Cell() { Cond1 = 22, Value = 99 },
new Cell() { Cond1 = 33, Value = 99 }
}
},
new Entry()
{
Cells = new ObservableCollection<Cell>()
{
new Cell() { Cond1 = 11, Value = 99 },
new Cell() { Cond1 = 22, Value = 99 },
new Cell() { Cond1 = 33, Value = 99 }
},
},
new Entry()
{
Cells = new ObservableCollection<Cell>()
{
new Cell() { Cond1 = 11, Value = 99 },
new Cell() { Cond1 = 22, Value = 99 },
new Cell() { Cond1 = 33, Value = 99 }
},
}
};
SelectedListItem.GenerateGrid();
}
}
The property for holding the columns is in the ListItemModel.
The object structure behind the ItemsSource of the DataGrid and the columns property you can see in the next code:
public class ListItemModel
{
public ListItemModel()
{
Entries = new ObservableCollection<Entry>();
DataColumns = new ObservableCollection<DataGridColumn>();
}
public ObservableCollection<Entry> Entries { get; set; }
public ObservableCollection<DataGridColumn> DataColumns { get; set; }
public bool IsSelected { get; set; }
public void GenerateGrid()
{
if (Entries.Count != 0)
{
var columns = Entries[0]?.Cells;
for (int i = 0; i < columns.Count; i++)
{
Binding b = new Binding(string.Format("Cells[{0}].Value", i));
DataGridTextColumn text = new DataGridTextColumn();
text.Header = columns[i].Cond1.ToString();
text.Binding = b;
DataColumns.Add(text);
}
}
}
}
public class Entry
{
public ObservableCollection<Cell> Cells { get; set; }
public Entry() { Cells = new ObservableCollection<Cell>(); }
}
public class Cell
{
public Cell() { }
public int Cond1 { get; set; }
public int Value { get; set; }
}
}
For the view you need the namespace:
http://schemas.microsoft.com/expression/2010/interactivity
The following code sample shows the view.
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<ListBox ItemsSource="{Binding ListItems}" SelectedItem="{Binding SelectedListItem}">
<ListBox.Resources>
<Style TargetType="{x:Type ListBoxItem}">
<Setter Property="IsSelected" Value="{Binding IsSelected, Mode=TwoWay}" />
</Style>
</ListBox.Resources>
</ListBox>
<DockPanel Grid.Column="1">
<Button DockPanel.Dock="Top" Command="{Binding FillCommand}">Fill Data</Button>
<DataGrid x:Name="ToleranceGrid" ColumnWidth="*" ItemsSource="{Binding Path=SelectedListItem.Entries}"
CanUserAddRows="False" SelectionMode="Single" SelectionUnit="Cell" AutoGenerateColumns="False" local:ColumnsBindingBehaviour.BindableColumns="{Binding Path=SelectedListItem.DataColumns}">
</DataGrid>
</DockPanel>
</Grid>
The ViewModel is set to the DataContext of the view in code behind.
The result should look like this:
WPF Application
The first ListItemModel is selected and I pressed the Button above the DataGrid. As you can see, the columns were generated, but the rows aren't displayed. I debugged the code, an everything is correctly set in my ViewModel. When I would select the second ListItemModel and would go back to the first one, the content will be shown correctly.
Do you have any ideas?
Your ListItemModel should implement the INotifyPropertyChanged interface and raise the PropertyChanged event when the Entries property is set to a new collection:
public class ListItemModel : INotifyPropertyChanged
{
public ListItemModel()
{
Entries = new ObservableCollection<Entry>();
DataColumns = new ObservableCollection<DataGridColumn>();
}
private ObservableCollection<Entry> _entries;
public ObservableCollection<Entry> Entries
{
get { return _entries; }
set { _entries = value; NotifyPropertyChanged(); }
}
public ObservableCollection<DataGridColumn> DataColumns { get; set; }
public bool IsSelected { get; set; }
public void GenerateGrid()
{
if (Entries.Count != 0)
{
var columns = Entries[0]?.Cells;
for (int i = 0; i < columns.Count; i++)
{
Binding b = new Binding(string.Format("Cells[{0}].Value", i));
DataGridTextColumn text = new DataGridTextColumn();
text.Header = columns[i].Cond1.ToString();
text.Binding = b;
DataColumns.Add(text);
}
}
}
public event PropertyChangedEventHandler PropertyChanged;
private void NotifyPropertyChanged([System.Runtime.CompilerServices.CallerMemberName] string propertyName = "")
{
if (PropertyChanged != null)
PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
}
}
I have a collection ConversationModel that have two models in it. I want to get the value of the very first item of the collection. I tried this code var obj = ConversationCollection.First(); to get the value but it always returns null. Here the model's property is populated but outside of it. How can I get those values
public class ConversationModel
{
public SendMessageModel SMM { get; set; }
public ReceivedMessageModel RMM { get; set; }
}
Here's how I create my collection:
ObservableCollection<ConversationModel> cm = new ObservableCollection<ConversationModel>();
foreach (DataRow convo in dataTable.Rows)
{
string _messageID = (string)convo["MessageID"];
string message = (string)convo["UserMessage"];
string username = (string)convo["FromUser"];
DateTime datetime = (DateTime)convo["MessageDateTime"];
string messageStatus = (string)convo["MessageStatus"];
string mdt = "";
if (datetime.Date == DateTime.Now.Date) mdt = datetime.ToString("t");
if (username == ClientUsername)
{
SendMessageModel smm = new SendMessageModel
{
MessageIdentifier = _messageID,
UserDisplayName = ClientDisplayName,
SendMessage = message,
MessageTime = mdt,
MessageStatus = (Status)Enum.Parse(typeof(Status), messageStatus)
};
cm.Add(new ConversationModel { SMModel = smm });
}
else
{
ReceivedMessageModel rmm = new ReceivedMessageModel
{
MessageIdentifier = _messageID,
ClientDisplayName = RecipientDisplayName,
MessageTime = mdt,
ReceivedMessage = message
};
cm.Add(new ConversationModel { RMM = rmm });
}
}
ConversationCollection = cm;
My WPF Code for the ItemsControl
<ItemsControl ItemsSource="{Binding ConversationCollection}">
<ItemsControl.Resources>
<DataTemplate DataType="{x:Type Models:ReceivedMessageModel}">
<UserControls:RecievedMessageBubble/>
</DataTemplate>
<DataTemplate DataType="{x:Type Models:SendMessageModel}">
<UserControls:SendMessageBubble />
</DataTemplate>
</ItemsControl.Resources>
</ItemsControl>
If ConversationCollection is an ObservableCollection<ConversationModel>, it can only contain ConversationModels which is why neither of your data templates will be applied.
If you change its type to for example ObservableCollection<object>, you could add both ReceivedMessageModels and SendMessageModels to it.
You will then be able to retrive the first item by casting:
var receivedMessageModel = ConversationCollection[0] as ReceivedMessageModel;
if (receivedMessageModel != null)
{
//the first item is a ReceivedMessageModel
}
else
{
var sendMessageModel = ConversationCollection[0] as SendMessageModel;
// the first item is A SendMessageModel
}
I have main combobox (Categories) and depended combobox (Subcategories). I want it to display SelectedItems when window opens. All works fine in .Net 4.0, but it doesn't work in .Net 4.5. I have two computeres with these .Net versions.
In .net 4.5. only main combobox displays SelectedItem, depended doesn't. How can I fix it?
I made test project to all of you who're interested, just copy and paste. I have no idea how I can make it smaller, sry. But it is simple, clear code example 100% generates the problem.
XAML:
<Window x:Class="GridTest.TestWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:Converter="clr-namespace:GridTest"
Title="TestWindow"
Height="300"
Width="300">
<Window.Resources>
<Converter:CategoryConverter x:Key="CategoryConverter"/>
</Window.Resources>
<Grid>
<DataGrid Name="_dataGrid"
CanUserAddRows="False"
AutoGenerateColumns="False">
<DataGrid.Columns>
<DataGridTemplateColumn Width="*">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<ComboBox Grid.Column="0"
Name="_categories"
ItemsSource="{Binding Categories}"
DisplayMemberPath="Name"
SelectedItem="{Binding SelectedCategory, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}">
</ComboBox>
<ComboBox Grid.Column="1"
SelectedItem="{Binding SelectedSubcategory, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
DisplayMemberPath="Name">
<ComboBox.ItemsSource>
<MultiBinding Converter="{StaticResource CategoryConverter}">
<Binding Path="Subcategories"/>
<Binding Path="SelectedItem"
ElementName="_categories"/>
</MultiBinding>
</ComboBox.ItemsSource>
</ComboBox>
</Grid>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
</DataGrid.Columns>
</DataGrid>
</Grid>
</Window>
Code:
public class CategoryConverter : IMultiValueConverter
{
public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture)
{
if (values[0] == null) return null;
var subcategories = values[0] as List<Subcategory>;
if (subcategories == null) return null;
var category = values[1] as Category;
if (category == null) return subcategories;
return subcategories.Where(g => g.CategoryId == category.Id);
}
public object[] ConvertBack(object value, Type[] targetTypes, object parameter, CultureInfo culture)
{
throw new NotImplementedException();
}
}
public enum CategoryKinds
{
Car = 0,
Fruit = 1,
}
public class Category
{
public Int32 Id { get; set; }
public String Name { get; set; }
public override Boolean Equals(object obj)
{
var c = obj as Category;
if (c == null) return false;
return Id == c.Id;
}
}
public class Subcategory
{
public Int32 Id { get; set; }
public String Name { get; set; }
public Int32 CategoryId { get; set; }
public override Boolean Equals(object obj)
{
var sc = obj as Subcategory;
if (sc == null) return false;
return Id == sc.Id;
}
}
public class DataGridItem
{
public List<Category> Categories { get; set; }
public Category SelectedCategory { get; set; }
public List<Subcategory> Subcategories { get; set; }
public Subcategory SelectedSubcategory { get; set; }
public DataGridItem()
{
Categories = new List<Category>
{
new Category
{
Id = (Int32)CategoryKinds.Car, Name = "Car"
},
new Category
{
Id = (Int32)CategoryKinds.Fruit, Name = "Fruit"
}
};
Subcategories = new List<Subcategory>
{
new Subcategory
{
Id = 1,
Name = "Volvo",
CategoryId = (Int32) CategoryKinds.Car
},
new Subcategory
{
Id = 2,
Name = "Nissan",
CategoryId = (Int32) CategoryKinds.Car
},
new Subcategory
{
Id = 3,
Name = "Banana",
CategoryId = (Int32)CategoryKinds.Fruit
},
new Subcategory
{
Id = 4,
Name = "Lemon",
CategoryId = (Int32)CategoryKinds.Fruit
},
};
}
}
/// <summary>
/// Interaction logic for TestWindow.xaml
/// </summary>
public partial class TestWindow : Window
{
public List<DataGridItem> GridItems { get; set; }
public TestWindow()
{
InitializeComponent();
DataContext = this;
GridItems = new List<DataGridItem>
{
new DataGridItem
{
SelectedCategory = new Category
{
Id = (Int32)CategoryKinds.Car, Name = "Car"
},
SelectedSubcategory = new Subcategory
{
Id = 2,
Name = "Nissan",
CategoryId = (Int32) CategoryKinds.Car
}
},
new DataGridItem
{
SelectedCategory = new Category
{
Id = (Int32)CategoryKinds.Fruit, Name = "Fruit"
},
SelectedSubcategory = new Subcategory
{
Id = 4,
Name = "Lemon",
CategoryId = (Int32) CategoryKinds.Car
}
}
};
_dataGrid.ItemsSource = GridItems;
}
}
UPDATE
With approach suggested by Ilan and charly_b code will work fine.
GridItems = new List<DataGridItem>
{
new DataGridItem(),
new DataGridItem()
};
GridItems[1].SelectedCategory = GridItems[1].Categories[0];
GridItems[1].SelectedSubcategory = GridItems[1].Subcategories[1];
GridItems[0].SelectedCategory = GridItems[0].Categories[1];
GridItems[0].SelectedSubcategory = GridItems[0].Subcategories[3];
This code will result to:
Fruit - Lemon
Car - Nissan
But I have solution that will work even if you set SelectedItem that don't belong to ItemsSource of Combobox. You can override GetHashCode method like this:
public override int GetHashCode()
{
return Name.GetHashCode();
}
Obviously, in .Net 4.5 some of WPF methods operating with searching SelectedItem in Combobox's ItemsSource have different implementation from .Net 4.0 and now they use GetHashCode method :)
Try the next changes, the best practice is to use the source collection items in order to define the selected item. Firstly it is an architectural error to use a new item to define the selection (in both 4.5 and 4 dot.net versions). And second I advice you to use the mvvm approach (including INotifyPropertyChange implementation) to develop wpf related applications, and then all selection logic have to be moved to ViewModel and separated from the code behind (xaml.cs files).
public MainWindow()
{
InitializeComponent();
DataContext = this;
var f = new DataGridItem();
var firstselectedCategory = f.Categories.FirstOrDefault();
if (firstselectedCategory != null)
{
f.SelectedCategory = firstselectedCategory;
f.SelectedSubcategory =
f.Subcategories.FirstOrDefault(subcategory => subcategory.CategoryId == firstselectedCategory.Id);
}
else
{
f.SelectedCategory = null;
f.SelectedSubcategory = null;
}
var s = new DataGridItem();
var secondSelectedCategory = s.Categories.FirstOrDefault(category => !Equals(category, f.SelectedCategory));
if (secondSelectedCategory != null)
{
s.SelectedCategory = secondSelectedCategory;
s.SelectedSubcategory =
s.Subcategories.FirstOrDefault(subcategory => subcategory.CategoryId == secondSelectedCategory.Id);
}
else
{
s.SelectedCategory = null;
s.SelectedSubcategory = null;
}
GridItems = new List<DataGridItem>
{
f,s,
};
#region
//GridItems = new List<DataGridItem>
//{
// new DataGridItem
// {
// SelectedCategory = new Category
// {
// Id = (Int32) CategoryKinds.Car,
// Name = "Car"
// },
// SelectedSubcategory = new Subcategory
// {
// Id = 2,
// Name = "Nissan",
// CategoryId = (Int32) CategoryKinds.Car
// }
// },
// new DataGridItem
// {
// SelectedCategory = new Category
// {
// Id = (Int32) CategoryKinds.Fruit,
// Name = "Fruit"
// },
// SelectedSubcategory = new Subcategory
// {
// Id = 4,
// Name = "Lemon",
// CategoryId = (Int32) CategoryKinds.Fruit
// }
// }
//};
#endregion
_dataGrid.ItemsSource = GridItems;
}
The xaml code was not changed.
How it looks like:
.
I'll be glad to help if will have problems with the code.
Regards.
The Combobox SelectedItem object must be contained inside the Combobox's ItemsSource List.
In order to make your Programm work you can replace the SelectedSubCategory Property with the following code: (I would not use it like this in the production code, but it demonstrates how it works)
private Subcategory SelectedSubcategoryM;
public Subcategory SelectedSubcategory
{
get
{
return this.SelectedSubcategoryM;
}
set
{
this.SelectedSubcategoryM = (from aTest in this.Subcategories
where aTest.Id == value.Id
select aTest).Single();
}
}
I would like to know how to bind a custom data type to a TreeView.
The data type is basically an arraylist of objects that contain other arraylists. Access would look something like this:
foreach (DeviceGroup dg in system.deviceGroups)
{
foreach (DeviceType dt in dg.deviceTypes)
{
foreach (DeviceInstance di in dt.deviceInstances)
{
}
}
}
I would like the TreeView to look something like this:
DeviceGroup1
--> DeviceType1
--DeviceInstance1
--DeviceInstance2
--> DeviceType2
--DeviceInstance1
DeviceGroup2
--> DeviceType1
--DeviceInstance1
--> DeviceType2
Ok this is where the HierarchicalDataTemplate will save you. The trick is you will need to use two different hierarchical templates, since you have a three-level hierarchy here. I have constructed a simple UserControl to illustrate. First, here is some code-behind creating model data similar to what you have:
public partial class ThreeLevelTreeView : UserControl
{
public ArrayList DeviceGroups { get; private set; }
public ThreeLevelTreeView()
{
DeviceInstance inst1 = new DeviceInstance() { Name = "Instance1" };
DeviceInstance inst2 = new DeviceInstance() { Name = "Instance2" };
DeviceInstance inst3 = new DeviceInstance() { Name = "Instance3" };
DeviceInstance inst4 = new DeviceInstance() { Name = "Instance4" };
DeviceType type1 = new DeviceType() { Name = "Type1", DeviceInstances = new ArrayList() { inst1, inst2 } };
DeviceType type2 = new DeviceType() { Name = "Type2", DeviceInstances = new ArrayList() { inst3 } };
DeviceType type3 = new DeviceType() { Name = "Type3", DeviceInstances = new ArrayList() { inst4 } };
DeviceType type4 = new DeviceType() { Name = "Type4" };
DeviceGroup group1 = new DeviceGroup() { Name = "Group1", DeviceTypes = new ArrayList() { type1, type2 } };
DeviceGroup group2 = new DeviceGroup() { Name = "Group2", DeviceTypes = new ArrayList() { type3, type4 } };
DeviceGroups = new ArrayList() { group1, group2 };
InitializeComponent();
}
}
public class DeviceGroup
{
public string Name { get; set; }
public ArrayList DeviceTypes { get; set; }
}
public class DeviceType
{
public string Name { get; set; }
public ArrayList DeviceInstances { get; set; }
}
public class DeviceInstance
{
public string Name { get; set; }
}
Nothing difficult here, but note that you should use ObservableCollection instead of ArrayList if you want to add and remove from your collections dynamically. Now let's look at the XAML for this control:
<UserControl x:Class="TestWpfApplication.ThreeLevelTreeView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:TestWpfApplication"
DataContext="{Binding RelativeSource={RelativeSource Self}}">
<TreeView ItemsSource="{Binding DeviceGroups}">
<TreeView.ItemTemplate>
<HierarchicalDataTemplate ItemsSource="{Binding DeviceTypes}">
<HierarchicalDataTemplate.ItemTemplate>
<HierarchicalDataTemplate ItemsSource="{Binding DeviceInstances}">
<TextBlock Text="{Binding Name}"/>
</HierarchicalDataTemplate>
</HierarchicalDataTemplate.ItemTemplate>
<TextBlock Text="{Binding Name}"/>
</HierarchicalDataTemplate>
</TreeView.ItemTemplate>
</TreeView>
And here is the result:
alt text http://img684.imageshack.us/img684/6281/threeleveltreeview.png
I lately had to deal with a similar issue and after much research was able to get to a good generic solution. My problem was a bit more generic: Visualize a .NET object's properties in a tree view.
So given this class
```
class Person
{
public string FirstName { get; set; }
public string LastName { get; set; }
public List<Person> Children { get; set; }
}
I should see a tree like for an example instance:
- root
- FirstName: John
- LastName: Smith
- Children:
- [0]
- FirstName: Ann
- LastName: Smith
```
It's rather difficult to use reflection and go over an object's properties and such. Luckily, we already have a library that does that - Newtonsoft.Json.
My trick is to serialize the object with Newtonsoft.Json, then deserialize with System.Web.Script.Serialization.JavaScriptSerializer.
JavaScriptSerializer returns ArrayLists and Dictionaries, which are pretty simple to go over and add to the tree.
Thanks to this article which gave me some of the concept ideas.
Anyway, here's the entire code:
In XAML:
<TreeView ItemsSource="{Binding TreeItemsSource}">
<TreeView.Resources>
<HierarchicalDataTemplate DataType="{x:Type local:TreeNode}" ItemsSource="{Binding Path=Children}">
<TreeViewItem>
<TreeViewItem.Header>
<StackPanel Orientation="Horizontal" Margin="-10,0,0,0">
<TextBlock Text="{Binding Path=Name}"/>
<TextBlock Text=" : "/>
<TextBox Text="{Binding Path=Value}" IsReadOnly="True"/>
</StackPanel>
</TreeViewItem.Header>
</TreeViewItem>
</HierarchicalDataTemplate>
</TreeView.Resources>
</TreeView>
In ViewModel:
public IEnumerable<TreeNode> TreeItemsSource
{
get
{
TreeNode tree = TreeNode.CreateTree(SelectedSession);
return new List<TreeNode>() { tree };
}
}
And the TreeNode class
public class TreeNode
{
public string Name { get; set; }
public string Value { get; set; }
public List<TreeNode> Children { get; set; } = new List<TreeNode>();
public static TreeNode CreateTree(object obj)
{
JavaScriptSerializer jss = new JavaScriptSerializer();
var serialized = Newtonsoft.Json.JsonConvert.SerializeObject(obj);
Dictionary<string, object> dic = jss.Deserialize<Dictionary<string, object>>(serialized);
var root = new TreeNode();
root.Name = "session";
BuildTree2(dic, root);
return root;
}
private static void BuildTree2(object item, TreeNode node)
{
if (item is KeyValuePair<string, object>)
{
KeyValuePair<string, object> kv = (KeyValuePair<string, object>)item;
TreeNode keyValueNode = new TreeNode();
keyValueNode.Name = kv.Key;
keyValueNode.Value = GetValueAsString(kv.Value);
node.Children.Add(keyValueNode);
BuildTree2(kv.Value, keyValueNode);
}
else if (item is ArrayList)
{
ArrayList list = (ArrayList)item;
int index = 0;
foreach (object value in list)
{
TreeNode arrayItem = new TreeNode();
arrayItem.Name = $"[{index}]";
arrayItem.Value = "";
node.Children.Add(arrayItem);
BuildTree2(value, arrayItem);
index++;
}
}
else if (item is Dictionary<string, object>)
{
Dictionary<string, object> dictionary = (Dictionary<string, object>)item;
foreach (KeyValuePair<string, object> d in dictionary)
{
BuildTree2(d, node);
}
}
}
private static string GetValueAsString(object value)
{
if (value == null)
return "null";
var type = value.GetType();
if (type.IsArray)
{
return "[]";
}
if (value is ArrayList)
{
var arr = value as ArrayList;
return $"[{arr.Count}]";
}
if (type.IsGenericType)
{
return "{}";
}
return value.ToString();
}
}