I'm ready for the abuse. I can't figure out why this isn't working.
Here's the relevant XAML:
<Window.Resources>
<XmlDataProvider x:Key="Family" Source="TestArmy1.xml" XPath="/Army"/>
</Window.Resources>
// Snip
<TreeView Name="OOB" Height="880" Background="#00000000"
BorderBrush="#00000000" Padding="100,1,1,50" UseLayoutRounding="False"
MouseRightButtonDown="TreeViewPreviewRightButtonDown" DataContext="{StaticResource Family}" ItemsSource="{Binding XPath=Commander}" FontSize="12" />
Here's the C# code:
//This is for dynamically building a treeview with templates from an XML file
XmlTextReader xmlReader1 = new XmlTextReader("HierarchicalDataTemplate1.xml");
HierarchicalDataTemplate hierarchicalDataTemplate1 = XamlReader.Load(xmlReader1) as HierarchicalDataTemplate;
XmlTextReader xmlReader2 = new XmlTextReader("HierarchicalDataTemplate2.xml");
HierarchicalDataTemplate hierarchicalDataTemplate2 = XamlReader.Load(xmlReader2) as HierarchicalDataTemplate;
hierarchicalDataTemplate1.ItemTemplate = hierarchicalDataTemplate2;
XmlTextReader xmlReader3 = new XmlTextReader("HierarchicalDataTemplate3.xml");
HierarchicalDataTemplate hierarchicalDataTemplate3 = XamlReader.Load(xmlReader3) as HierarchicalDataTemplate;
hierarchicalDataTemplate2.ItemTemplate = hierarchicalDataTemplate3;
OOB.ItemTemplate = hierarchicalDataTemplate1;
Thread updateThread = new Thread(new ParameterizedThreadStart(UpdateTree));
updateThread.Start(this);
And the code that builds the TreeView:
private void UpdateTree(object obj)
{
if (File.Exists("TestArmy1.xml") == false)
{
MessageBox.Show("Unable to open\nTestArmy1.xml");
return;
}
MainWindow window = (MainWindow)obj;
window.Dispatcher.Invoke(DispatcherPriority.Send, new Action(RebuildTree));
}
private void RebuildTree()
{
XmlDataProvider provider = new XmlDataProvider();
XmlDocument xmlFile = new XmlDocument();
xmlFile.Load("TestArmy1.xml");
provider.Document = xmlFile;
provider.XPath = "/Army";
OOB.DataContext = provider;
XmlNode node = xmlFile.DocumentElement.SelectSingleNode("ArmyName");
ArmyNameString = node.InnerText;
ArmyNameTitle.Content = ArmyNameString;
}
This is the (now stripped down) XML file, TestArmy1.xml, that is loaded:
<?xml version="1.0" encoding="UTF-8"?>
<Army>
<ArmyName>The Army of Northern Virginia</ArmyName>
<Commander>
<CommanderName>The Emperor With the Very Long Name!</CommanderName>
<CommanderLeadership>94</CommanderLeadership>
<Division>
<DivisionCommanderName>Major General William T. Sherman</DivisionCommanderName>
<DivisionCommanderLeadership>78</DivisionCommanderLeadership>
<Unit>
<UnitName>'Chasseurs à Cheval Garde"</UnitName>
<UnitType>Cavalry</UnitType>
<UnitKStrength>3</UnitKStrength>
<UnitStrength>456</UnitStrength>
<UnitQuality>10</UnitQuality>
<UnitMorale>7</UnitMorale>
<UnitLeadership>7</UnitLeadership>
<UnitAmmunition>99</UnitAmmunition>
</Unit>
</Division>
<Division>
<DivisionCommanderName>Marshal Ney</DivisionCommanderName>
<DivisionCommanderLeadership>8</DivisionCommanderLeadership>
</Division>
</Commander>
</Army>
Here's HierarchicalDataTemplate1:
<HierarchicalDataTemplate
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
ItemsSource="{Binding XPath=Commander}"
>
<Grid Height="62" Width="auto">
<Grid Height="61" HorizontalAlignment="Left" Margin="0,0,0,0" Name="grid1" VerticalAlignment="Top" Width="auto">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="auto" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="25" />
<RowDefinition Height="30" />
</Grid.RowDefinitions>
<Image Source= "HeadQuarters.png" Grid.Column="1" Grid.RowSpan="2" HorizontalAlignment="Center" Stretch="None" OpacityMask="White"></Image>
<Label Content="{Binding XPath=CommanderName}" Height="54" HorizontalAlignment="Left" Name="label1" VerticalAlignment="Top" FontFamily="K22 Monastic" FontSize="36" Margin="2,4,0,6" Grid.RowSpan="2" Grid.Column="2" />
<Label Content="Leadership:" HorizontalAlignment="Left" Margin="5,0,0,0" VerticalAlignment="Bottom" Grid.Column="3" />
<ProgressBar HorizontalAlignment="Left" Height="20" Name="CommanderLeadershipProgressBar" VerticalAlignment="Top" Width="150" Grid.Column="3" Grid.Row="2" Margin="10,0,0,0" Minimum="1" Maximum="100" Value="{Binding XPath=CommanderLeadership}" />
<TextBlock Text="{Binding ElementName=CommanderLeadershipProgressBar, Path=Value, StringFormat={}{0:0}%}" HorizontalAlignment="Center" VerticalAlignment="Top" Grid.Column="3" Grid.Row="2" />
<Button Content="Create Subordinate Unit" Height="35" Width="auto" HorizontalAlignment="Left" Margin="10,0,50,0" Name="button1" VerticalAlignment="Center" Grid.Column="4" Grid.RowSpan="2" />
</Grid>
</Grid>
And here is HierarchialDataTemplate2:
<HierarchicalDataTemplate
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
ItemsSource="{Binding XPath=Commander}"
>
<Grid Height="62" Width="auto">
<Grid Height="61" HorizontalAlignment="Left" Margin="0,0,0,0" Name="grid1" VerticalAlignment="Top" Width="auto">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="auto" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="25" />
<RowDefinition Height="30" />
</Grid.RowDefinitions>
<Image Source= "HeadQuarters.png" Grid.Column="1" Grid.RowSpan="2" HorizontalAlignment="Center" Stretch="None" OpacityMask="White"></Image>
<Label Content="{Binding XPath=CommanderName}" Height="54" HorizontalAlignment="Left" Name="label1" VerticalAlignment="Top" FontFamily="K22 Monastic" FontSize="36" Margin="2,4,0,6" Grid.RowSpan="2" Grid.Column="2" />
<Label Content="Leadership:" HorizontalAlignment="Left" Margin="5,0,0,0" VerticalAlignment="Bottom" Grid.Column="3" />
<ProgressBar HorizontalAlignment="Left" Height="20" Name="CommanderLeadershipProgressBar" VerticalAlignment="Top" Width="150" Grid.Column="3" Grid.Row="2" Margin="10,0,0,0" Minimum="1" Maximum="100" Value="{Binding XPath=CommanderLeadership}" />
<TextBlock Text="{Binding ElementName=CommanderLeadershipProgressBar, Path=Value, StringFormat={}{0:0}%}" HorizontalAlignment="Center" VerticalAlignment="Top" Grid.Column="3" Grid.Row="2" />
<Button Content="Create Subordinate Unit" Height="35" Width="auto" HorizontalAlignment="Left" Margin="10,0,50,0" Name="button1" VerticalAlignment="Center" Grid.Column="4" Grid.RowSpan="2" />
</Grid>
</Grid>
And here is HierarchicalDataTemplate3:
<HierarchicalDataTemplate
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
ItemsSource="{Binding XPath=Unit}"
>
<Grid Height="62" Width="auto">
<Grid Height="61" HorizontalAlignment="Left" Margin="0,0,0,0" Name="grid1" VerticalAlignment="Top" Width="auto">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="auto" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="25" />
<RowDefinition Height="30" />
</Grid.RowDefinitions>
<Label Content="{Binding XPath=UnitName}" Height="54" HorizontalAlignment="Left" Name="label4" VerticalAlignment="Top" FontFamily="K22 Monastic" FontSize="36" Margin="2,4,0,6" Grid.RowSpan="2" Grid.Column="2" />
</Grid>
</Grid>
And this is the (new) output:
Which is fine as far as it goes (if anybody is interested, I'm building what's called an Order of Battle Table for a wargame). But it doesn't continue building the entire TreeView. I think it's just reading the first node and stopping.
What am I missing? Thanks for the help. Feel free to beat me up.
If I understand your problem and question right, it is that the sub nodes to Commander which could be Division do not render?
In that case you should set the ItemsSource of the HierarchicalDataSource to "Division" instead of Commander:
<HierarchicalDataTemplate xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" ItemsSource="{Binding XPath=Division}">
You could then include a Data template for the Division node inline as shown below or define it elsewhere:
<HierarchicalDataTemplate.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding XPath=DivisionCommanderName}" />
</DataTemplate>
</HierarchicalDataTemplate.ItemTemplate>
This template could be a HierarchicalDataTemplate it self, if you have more subnodes.
Edit:
In the C#-code there may be a misunderstanding in the hierarchy of templates:
//This is for dynamically building a treeview with templates from an XML file
XmlTextReader xmlReader1 = new XmlTextReader(#"E:\Temp\HierarchicalDataTemplate1.xml");
HierarchicalDataTemplate hierarchicalDataTemplate1 = XamlReader.Load(xmlReader1) as HierarchicalDataTemplate;
XmlTextReader xmlReader2 = new XmlTextReader("HierarchicalDataTemplate2.xml");
HierarchicalDataTemplate hierarchicalDataTemplate2 = XamlReader.Load(xmlReader2) as HierarchicalDataTemplate;
// Original: hierarchicalDataTemplate2.ItemTemplate = hierarchicalDataTemplate2;
hierarchicalDataTemplate1.ItemTemplate = hierarchicalDataTemplate2;
XmlTextReader xmlReader3 = new XmlTextReader("HierarchicalDataTemplate3.xml");
HierarchicalDataTemplate hierarchicalDataTemplate3 = XamlReader.Load(xmlReader3) as HierarchicalDataTemplate;
// Oridignal: hierarchicalDataTemplate3.ItemTemplate = hierarchicalDataTemplate3;
hierarchicalDataTemplate2.ItemTemplate = hierarchicalDataTemplate3;
And further: the templates must reflect the nodes of their corresponding level.
Related
I need to add Tabs which contain Grid. Grid contains TextBoxes and Labels with alredy defined style. How can I programmatically generate XAML code (Tabs with already present elements)? Can I do this or I need to create each element, set it style and add to the TabItem? Here's a part of the code:
<TabItem Header="tabItem1" Name="tabItem1">
<Grid Name="grid1" HorizontalAlignment="Stretch" VerticalAlignment="Top" DataContext="{Binding ElementName=tabControl1, Path=ActualWidth}" MinWidth="768" MinHeight="446">
<Grid.RowDefinitions>
<RowDefinition MinHeight="43" Height="*" />
<RowDefinition Height="*" MinHeight="45" />
<RowDefinition Height="*" MinHeight="435" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" MinWidth="100" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<TextBox Grid.Column="1" Height="27" Name="textBox1" VerticalAlignment="Top" Margin="11,6,0,0" HorizontalAlignment="Stretch" Width="Auto" FontSize="14" HorizontalContentAlignment="Stretch" MinWidth="141" FlowDirection="LeftToRight" />
<Label Content="Supplier" Height="27" Name="label2" VerticalAlignment="Top" FontSize="14" FontFamily="Tahoma" FontWeight="Bold" Margin="21,6,0,0" Width="Auto" IsEnabled="True" HorizontalAlignment="Stretch" Foreground="Black" Background="White" MinWidth="133" HorizontalContentAlignment="Stretch" />
<TextBox Grid.Column="1" Grid.Row="1" FontSize="14" Height="27" HorizontalAlignment="Stretch" Margin="11,6,0,0" Name="textBox11" VerticalAlignment="Top" Width="Auto" MinWidth="141" />
<Label Grid.Row="1" Content="Supplier Bank" FontFamily="Tahoma" FontSize="14" FontWeight="Bold" Height="27" Margin="21,6,0,0" Name="label3" VerticalAlignment="Top" Width="Auto" Background="White" MinWidth="133" />
<TextBox Grid.Column="1" Grid.Row="2" FontSize="14" Height="27" HorizontalAlignment="Stretch" Margin="11,6,0,0" Name="textBox12" VerticalAlignment="Top" Width="Auto" MinWidth="141" />
<Label Grid.Row="2" Content="Account Number" FontFamily="Tahoma" FontSize="14" FontWeight="Bold" Height="27" Margin="21,6,0,0" Name="label4" VerticalAlignment="Top" Background="White" MinWidth="133" />
<TextBox Grid.Column="4" FontSize="14" Height="27" Margin="11,6,20,0" Name="textBox2" VerticalAlignment="Top" HorizontalAlignment="Stretch" Width="Auto" DataContext="{Binding ElementName=grid1, Path=ActualWidth}" MinWidth="141" />
<Label Grid.Column="3" Content="Buyer" FontFamily="Tahoma" FontSize="14" FontWeight="Bold" Height="27" Margin="21,6,0,0" Name="label5" VerticalAlignment="Top" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" Background="White" MinWidth="133" />
<TextBox Grid.Column="4" Grid.Row="1" FontSize="14" Height="27" HorizontalAlignment="Stretch" Margin="11,6,20,0" Name="textBox3" VerticalAlignment="Top" Width="Auto" MinWidth="141" />
<Label Grid.Column="3" Grid.Row="1" Content="Buyer Bank" FontFamily="Tahoma" FontSize="14" FontWeight="Bold" Height="27" Margin="21,6,0,0" Name="label6" VerticalAlignment="Top" Width="Auto" HorizontalAlignment="Stretch" Background="White" MinWidth="133" />
<TextBox Grid.Column="4" Grid.Row="2" FontSize="14" Height="27" HorizontalAlignment="Stretch" Margin="11,6,20,0" Name="textBox4" VerticalAlignment="Top" Width="Auto" MinWidth="141" />
<Label Grid.Column="3" Grid.Row="2" Content="Account Number" FontFamily="Tahoma" FontSize="14" FontWeight="Bold" Height="27" Margin="21,6,0,0" Name="label7" VerticalAlignment="Top" Width="Auto" HorizontalAlignment="Stretch" Background="White" MinWidth="133" />
</Grid>
</TabItem>
Bind your TabControl.ItemsSource property to an ObservableCollection<SomeViewModel> and then use DataTemplates to define what each ViewModel will look like.
More details in this answer.
Do you NEED to do it programmatically?
It'd be better to have a collection of some class that could contain the information of each TabItem, bind the TabControl to that collection and set an ItemTemplate so every item shows up the same way.
For instance, you could have a class like this:
public class BankMovement
{
public string Supplier { get; set; }
public string SupplierBank { get; set; }
// ... etc.
}
And in your viewmodel or code-behind, create a collection of that type.
public ObservableCollection<BankMovement> Movements { get; set; }
Movements = new ObservableCollection<BankMovement>();
Movements.Add(new BankMovement());
// add as many movements as you want
//tabControl1.ItemsSource = Movements; You can do this through Binding in the XAML, preferably
Finally, in your XAML, bind the TabControl's ItemsSource to that collection, and set an ItemTemplate. Also, in the DataTemplate, bind the TextBoxes to the corresponding property of the BankMovement class:
<TabControl ItemsSource="{Binding Movements}">
<TabControl.ItemTemplate>
<DataTemplate>
<Grid Name="grid1" HorizontalAlignment="Stretch" VerticalAlignment="Top" MinWidth="768" MinHeight="446">
<Grid.RowDefinitions>
<RowDefinition MinHeight="43" Height="*" />
<RowDefinition Height="*" MinHeight="45" />
<RowDefinition Height="*" MinHeight="435" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" MinWidth="100" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<TextBox Text="{Binding Supplier}" Grid.Column="1" Height="27" Name="textBox1" VerticalAlignment="Top" Margin="11,6,0,0" HorizontalAlignment="Stretch" Width="Auto" FontSize="14" HorizontalContentAlignment="Stretch" MinWidth="141" FlowDirection="LeftToRight" />
<Label Content="Supplier" Height="27" Name="label2" VerticalAlignment="Top" FontSize="14" FontFamily="Tahoma" FontWeight="Bold" Margin="21,6,0,0" Width="Auto" IsEnabled="True" HorizontalAlignment="Stretch" Foreground="Black" Background="White" MinWidth="133" HorizontalContentAlignment="Stretch" />
<TextBox Text="{Binding SupplierBank}" Grid.Column="1" Grid.Row="1" FontSize="14" Height="27" HorizontalAlignment="Stretch" Margin="11,6,0,0" Name="textBox11" VerticalAlignment="Top" Width="Auto" MinWidth="141" />
<Label Grid.Row="1" Content="Supplier Bank" FontFamily="Tahoma" FontSize="14" FontWeight="Bold" Height="27" Margin="21,6,0,0" Name="label3" VerticalAlignment="Top" Width="Auto" Background="White" MinWidth="133" />
<!-- etc. -->
</Grid>
</DataTemplate>
</TabControl.ItemTemplate>
</TabControl>
how this type of data grid template can be created??
i can't find any way to make this template.
or can u suggest other way??
i.e. grid view or so and how!
The last column are not required as of now.
CodeBehind:
var pp = from asd in db.OrderMasters
select new
{
asd.CFN,
asd.Location,
asd.CreatedOn,
asd.Quantity
};
dgOrderMaster.ItemsSource = pp.ToList();
Markup:
<DataGrid x:Name="dgOrderMaster" HorizontalContentAlignment="Center" BorderThickness="1" Margin="10" Grid.Row="3">
i worked around, and found listview is way more helpfull for my task,
Here's the markup:
<ListView Name="lvDataBinding" HorizontalContentAlignment="Stretch" BorderThickness="0" Margin="10" Grid.Row="3" Background="{x:Null}">
<ListView.ItemTemplate>
<DataTemplate>
<Border BorderBrush="Black" BorderThickness="0" CornerRadius="3" Margin="0,3" Grid.ColumnSpan="4" Background="White">
<Grid Background="White" Margin="0,1">
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
<ColumnDefinition Width="1.5*"/>
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="60"/>
</Grid.RowDefinitions>
<StackPanel Orientation="Vertical" Margin="50,5" >
<TextBlock Text="Customer" Foreground="#33B6EF" FontSize="20" />
<TextBlock Text="{Binding cust}" FontSize="20" />
</StackPanel>
<StackPanel Orientation="Vertical" Grid.Column="1">
<TextBlock Text="Location" Foreground="#33B6EF" FontSize="20" />
<TextBlock Text="{Binding loc}" FontSize="20" />
</StackPanel>
<StackPanel Orientation="Vertical" Grid.Column="2">
<TextBlock Text="Created On" Foreground="#33B6EF" FontSize="20" />
<TextBlock Text="{Binding con}" FontSize="20" />
</StackPanel>
<StackPanel Orientation="Vertical" Grid.Column="3">
<TextBlock Text="Quantity" Foreground="#33B6EF" FontSize="20" />
<TextBlock Text="{Binding quant}" FontSize="20" />
</StackPanel>
</Grid>
<Border.Effect>
<DropShadowEffect BlurRadius="5" ShadowDepth="5" />
</Border.Effect>
</Border>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
I'm using a ExpanderView to display some data in my app. But I'm having some difficulty trying to find out how to get an ExpanderViewItem's data after it's been selected.
On a ListBox you can call SelectionChanged="yourFunction" in your xaml code.. but for the expanderview I have no idea how to do this?
This is my XAML code for the expander:
<!--Custom header template-->
<DataTemplate x:Key="CustomHeaderTemplate">
<TextBlock Text="" FontSize="28" />
</DataTemplate>
<!--Custom expander template-->
<DataTemplate x:Key="CustomExpanderTemplate">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Rectangle Width="400" Height="60" Fill="#FFF1F1F1" HorizontalAlignment="Stretch" StrokeThickness="0" Grid.Row="0" Grid.Column="0" />
<TextBlock Text="{Binding procedureName}" FontSize="30" Foreground="#FF00457C" FontWeight="Normal" Grid.Row="0" Grid.Column="0" VerticalAlignment="Center" Margin="10,0,0,0" />
</Grid>
</DataTemplate>
<!--Custom expander items template-->
<DataTemplate x:Key="ExpanderViewItems" >
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="15" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Image Source="{Binding flagIcon}" Grid.Row="0" Grid.RowSpan="3" Grid.Column="0" />
<TextBlock FontSize="26" Text="{Binding N}" Foreground="Black" FontWeight="Normal" Grid.Row="0" Grid.Column="1"/>
<TextBlock FontSize="20" Text="{Binding RNG}" Foreground="Black" FontWeight="Normal" HorizontalAlignment="Right" Grid.Row="0" Grid.Column="2"/>
<TextBlock FontSize="26" Text="{Binding ValueAndUnit}" Foreground="Black" FontWeight="Medium" HorizontalAlignment="Right" Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="2"/>
<TextBlock FontSize="18" Text="{Binding COM}" Foreground="Black" FontWeight="Normal" Grid.Row="2" Grid.Column="1" Grid.ColumnSpan="2" TextWrapping="Wrap" />
<Line StrokeThickness="1" Stroke="#C4C6CC" Stretch="Fill" X1="0" X2="1" Y1="0" Y2="0" VerticalAlignment="Center" Grid.Row="3" Grid.Column="0" Grid.ColumnSpan="3" />
</Grid>
</DataTemplate>
<!--Listbox Containing ExpanderViews-->
<ListBox Name="testsList" Grid.Row="3" Grid.Column="0" >
<ListBox.ItemTemplate>
<DataTemplate>
<!--ExpanderView-->
<toolkit:ExpanderView Header="{Binding}"
HeaderTemplate="{StaticResource CustomHeaderTemplate}"
Expander="{Binding}"
ExpanderTemplate="{StaticResource CustomExpanderTemplate}"
x:Name="expander"
FontSize="36"
Foreground="#FF00457C"
ItemsSource="{Binding testItems}"
ItemTemplate="{StaticResource ExpanderViewItems}" >
</toolkit:ExpanderView>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
I'd really appreciate any help in the right direction! This seems to be a question that is not easily answered around the web.
#Frederik I've implemented what you've done in the code above using the SelectionChanged event of the ListBox - it still works fine for me.
I've been banging my head against the wall for a bit, but finally managed to solve it. First of all for the ItemTemplate I've made sure that the template is placed in a ListBoxItem element as it follows:
<DataTemplate x:Key="ExpanderViewItems" >
<ListBoxItem DataContext="{Binding}" Tap="ListBoxItem_Tap_1">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="15" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Image Source="{Binding flagIcon}" Grid.Row="0" Grid.RowSpan="3" Grid.Column="0" />
<TextBlock FontSize="26" Text="{Binding N}" Foreground="Black" FontWeight="Normal" Grid.Row="0" Grid.Column="1"/>
<TextBlock FontSize="20" Text="{Binding RNG}" Foreground="Black" FontWeight="Normal" HorizontalAlignment="Right" Grid.Row="0" Grid.Column="2"/>
<TextBlock FontSize="26" Text="{Binding ValueAndUnit}" Foreground="Black" FontWeight="Medium" HorizontalAlignment="Right" Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="2"/>
<TextBlock FontSize="18" Text="{Binding COM}" Foreground="Black" FontWeight="Normal" Grid.Row="2" Grid.Column="1" Grid.ColumnSpan="2" TextWrapping="Wrap" />
<Line StrokeThickness="1" Stroke="#C4C6CC" Stretch="Fill" X1="0" X2="1" Y1="0" Y2="0" VerticalAlignment="Center" Grid.Row="3" Grid.Column="0" Grid.ColumnSpan="3" />
</Grid>
</ListBoxItem>
</DataTemplate>
Once this is in place, go in the code behind and in the Tap event declared for the ListBoxItem use something like this:
ListBoxItem item = sender as ListBoxItem;
ExpanderItemModel model = item.DataContext as ExpanderItemModel;
Of course, ExpanderItemModel will be whatever you're using for your expander items...
This worked fine for me
Hope this helps!
Good luck!
You can use the "tap" event on the listbox:
In your XAML file add a tap event listner:
<!--Listbox Containing ExpanderViews-->
<ListBox Name="testsList" Grid.Row="3" Grid.Column="0" Tap="testsList_Tap" >
<ListBox.ItemTemplate>
<DataTemplate>
<!--ExpanderView-->
<toolkit:ExpanderView Header="{Binding}"
...
In your code behind file, implement the tap handler:
private void testsList_Tap(object sender, System.Windows.Input.GestureEventArgs e)
{
someModel selectedItem = (someModel)this.testsList.SelectedItem;
// Do something with your seleted data
...
}
you can get the selected values by listbox selectionchanged or expanderview expanded events.
For listbox :
private void lstExams_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
if (e.AddedItems.Count > 0)
{
Model.ExamTitles data = (sender as ListBox).SelectedItem as Model.ExamTitles;
}
}
Here ExamTitles is a class which contains collections
For expanderview Expanded
private void ExpanderView_Expanded(object sender, RoutedEventArgs e)
{
ExpanderView expview = (sender as ExpanderView);
Model.ExamTitles data = expview.Header as Model.ExamTitles;
}
Hope this helps!
This is my control with my custom DataTemplateSelector:
<m:Map x:Name="MainMap">
<m:MapItemsControl
ItemsSource="{Binding Source={StaticResource WorkLayerData}}">
<m:MapItemsControl.ItemTemplate>
<DataTemplate>
<Mobile:DevicePushpinTemplateSelector
m:MapLayer.Position="{Binding Location}"
ZoomLevel="{Binding ZoomLevel, ElementName=MainMap}"
Content="{Binding}">
<Mobile:DevicePushpinTemplateSelector.DotTemplate>
<DataTemplate>
<Ellipse Width="8" Height="8" Stroke="Black" Fill="{Binding IsGPSDataRecent, Converter={StaticResource BoolToGreenRedBrushConverter}}" StrokeThickness="1" />
</DataTemplate>
</Mobile:DevicePushpinTemplateSelector.DotTemplate>
<Mobile:DevicePushpinTemplateSelector.NumberedTemplate>
<DataTemplate>
<Border x:Name="border" Background="{Binding IsGPSDataRecent, Converter={StaticResource BoolToGreenRedBrushConverter}}" BorderBrush="Black" BorderThickness="2" Padding="2" Height="20" CornerRadius="8">
<TextBlock VerticalAlignment="Center" Text="{Binding DisplayId}" />
</Border>
</DataTemplate>
</Mobile:DevicePushpinTemplateSelector.NumberedTemplate>
<Mobile:DevicePushpinTemplateSelector.DetailedTemplate>
<DataTemplate>
<Border Background="{Binding IsGPSDataRecent, Converter={StaticResource BoolToGreenRedBrushConverter}}" BorderBrush="Black" BorderThickness="1" Padding="2" CornerRadius="2">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<TextBlock Text="Id:" FontWeight="Bold" />
<TextBlock Text="{Binding DisplayId}" Grid.Column="1" />
<TextBlock Text="Device Id:" FontWeight="Bold" Grid.Row="1" />
<TextBlock Text="{Binding DeviceId}" Grid.Row="1" Grid.Column="1" />
<TextBlock Text="Speed:" FontWeight="Bold" Grid.Row="2" />
<TextBlock Text="{Binding Speed}" Grid.Row="2" Grid.Column="1" />
<TextBlock Text="Location:" FontWeight="Bold" Grid.Row="3" />
<TextBlock Text="{Binding Location}" Grid.Row="3" Grid.Column="1" />
<Button Content="View Details" Grid.Row="4" Grid.ColumnSpan="2" />
</Grid>
</Border>
</DataTemplate>
</Mobile:DevicePushpinTemplateSelector.DetailedTemplate>
</Mobile:DevicePushpinTemplateSelector>
</DataTemplate>
</m:MapItemsControl.ItemTemplate>
</m:MapItemsControl>
</m:Map>
I want to move my Mobile:DevicePushpinTemplateSelector.DetailedTemplate into resources so I can reuse it somewhere else.
I declared resource:
<UserControl.Resources>
<DataTemplate x:Key="DetailedMapItemTemplate">
<Border Background="{Binding IsGPSDataRecent, Converter={StaticResource BoolToGreenRedBrushConverter}}" BorderBrush="Black" BorderThickness="1" Padding="2" CornerRadius="2">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<TextBlock Text="Id:" FontWeight="Bold" />
<TextBlock Text="{Binding DisplayId}" Grid.Column="1" />
<TextBlock Text="Device Id:" FontWeight="Bold" Grid.Row="1" />
<TextBlock Text="{Binding DeviceId}" Grid.Row="1" Grid.Column="1" />
<TextBlock Text="Speed:" FontWeight="Bold" Grid.Row="2" />
<TextBlock Text="{Binding Speed}" Grid.Row="2" Grid.Column="1" />
<TextBlock Text="Location:" FontWeight="Bold" Grid.Row="3" />
<TextBlock Text="{Binding Location}" Grid.Row="3" Grid.Column="1" />
<Button Content="View Details" Grid.Row="4" Grid.ColumnSpan="2" />
</Grid>
</Border>
</DataTemplate>
</UserControl.Resources>
My problem is that I don't know HOW to use this DataTemplate inside my selector. What is the XAML I need to use? With controls like ListBox it is easy, just set ItemTemplate="{StaticResource thisTemplate}" but how do I do this in my case? Still learning XAML
Just set the DetailedTemplate property in the tag itself:
<Mobile:DevicePushpinTemplateSelector
m:MapLayer.Position="{Binding Location}"
ZoomLevel="{Binding ZoomLevel, ElementName=MainMap}"
Content="{Binding}"
DetailedTemplate="{StaticResource DetailedMapItemTemplate}">
...
I have a usercontrol which I want to use as a DataTemplate in a Listbox.
This works:
<ListBox>
<ListBox.ItemTemplate>
<DataTemplate>
<Grid x:Name="Grid" Height="100" Width="880" Background="LightGray">
<Grid.RowDefinitions>
<RowDefinition Height="24"/>
<RowDefinition Height="24"/>
<RowDefinition Height="24"/>
<RowDefinition Height="24"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="190" />
<ColumnDefinition Width="100" />
<ColumnDefinition Width="100" />
<ColumnDefinition Width="100" />
<ColumnDefinition Width="190" />
<ColumnDefinition Width="200" />
</Grid.ColumnDefinitions>
<Label Grid.Column="0" Grid.Row="0">Client</Label>
<Label Grid.Column="0" Grid.Row="2">Contact</Label>
<Label Grid.Column="1" Grid.Row="0">Date Presentation</Label>
<Label Grid.Column="2" Grid.Row="0">Action</Label>
<Label Grid.Column="3" Grid.Row="0">Date Interview</Label>
<Label Grid.Column="3" Grid.Row="2">Time Interview</Label>
<Label Grid.Column="4" Grid.Row="0">Remarks</Label>
<Label Grid.Column="5" Margin="0,0,2,0">managed by</Label>
<ComboBox Grid.Column="0" Grid.Row="1" Margin="2" Text="{Binding Path=Customer}">
<!--Template-->
</ComboBox>
<TextBox Grid.Column="0" Grid.Row="3" Margin="2" Text="{Binding Path=Contact}"></TextBox>
<TextBox Grid.Column="1" Grid.Row="1" Margin="2" Text="{Binding Path=PresentationDate}"></TextBox>
<ComboBox Grid.Column="2" Grid.Row="1" Margin="2" Text="{Binding Path=Action}">
<!--Template-->
</ComboBox>
<TextBox Grid.Column="3" Grid.Row="1" Margin="2" Text="{Binding Path=InterviewDate}"></TextBox>
<TextBox Grid.Column="3" Grid.Row="3" Margin="2" Text="{Binding Path=InterviewTime}"></TextBox>
<TextBox Grid.Column="4" Grid.Row="1" Grid.RowSpan="3" Margin="2" Text="{Binding Path=Remarks}"></TextBox>
<StackPanel Orientation="Horizontal" Grid.Column="5" Grid.Row="1" >
<ComboBox Width="124" Text="{Binding Path=Manager}" Margin="2"></ComboBox>
<Button Width="60" Height="20" Margin="4,0,0,0" >Mail</Button>
</StackPanel>
<CheckBox Grid.Column="5" Grid.Row="3" Margin="2,2,4,2">Rejection communicated</CheckBox>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
If I put the exact same code from between the <DataTemplate> tags:
<UserControl x:Class="CandiMan.View.CandidatePresentationControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:cm="clr-namespace:CandiMan;assembly=CandiMan"
xmlns:vw="clr-namespace:CandiMan.View;assembly=CandiMan"
xmlns:vm="clr-namespace:CandiMan.ViewModel;assembly=CandiMan"
Height="100" Width="880" BorderBrush="Black" BorderThickness="1">
<Grid x:Name="Grid" Height="100" Width="880" Background="LightGray">
<Grid.RowDefinitions>
<RowDefinition Height="24"/>
<RowDefinition Height="24"/>
<RowDefinition Height="24"/>
<RowDefinition Height="24"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="190" />
<ColumnDefinition Width="100" />
<ColumnDefinition Width="100" />
<ColumnDefinition Width="100" />
<ColumnDefinition Width="190" />
<ColumnDefinition Width="200" />
</Grid.ColumnDefinitions>
<Label Grid.Column="0" Grid.Row="0">Client</Label>
<Label Grid.Column="0" Grid.Row="2">Contact</Label>
<Label Grid.Column="1" Grid.Row="0">Date Presentation</Label>
<Label Grid.Column="2" Grid.Row="0">Action</Label>
<Label Grid.Column="3" Grid.Row="0">Date Interview</Label>
<Label Grid.Column="3" Grid.Row="2">Time Interview</Label>
<Label Grid.Column="4" Grid.Row="0">Remarks</Label>
<Label Grid.Column="5" Margin="0,0,2,0">managed by</Label>
<ComboBox Grid.Column="0" Grid.Row="1" Margin="2" Text="{Binding Path=Customer}">
<!--Template-->
</ComboBox>
<TextBox Grid.Column="0" Grid.Row="3" Margin="2" Text="{Binding Path=Contact}"></TextBox>
<TextBox Grid.Column="1" Grid.Row="1" Margin="2" Text="{Binding Path=PresentationDate}"></TextBox>
<ComboBox Grid.Column="2" Grid.Row="1" Margin="2" Text="{Binding Path=Action}">
<!--Template-->
</ComboBox>
<TextBox Grid.Column="3" Grid.Row="1" Margin="2" Text="{Binding Path=InterviewDate}"></TextBox>
<TextBox Grid.Column="3" Grid.Row="3" Margin="2" Text="{Binding Path=InterviewTime}"></TextBox>
<TextBox Grid.Column="4" Grid.Row="1" Grid.RowSpan="3" Margin="2" Text="{Binding Path=Remarks}"></TextBox>
<StackPanel Orientation="Horizontal" Grid.Column="5" Grid.Row="1" >
<ComboBox Width="124" Text="{Binding Path=Manager}" Margin="2"></ComboBox>
<Button Width="60" Height="20" Margin="4,0,0,0" >Mail</Button>
</StackPanel>
<CheckBox Grid.Column="5" Grid.Row="3" Margin="2,2,4,2">Rejection communicated</CheckBox>
</Grid>
</UserControl>
into a usercontrol named CandidatePresentationControl and do it like
<ListBox>
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<vw:CandidatePresentationControl/>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
it does not get rendered. No errors, just an empty listbox. Can someone help me??
Thank you!
edit: I forgot something, dunno if it matters: The whole thing I'm doing this in, is a usercontrol, too.
It shouldn't matter, that your referenced UserControl is within another UserControl. Try these steps to better debug your XAML-code: http://beacosta.com/blog/?p=52
Since you have your data hard wired in XAML, the only way to explain the empty ListBox is, that your UserControl can't be found by the parent UserControl, imo.
<ListBox>
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<vw:CandidatePresentationControl DataContext="{Binding}"/>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
You have to write this way in order to bind datacontext, I would suggest you look at MVVM that will give you idea on how to do it even better way.