Binding selected item from Listbox with datatemplate - c#

I have a ListBox with Questions and Answers which is taking data from Database. Now i want to display or edit data from selected row from 'Listbox', but i have problem how to get to this row.
Edit. Image to show what i want to do:
http://imgur.com/5NHjYA4
My View:
<Window x:Class="QuizMaker.MainWindow"
<Window.DataContext>
<local:MainViewModel />
</Window.DataContext>
<Window.Resources>
<DataTemplate x:Key="QuestionsTemplate">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="320" />
<ColumnDefinition Width="120" />
<ColumnDefinition Width="100" />
<ColumnDefinition Width="100" />
<ColumnDefinition Width="100" />
<ColumnDefinition Width="20" />
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" Text="{Binding Path=Question}" FontWeight="Bold" />
<TextBlock Grid.Column="1" Text="{Binding Path=AnswerA}" />
<TextBlock Grid.Column="2" Text="{Binding Path=AnswerB}"/>
<TextBlock Grid.Column="3" Text="{Binding Path=AnswerC}"/>
<TextBlock Grid.Column="4" Text="{Binding Path=AnswerD}"/>
<TextBlock Grid.Column="5" Text="{Binding Path=RightAnswer}" FontWeight="Bold"/>
</Grid>
</DataTemplate>
</Window.Resources>
<Grid>
<ListBox DataContext="{Binding MyDataSet}"
x:Name="listBox"
ItemsSource="{Binding Path=QuestionTable}"
ItemTemplate="{StaticResource QuestionsTemplate}"
SelectedItem="{Binding SelectedItemString}"
/>
</Grid>
</Window>
And ViewModel(I cut most of properties)
{
class MainViewModel
{
private string _appPath;
private MainModel _MainModel;
public MainViewModel()
{
_MainModel = new MainModel();
mdbFile = Path.Combine(AppDataPath, "QuestionBase.mdb");
connString = $"Provider=Microsoft.Jet.OLEDB.4.0; Data Source={mdbFile}";
conn = new OleDbConnection(connString);
adapter = new OleDbDataAdapter("SELECT * FROM QuestionTable;", conn);
MyDataSet = new DataSet();
adapter.Fill(MyDataSet, "QuestionTable");
}
private void AddToDB()
{
conn.Open();
OleDbCommand myCommand = new OleDbCommand("Insert INTO QuestionTable ( Question, AnswerA, AnswerB, AnswerC, AnswerD ) Values(#Question, #AnswerA, #AnswerB, #AnswerC, #AnswerD)", conn);
myCommand.Parameters.Add("#Question", OleDbType.BSTR).Value = Question;
myCommand.Parameters.Add("#Question", OleDbType.BSTR).Value = AnswerA;
myCommand.Parameters.Add("#Question", OleDbType.BSTR).Value = AnswerB;
myCommand.Parameters.Add("#Question", OleDbType.BSTR).Value = AnswerC;
myCommand.Parameters.Add("#Question", OleDbType.BSTR).Value = AnswerD;
myCommand.ExecuteNonQuery();
conn.Close();
}
private string AppDataPath
{
get
{
if (string.IsNullOrEmpty(_appPath))
{
_appPath = Environment.GetFolderPath(Environment.SpecialFolder.ApplicationData);
}
return _appPath;
}
}
public OleDbDataAdapter adapter
{
get
{
return _MainModel.adapter;
}
set
{
_MainModel.adapter = value;
OnPropertyChanged("adapter");
}
}
public DataSet MyDataSet
{
get
{
return _MainModel.MyDataSet;
}
set
{
_MainModel.MyDataSet = value;
OnPropertyChanged("MyDataSet");
}
}
public string SelectedItemString
{
get
{
return _MainModel.SelectedItemString;
}
set
{
_MainModel.SelectedItemString = value;
OnPropertyChanged("SelectedItemString");
}
}
public event PropertyChangedEventHandler PropertyChanged;
private void OnPropertyChanged(string propertyName)
{
PropertyChangedEventHandler handler = PropertyChanged;
if (handler != null)
{
handler(this, new PropertyChangedEventArgs(propertyName));
}
}
}
}

