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>
Related
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.
I have grid designed something like below:
This is xaml used for a grid:-
I am using devexpress gridcontrol in my application.
<dxg:GridControl ItemsSource="{Binding MyAddresses}">
<dxg:GridControl.View>
<dxg:TableView NavigationStyle="Cell"></dxg:TableView>
</dxg:GridControl.View>
<dxg:GridControl.Columns>
<dxg:GridColumn Name="MyAddress" Header="Address" MinWidth="725">
<dxg:GridColumn.CellTemplate>
<DataTemplate>
<Grid DataContext="{Binding RowData.Row}" HorizontalAlignment="Stretch" VerticalAlignment="Center" Margin="5">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="5"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="5"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="5"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="5"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="5"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"></ColumnDefinition>
<ColumnDefinition Width="5"></ColumnDefinition>
<ColumnDefinition MinWidth="250"></ColumnDefinition>
<ColumnDefinition Width="25"></ColumnDefinition>
<ColumnDefinition Width="Auto"></ColumnDefinition>
<ColumnDefinition Width="5"></ColumnDefinition>
<ColumnDefinition MinWidth="250"></ColumnDefinition>
</Grid.ColumnDefinitions>
<TextBlock Grid.Row="0" Grid.RowSpan="3" Grid.Column="0" Text="Address"/>
<dxe:TextEdit Grid.Row="0" TextWrapping="Wrap" AcceptsReturn="True" VerticalContentAlignment="Top" Grid.RowSpan="3" Grid.Column="2" MaxLength="2000" VerticalAlignment="Stretch" Text="{Binding PostAddress}"/>
<TextBlock Grid.Row="6" Grid.Column="0" Text="Country" />
<dxe:TextEdit Grid.Row="6" Grid.Column="2" Text="{Binding PostCountry}"/>
<TextBlock Grid.Row="4" Grid.Column="0" Text="City" />
<dxe:TextEdit Grid.Row="4" Grid.Column="2" MaxLength="100" Text="{Binding City}"/>
<TextBlock Grid.Row="8" Grid.Column="0" Text="Postal Code" />
<dxe:TextEdit Grid.Row="8" Grid.Column="2" MaxLength="15" Text="{Binding PostalCode}"/>
<TextBlock Grid.Row="10" Grid.Column="0" Text="Subdivision" />
<dxe:TextEdit Grid.Row="10" Grid.Column="2" MaxLength="100" Text="{Binding Subdivision}"/>
<TextBlock Grid.Row="0" Grid.Column="4" Text="Email" />
<dxe:TextEdit Grid.Row="0" Grid.Column="6" MaxLength="254" Text="{Binding Email1}"/>
<TextBlock Grid.Row="2" Grid.Column="4" Text="Phone" />
<dxe:TextEdit Grid.Row="2" Grid.Column="6" MaxLength="20" Text="{Binding Phone1}"/>
<TextBlock Grid.Row="4" Grid.Column="4" Text="Phone" />
<dxe:TextEdit Grid.Row="4" Grid.Column="6" MaxLength="20" Text="{Binding Phone2}"/>
<TextBlock Grid.Row="6" Grid.Column="4" Text="Fax" />
<dxe:TextEdit Grid.Row="6" Grid.Column="6" MaxLength="50" Text="{Binding Fax1}"/>
<TextBlock Grid.Row="8" Grid.Column="4" Text="Telex" />
<dxe:TextEdit Grid.Row="8" Grid.Column="6" MaxLength="100" Text="{Binding Telex}"/>
<TextBlock Grid.Row="10" Grid.Column="4" Text="Web" />
<dxe:TextEdit Grid.Row="10" Grid.Column="6" MaxLength="255" Text="{Binding Web}"/>
</Grid>
</DataTemplate>
</dxg:GridColumn.CellTemplate>
</dxg:GridColumn>
<dxg:GridColumn FieldName="NewField"/>
</dxg:GridControl.Columns>
</dxg:GridControl>
In first cell I have few columns, I want to move cursor with in first cell and then jump to second cell.
Can someone please help.
![enter image description here][1]
My grid looks like above. I have focus on first field . On pressing tab I want focus move to City field not to next cell which is New Field.
Any suggestions?
[1]: http://i.stack.imgur.com/ENqqP.png
The same issue is already discussed at DevExpress Support Center: Tabbing issue in CellTemplate. Thus, you can use the solution provided by the DevExpress Support Team.
The main idea of this solution is in custom handling of the TabbedView.PreviewKeyDown event:
void TableView_PreviewKeyDown(object sender, KeyEventArgs e) {
if (e.Key == Key.Tab) {
// do some custom handling
e.Handled = true; // avoid TabbedView's default focus processing
}
}
Hi everyone my question is that i am working on wpf c# application which is based on MVVM pattern.The problem where i stuck is that i want my textboxes data to display in my datagrid by clicking a button but i am unable to did that and finally asking for some good suggestions and solutions.
My code in XAML:
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="150"/>
<ColumnDefinition Width="150"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Label
Grid.Row="0"
Grid.Column="0"
VerticalAlignment="Center"
Content="VLAN NAME"
Foreground="Black"
Opacity="0.8"
/>
<TextBox
Grid.Row="0"
Grid.Column="1"
Margin="0,5,0,0"
Height="25"
Foreground="Black"
Opacity="0.8"
Width="Auto"
Text="{Binding VlanName, UpdateSourceTrigger=PropertyChanged}"
/>
<Label
Grid.Row="1"
Grid.Column="0"
VerticalAlignment="Center"
Content="VLAN ID"
Foreground="Black"
Opacity="0.8"
/>
<TextBox
Grid.Row="1"
Grid.Column="1"
Margin="0,5,0,0"
Height="25"
Foreground="Black"
Opacity="0.8"
Width="70"
HorizontalAlignment="Left"
Text="{Binding VlanID, UpdateSourceTrigger=PropertyChanged}"
/>
<Label
Grid.Row="2"
Grid.Column="0"
VerticalAlignment="Center"
Content="IP FOR VLAN"
Foreground="Black"
Opacity="0.8"
/>
<Grid
Grid.Column="1"
Grid.Row="2">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="40"/>
<ColumnDefinition Width="40"/>
<ColumnDefinition Width="40"/>
<ColumnDefinition Width="40"/>
</Grid.ColumnDefinitions>
<TextBox
Grid.Row="2"
Grid.Column="0"
Margin="5"
VerticalAlignment="Center"
MaxLength="3"
Width="30"
Foreground="Black"
Opacity="0.8"
Text="{Binding VlanIP1, UpdateSourceTrigger=PropertyChanged}"
/>
<TextBox
Grid.Row="2"
Grid.Column="1"
Margin="5"
VerticalAlignment="Center"
MaxLength="3"
Width="30"
Foreground="Black"
Opacity="0.8"
Text="{Binding VlanIP2, UpdateSourceTrigger=PropertyChanged}"
/>
<TextBox
Grid.Row="2"
Grid.Column="2"
Margin="5"
VerticalAlignment="Center"
MaxLength="3"
Width="30"
Foreground="Black"
Opacity="0.8"
Text="{Binding VlanIP3, UpdateSourceTrigger=PropertyChanged}"
/>
<TextBox
Grid.Row="2"
Grid.Column="3"
Margin="5"
VerticalAlignment="Center"
MaxLength="3"
Width="30"
Foreground="Black"
Opacity="0.8"
Text="{Binding VlanIP4, UpdateSourceTrigger=PropertyChanged}"
/>
</Grid>
<Label
Grid.Row="3"
Grid.Column="0"
VerticalAlignment="Center"
Content="VLAN PORT"
Foreground="Black"
Opacity="0.8"
/>
<ComboBox
Grid.Row="3"
Grid.Column="1"
ItemsSource="{Binding AvailableVlanPorts}"
SelectedItem="{Binding SelectedVlanPort}"
>
</ComboBox>
<Button Grid.Column="3"
Grid.Row="1"
Content="Add VLAN"
Margin="10,5,0,0"
Style="{StaticResource AppButtons}"
Command="{Binding AddVlan}"
Click="Add_Vlan"
/>
<Button Grid.Column="3"
Grid.Row="2"
Content="Remove VLAN"
Margin="10,5,0,0"
Style="{StaticResource AppButtons}"
Width="100"
Command="{Binding RemoveVlan}"
/>
<DataGrid Grid.Row="4"
Grid.ColumnSpan="3"
Height="200"
Margin="10,10,0,0"
Name="dg"
ItemsSource="{Binding vlan}"
AutoGenerateColumns="False"
>
<DataGrid.Columns>
<DataGridTextColumn Header="S.No" Binding="{Binding Path=S_No}"/>
<DataGridTextColumn Header="VLAN Name" Binding="{Binding Path=vname}" />
<DataGridTextColumn Header="VLAN ID" Binding="{Binding Path=vid}" />
<DataGridTextColumn Header=" IP" Width="100"/>
<DataGridTextColumn Header="VLAN Ports" Width="100"/>
</DataGrid.Columns>
</DataGrid>
</Grid>
C# code is:
public string VlanName
{
get
{
return this.ConfigurationLibrary.ConfigLibraryVlanName;
}
set
{
if (String.Equals(this.ConfigurationLibrary.ConfigLibraryVlanName, value))
{
return;
}
this.ConfigurationLibrary.ConfigLibraryVlanName = value;
this.OnPropertyChanged("VlanName");
}
}
public string VlanID
{
get
{
return this.ConfigurationLibrary.ConfigLibraryVlanName;
}
set
{
if (String.Equals(this.ConfigurationLibrary.ConfigLibraryVlanName, value))
{
return;
}
this.ConfigurationLibrary.ConfigLibraryVlanName = value;
this.OnPropertyChanged("VlanID");
}
}
public ICommand AddVlan
{
get
{
if (_addVlan == null)
_addVlan = new RelayCommand(() => this.AddVlans());
return _addVlan;
}
}
void AddVlans()
{
Console.Write("Add vlan");
var serial = new VLANSPropertyClass();
serial.S_No = vlan.Count + 1;
serial.vname = VlanName;
serial.vid = VlanID;
vlan.Add(serial);
}
Firstly i am displaying only two columns for testing.
Any help would be greatly appreciable.
In order to do what you want, the DataGrid should be bound to the collection (e.g. ObservableCollection) where you store all the items, when you click the "Add" button, you call Entities.Add(NewEntity);, where Entities is the collection and NewEntity is a property of the view model. You bind the text boxes to the properties of NewEntity. i've made a small gist here to demonstrate.
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.