Sorry I couldn't add a comment. I hope your requirement is to show the selected item's value in the TextBox and update the same value into your collection(in your case DataTable) as you change value from the TextBox. If that is your requirement change your TextBox bindings like this
<TextBox x:Name="ValueText" Text="{Binding SelectedItem.ColumnName, ElementName=listBox, UpdateSourceTrigger=PropertyChanged}" />
I don't know why you are binding SelectedItem to string type SelectedItemString property. It will create binding error as per your source.

Change your SelectedItemString property to a DataRow, and bind your other controls to that.
For example,
public DataRow SelectedItem
{
get
{
return _MainModel.SelectedItem;
}
set
{
_MainModel.SelectedItem = value;
OnPropertyChanged("SelectedItem");
}
}
And in XAML should be something like this :
<Window x:Class="QuizMaker.MainWindow"
<Window.DataContext>
<local:MainViewModel />
</Window.DataContext>
<Window.Resources>
<DataTemplate x:Key="QuestionsTemplate">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="320" />
<ColumnDefinition Width="120" />
<ColumnDefinition Width="100" />
<ColumnDefinition Width="100" />
<ColumnDefinition Width="100" />
<ColumnDefinition Width="20" />
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" Text="{Binding Path=Question}" FontWeight="Bold" />
<TextBlock Grid.Column="1" Text="{Binding Path=AnswerA}" />
<TextBlock Grid.Column="2" Text="{Binding Path=AnswerB}"/>
<TextBlock Grid.Column="3" Text="{Binding Path=AnswerC}"/>
<TextBlock Grid.Column="4" Text="{Binding Path=AnswerD}"/>
<TextBlock Grid.Column="5" Text="{Binding Path=RightAnswer}" FontWeight="Bold"/>
</Grid>
</DataTemplate>
</Window.Resources>
<DockPanel>
<ContentControl Content="{Binding SelectedItem}"
ContentTemplate="{StaticResource QuestionsTemplate}"
DockPanel.Dock="Top" />
<ListBox DataContext="{Binding MyDataSet}"
x:Name="listBox"
ItemsSource="{Binding Path=QuestionTable}"
ItemTemplate="{StaticResource QuestionsTemplate}"
SelectedItem="{Binding SelectedItem}"
/>
</DockPanel>
</Window>
Also if you really don't want to change the way you track your selected item, you could also bind directly to listBox.SelectedItem like Davys said
<ContentControl Content="{Binding ElementName=listBox, Path=SelectedItem}"
ContentTemplate="{StaticResource QuestionsTemplate}"
DockPanel.Dock="Top" />

Related

How to set Listview Itemtemplate when drag drop in wpf

I have create simple drag drop in WPF. In my application there are two Listviews. I have to drag list items from first listview and drop the item to second listview. I have created custom data template for first listview. When i drag the first listview item into second listview the data template is not customized so items are not displayed. How to display the list items with generic. Please help. My Code is as below,
<Grid Margin="0,20,0,0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<ListBox
Name="memberCollection"
Grid.Column="1"
Width="150"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
PreviewMouseLeftButtonDown="memberCollection_PreviewMouseLeftButtonDown">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBox Text="{Binding Name}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<Grid
Name="gridDrop"
Grid.Column="0"
Margin="20,0,0,0"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
ListBox.Drop="grid_Drop"
ShowGridLines="True">
<ListBox
Grid.Row="0"
Grid.Column="0"
Margin="10,10,0,0"
AllowDrop="True" />
</Grid>
</Grid>
Code Behind
ObservableCollection<Member> member = new ObservableCollection<Member>();
public MainWindow()
{
InitializeComponent();
member.Add(new Member { Name = "Karthick", ID = "20011", Address = "10, MainRoad, Chennai" });
memberCollection.ItemsSource = member;
DataContext = new Member();
}
private void memberCollection_PreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
object selectedMember = memberCollection.SelectedItem as Member;
if (selectedMember != null)
DragDrop.DoDragDrop(memberCollection, selectedMember, DragDropEffects.All);
}
private void grid_Drop(object sender, RoutedEventArgs e)
{
ListBox listContent = e.Source as ListBox;
if (listContent != null)
Console.WriteLine("", Grid.GetColumn(listContent), Grid.GetRow(listContent));
DataObject item = (((DragEventArgs)e).Data) as DataObject;
object Target = ((Grid)(sender)).DataContext;
object listItem = item.GetData(Target.GetType());
if (listItem != null)
{
//listContent.Items.Add(listItem.Name.ToString());
//listContent.Items.Add(listItem.ID.ToString());
//listContent.Items.Add(listItem.Address.ToString());
//listContent.ItemTemplate = memberCollection.ItemTemplate;
listContent.Items.Add(listItem);
}
}
If you define the DataTemplate as a reusable resource, you can use it in both ListBoxes:
<Grid Margin="0,20,0,0">
<Grid.Resources>
<DataTemplate x:Key="dataTemplate">
<StackPanel>
<TextBox Text="{Binding Name}" />
</StackPanel>
</DataTemplate>
</Grid.Resources>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<ListBox
Name="memberCollection"
Grid.Column="1"
Width="150"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
PreviewMouseLeftButtonDown="memberCollection_PreviewMouseLeftButtonDown"
ItemTemplate="{StaticResource dataTemplate}" />
<Grid
Name="gridDrop"
Grid.Column="0"
Margin="20,0,0,0"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
ListBox.Drop="grid_Drop"
ShowGridLines="True">
<ListBox
Grid.Row="0"
Grid.Column="0"
Margin="10,10,0,0"
AllowDrop="True"
ItemTemplate="{StaticResource dataTemplate}"/>
</Grid>
</Grid>
If you want to display some other properties of the dropped Member in the second ListBox, you should define another ItemTemplate:
<ListBox
Grid.Row="0"
Grid.Column="0"
Margin="10,10,0,0"
AllowDrop="True">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Name}" />
<TextBlock Text="{Binding Id}" />
<TextBlock Tag="{Binding Address}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>

UWP C# ListView return the Id value of the clicked row

I am fairly new to coding and I am building a database UI.
What I need to do is click on a row in a listview and get the return of the Id.
Below is the code I have but it gets an 'Exception User-Unhandled System.ArgumentNullException: value cannot be null'.
Any help will be predicated.
UWP Xaml <ListView x:Name="ListItems" IsItemClickEnabled="True" ItemClick="ListItems_ItemClick" Tag="{Binding Id}"
>
private void ListItems_ItemClick(object sender, ItemClickEventArgs e)
{
var id = (sender as ListView).Tag as string;
{
testbox.Text = id;
}
Full List View
<ListView x:Name="ListItems" IsItemClickEnabled="True" ItemClick="ListItems_ItemClick" Tag="{Binding Id}"
>
<ListView.ItemTemplate >
<DataTemplate >
<Border
BorderThickness="0,0,0,0">
<Grid HorizontalAlignment="Stretch">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="250" />
<ColumnDefinition Width="130" />
<ColumnDefinition Width="150" />
<ColumnDefinition Width="200" />
<ColumnDefinition Width="200" />
<ColumnDefinition Width="200" />
<ColumnDefinition Width="auto" />
</Grid.ColumnDefinitions>
<Grid.Resources>
<Style TargetType="TextBlock">
<Setter Property="Padding" Value="8,0,0,0" />
</Style>
</Grid.Resources>
<TextBlock
Grid.Column="0"
HorizontalAlignment="Stretch"
Text="{Binding LegalName, Mode=OneWay}" />
<TextBlock
Grid.Column="1"
HorizontalAlignment="Stretch"
Text="{Binding PhoneNumber, Mode=OneWay}" />
<TextBlock
Grid.Column="2"
HorizontalAlignment="Stretch"
Text="{Binding EmailAddress, Mode=OneWay}" />
<TextBlock
Grid.Column="3"
HorizontalAlignment="Stretch"
Text="{Binding HomeAddress, Mode=OneWay}" />
<TextBlock
Grid.Column="4"
HorizontalAlignment="Stretch"
Text="{Binding PostalAddress, Mode=OneWay}" />
<TextBlock
Grid.Column="5"
HorizontalAlignment="Stretch"
Text="{Binding Id, Mode=OneWay}" />
</Grid>
</Border>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Here's a very easy approach. Bind the TextChanged event of all the texboxes to a TextChanged event :
XAML
<TextBlock Grid.Column="0" TextChanged="textbox_TextChanged".../>
C#
private string selectedText;
private void textbox_TextChanged(object sender, EventArgs e)
{
selectedtext = (sender as TextBlock).Text
}
private void ListItems_ItemClick(object sender, ItemClickEventArgs e)
{
///use selectedtext string as you want
}
do it Like that
1 - do not bind id to list-view Tag because it is Object.
2 - get your id like that
private void ListItems_ItemClick(object sender, ItemClickEventArgs e)
{
if ((e != null) && (e.Item != null))
{
var selected = (lsv.SelectedItem as yourClassType);
var yorItemID=selected .id;
}
}

How Do I Access Properties of an Object Selected from a ListBox WPF MVVM

I have a list box bound to an observable object in my ViewModel. When the user selects an item in the listbox the SelectedItem fires the "SelectedSandwich" property. The value is saved to a private field. The properties SandwichName and Description are properties of the Sandwich object. I want text blocks in my view to show selected sandwichname and price, but I don't want to bind these text blocks to the listbox element.
Here is the view:
'
<Window.DataContext>
<vm:SandwichVM/>
</Window.DataContext>
<Window.Resources>
<DataTemplate x:Key="lstSandwich">
<Border BorderThickness="3"
CornerRadius="4"
HorizontalAlignment="Stretch"
BorderBrush="Blue">
<TextBlock HorizontalAlignment="Stretch">
<Run Text="{Binding SandwichName}"/>
<Run Text=" | " />
<Run Text="{Binding Description}" />
<Run Text=" | " />
<Run Text="{Binding Price}" />
</TextBlock>
</Border>
</DataTemplate>
<DataTemplate x:Key="menu" >
<Border>
<TextBlock HorizontalAlignment="Stretch">
<Run Text="{Binding SandwichName}"/>
<Run Text="{Binding Price}" />
</TextBlock>
</Border>
</DataTemplate>
</Window.Resources>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="2*"/>
</Grid.RowDefinitions>
<ListBox Grid.Row="0" x:Name="cboMenu"
ItemsSource="{Binding Sandwiches}"
SelectedItem="{Binding SelectedSandwich, Mode=TwoWay}"
ItemTemplate="{StaticResource lstSandwich}"
Margin="3">
</ListBox>
<Grid Grid.Row="1">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="3*"/>
</Grid.RowDefinitions>
<TextBlock Grid.Row="0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontStretch="ExtraExpanded"
FontFamily="Verdana"
FontSize="22"
>
<Run Text="Your Selection"/>
</TextBlock>
<Grid Grid.Row="1">
<ContentControl
ContentTemplate="{StaticResource menu}"
HorizontalAlignment="Stretch"
Margin="5,0,5,0">
</ContentControl>
</Grid>
</Grid>
</Grid>
</Window>'
Here is the ViewModel:
'class SandwichVM : INotifyPropertyChanged
{
private Sandwich _selectedSandwich;
private ObservableCollection<Sandwich> _sandwiches;
public ObservableCollection<Sandwich> Sandwiches
{
get { return _sandwiches; }
}
public SandwichVM()
{
//fake data for the list
_sandwiches = new ObservableCollection<Sandwich>();
_sandwiches.Add(new Sandwich("Pastrami", "Stacked high on rye bread with a touch of mustard.", 8.50));
_sandwiches.Add(new Sandwich("Tuna", "Fresh tuna salad on wheat with slice of cheddar cheese.", 6.50));
_sandwiches.Add(new Sandwich("Steak", "Sliced grilled steak with sauteed mushrooms and onions.", 9.50));
_sandwiches.Add(new Sandwich("Chicken Salad", "Juicy chunks of chicken breast, onions, fruit.", 6.50));
_sandwiches.Add(new Sandwich("Buffalo Chicken", "Caliente! Fried chicken breast slathered with hot buffalo wing sauce.", 8.50));
_sandwiches.Add(new Sandwich("Tofu", "I don't know how to make a tofu sandwich.", 1.50));
}
public Sandwich SelectedSandwich
{
get { return _selectedSandwich; }
set
{
if (_selectedSandwich != value)
{
_selectedSandwich = value;
RaisePropertyChangedEvent("SelectedSandwich");
}
}
}
public string SandwichName
{
get { return _selectedSandwich.SandwichName; }
set
{
_selectedSandwich.SandwichName = value;
RaisePropertyChangedEvent("SandwichName");
}
}
public string Description
{
get { return _selectedSandwich.Description; }
set
{
_selectedSandwich.Description = value;
RaisePropertyChangedEvent("Description");
}
}
public string Price
{
get { return _selectedSandwich.Price.ToString(); }
set
{
_selectedSandwich.Price = Convert.ToDouble(value);
RaisePropertyChangedEvent("Price");
}
}
public event PropertyChangedEventHandler PropertyChanged;
protected void RaisePropertyChangedEvent(string propertyName)
{
var handler = PropertyChanged;
if (handler != null)
handler(this, new PropertyChangedEventArgs(propertyName));
}'
I tried putting the RaisePropertyChangedEvent in the setters for the three properties (though I only need to read them) but the setters are never executed. In fact, the setter for the SelectedSandwich property is never executed. The get is executed everytime. I have stepped through the code but can't see where the problem lies.
Thank you for your help.
Maybe its not clear to me, but the only property you are setting from UI is the SelectedSandwich property. If it sets properly when you change the selected listbox item then why not to bind to the SelectedSandwich from the other place?
So if you want some text blocks in your view to show selected sandwichname and price just try something like:
<TextBlock Text="{Binding SelectedSandwich.Name}"/>
<TextBlock Text="{Binding SelectedSandwich.Price}"/>
Or if you want to use your prepared datatemplate:
<DataTemplate DataType="{x:Type sandwichVMNamespace:Sandwich}">
<Border>
<TextBlock HorizontalAlignment="Stretch">
<Run Text="{Binding SandwichName}"/>
<Run Text="{Binding Price}" />
</TextBlock>
</Border>
</DataTemplate>
<Grid Grid.Row="1">
<ContentControl
Content="{Binding SelectedSandwich}"
HorizontalAlignment="Stretch"
Margin="5,0,5,0">
</ContentControl>
</Grid>
And you are done...

SilverLight Get control Value inside Combo Box

I am working on silverlight and I am new in it, I have a combox box,inside which I have a checkbox and textbox. I want to get the value of these controls on button click, How can I do this in SilverLight?
This is my ComboBox
<ComboBox x:Name="Type" VerticalAlignment="Top" Margin="2,8,-2,0" Grid.ColumnSpan="3" Height="28" Padding="3">
<ComboBoxItem>
<Grid HorizontalAlignment="Stretch">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="20"/>
<ColumnDefinition Width="*" MinWidth="105" />
<ColumnDefinition Width="60" />
</Grid.ColumnDefinitions>
<CheckBox IsChecked="true" VerticalAlignment="Center" Grid.Column="0"/>
<TextBlock Text="All" VerticalAlignment="Center" Grid.Column="1" Style="{x:Null}" FontSize="11"/>
</Grid>
</ComboBoxItem>
<ComboBoxItem>
<Grid HorizontalAlignment="Stretch">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="20"/>
<ColumnDefinition Width="*" MinWidth="105" />
<ColumnDefinition Width="60" />
</Grid.ColumnDefinitions>
<CheckBox IsChecked="true" VerticalAlignment="Center" Grid.Column="0"/>
<TextBlock Text="General" VerticalAlignment="Center" Grid.Column="1" Style="{x:Null}" FontSize="11"/>
<TextBox Text="25" VerticalAlignment="Center" Grid.Column="2" FontSize="11" Padding="2" HorizontalContentAlignment="Right"/>
</Grid>
</ComboBoxItem>
</ComboBox>
User have option to select multiple values
I am using MVVM pattern
Since all of your ComboBox Items are unchanging, you can give Names to those items and reference them directly.
<ComboBoxItem x:Name="ComboItemAll">
...
</ComboBoxItem>
<ComboBoxItem x:Name="ComboItemGeneral">
...
</ComboBoxItem>
and the in the Button Click event:
if (ComboItemAll.IsSelected)
{
...
}
else if (ComboItemGeneral.IsSelected)
{
...
}
alternatively, you could also get this information from your ComboBox "Type":
var selectedItem = Type.SelectedItem;
if (selectedItem.Name.StartsWith("ComboItemAll"))
{
...
}
else if (selectedItem.Name.StartsWith("ComboItemGeneral"))
{
...
}
For MVVM (Edit):
Xaml (View):
<ComboBox SelectedItem="{Binding SelectedCustomItem, Mode=TwoWay}" ItemsSource="{CustomItems}" ItemTemplate={StaticResource CustomItemsTemplate} />
Xaml (Resource):
<DataTemplate x:Key="CustomItemsTemplate">
<StackPanel
<CheckBox IsChecked="{Binding IsSelected}" VerticalAlignment="Center"/>
<TextBlock Text="{Binding CustomPropertyFromCustomClass}"/>
</StackPanel>
</DataTemplate>
VM:
public class ViewModel
{
public ViewModel()
{
CustomItems = new ObservableCollection<CustomClass>();
CustomItems.Add(new CustomClass() { "All" });
CustomItems.Add(new CustomClass() { "General" });
}
private ObservableCollection<CustomClass> customItems = null;
public ObservableCollection<CustomClass> CustomItems
{
get { return customItems; }
set
{
if (object.Equals(value, customItems) == false)
{
customItems = value;
OnPropertyChanged(() => CustomItems);
}
}
}
private CustomClass selectedCustomItem = null;
public CustomClass SelectedCustomItem
{
get { return selectedCustomItem; }
set
{
if (object.Equals(value, selectedCustomItem) == false)
{
selectedCustomItem= value;
OnPropertyChanged(() => SelectedCustomItem);
}
}
}
}
You should never reference your combobox directly from the ViewModel. Everything in your ViewModel should be related to data manipulation and know nothing of the View (aka ComboBox).
Everything else should be done in the view. If you need to access the ComboBox, you need you ask yourself why, and can I do that logic in the XAML through templates and bindings?

Binding StringFormat giving incorrect result

For some reason using Content="{Binding Time, StringFormat=t} is still giving me a long date. The backing field is a DateTime property initialised with DateTime.Now but no matter what string format I try it still shows the full date...
I would like only to see HH:mm tt
Any ideas?
XAML :
<Window x:Class="ArgosSystem.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:loc="clr-namespace:ArgosSystem"
xmlns:sys="clr-namespace:System;assembly=System"
Title="MainWindow" Height="800" Width="1280" Loaded="Window_Loaded">
<Window.Resources>
<DataTemplate DataType="{x:Type loc:Picknote}">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="200" MinWidth="200" />
<ColumnDefinition Width="350" />
<ColumnDefinition Width="250" />
<ColumnDefinition Width="50" />
</Grid.ColumnDefinitions>
<Label Content="{Binding Time, StringFormat=t}" VerticalContentAlignment="Center" Foreground="IndianRed" FontSize="36" Grid.Column="0" />
<Label Content="{Binding Customer}" VerticalContentAlignment="Center" Foreground="IndianRed" FontSize="36" Grid.Column="1" />
<Label Content="{Binding PicknoteNo}" VerticalContentAlignment="Center" Foreground="IndianRed" FontSize="36" Grid.Column="2" />
<Label Content="{Binding Qty}" VerticalContentAlignment="Center" Foreground="IndianRed" FontSize="36" Grid.Column="3" />
</Grid>
</DataTemplate>
</Window.Resources>
<Grid Background="Black">
<DockPanel>
<ScrollViewer Name="lstPicknoteScroll" VerticalScrollBarVisibility="Auto">
<ItemsControl Name="lstPicknotes" ItemsSource="{Binding}" IsTabStop="False" Foreground="Cornsilk" />
</ScrollViewer>
</DockPanel>
</Grid>
</Window>
C# :
public partial class MainWindow : Window
{
ObservableCollection<Picknote> picknotes = new ObservableCollection<Picknote>();
public MainWindow()
{
InitializeComponent();
lstPicknotes.DataContext = picknotes;
}
private void Window_Loaded(object sender, RoutedEventArgs e)
{
picknotes.Add(new Picknote
{
Time = DateTime.Now,
Customer = "REED FOR SPEED",
PicknoteNo = "PKN767677",
Qty = 100
});
picknotes.Add(new Picknote
{
Time = DateTime.Now.AddHours(-2),
Customer = "F1 AUTOMOTIVE",
PicknoteNo = "PKN767677",
Qty = 50
});
picknotes.Add(new Picknote
{
Time = DateTime.Now.AddHours(-1),
Customer = "FERGUSENS",
PicknoteNo = "PKN767677",
Qty = 10
});
}
}
StringFormat works on properties of type string. The Content property is of type Object so you need to specify the format using ContentStringFormat property of Label control.
<Label Content="{Binding Time}" ContentStringFormat="t" VerticalContentAlignment="Center" Foreground="IndianRed" FontSize="36" Grid.Column="0" />

Categories