Using Silverlight 4 / MVVM.
I am trying to bind a ViewModel to a listbox with a custom template but the data is not displaying. I have managed to get raw data to display if I set the DisplayMemberPath property. If I remove this property and try and bind to the textblocks, nothing displays. Here is the XAML
<ListBox Height='200'
HorizontalAlignment='Left'
Margin='10,10,0,0'
Name='lstForumTopics'
VerticalAlignment='Top'
Width='200'
DataContext='{Binding Path=ForumTopics,Source={StaticResource ForumViewModel}}'
ItemsSource='{Binding Path=ForumTopics,Source={StaticResource ForumViewModel}}'>
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation='Vertical'>
<TextBlock Text='{Binding ForumTopicText,Source={StaticResource ForumViewModel}}'></TextBlock>
<TextBlock Text='{Binding PostCount,Source={StaticResource ForumViewModel}}'></TextBlock>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
<ListBox.Background>
<LinearGradientBrush EndPoint='0.5,1'
StartPoint='0.5,0'>
<GradientStop Color='#FFDCE2E5'
Offset='1' />
<GradientStop Color='White'
Offset='0' />
</LinearGradientBrush>
</ListBox.Background>
</ListBox>
I believe you are confusing the Binding engine. If you are going to use a StaticResource try...
DataContext="{Binding Source={StaticResource ForumViewModel}}"
ItemsSource="{Binding Path=ForumTopics}"
<TextBlock Text="{Binding Path=ForumTopicText}" />
<TextBlock Text="{Binding Path=PostCount}" />
A control has a DataContext which holds the object that the other properties will bind to. The ItemsSource just needs to know the property name of the DataContext object to bind to. Finally, the DataTemplate has a DataContext set to each of the objects within your item source, so they only need to be bound to the property name of the object within your ItemsSource.
I think you need to binding the ItemsSource of the ListBox to an ObservableCollection or IEnumerable of ForumViewModels, not just a single one.
Related
I'm just starting with wpf/vmmv. I've seen examples of binding collections to list boxes. Example: in xaml , in code-behind (e.g. Page) "DataContext = collection.. ".
My view model has more properties than just a single collection that need to be bound to a view. Therefore I'd like to set the view model as DataContext for the view and then, in xaml, bind the view model's collection to a ListBox. Assuming that my view model is set as DataContext and it has a property called 'Customers', what is the correct way of binding the property to a ListBox in xaml?
I tried but it does not work.
Thanks.
Do you mean 'how do you bind a collection to a 'ListBox'? You would do that like this:
<ListBox ItemsSource="{Binding Customers}" />
Or this:
<ListBox ItemsSource="{Binding Path=Customers}" />
If you want to bind the internal values of each instance of the Customer class, you would do something like this:
<ListBox ItemsSource="{Binding Customers}" >
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Name}" />
<TextBlock Text="{Binding Age}" />
<TextBlock Text="{Binding EyeColour}" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
I guess you want to display the property "Customers", what you have to do is define ItemTemplate of ListBox, define DataTemplate inside ItemTemplate, and binding Customers to a control, just like below:
<ListBox ItemsSource="{Binding}" >
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=Customers}"/>
......something else you want display
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
How can I specify datasource for a user control:
<ScrollViewer VerticalScrollBarVisibility="Visible" VerticalAlignment="Stretch">
<ListBox ItemsSource="{Binding}">
<ListBox.ItemTemplate>
<DataTemplate>
<local:ucMyControl />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</ScrollViewer>
How ucMyControl know what values to take? I realize that lisbox will create as many ucMyControls as there are items in bondong collection?
Also, scrollviewers don't work - I can't get to 3rd control (they are all empty anyway, but I hope you'll give me leads how to bind it).
The control that is instantiated from an ItemTemplate in an ItemsControls (e.g. ListBox) has its DataContext property automatically set to the appropriate item from the Items or ItemsSource collection of the ItemsControl.
So if you for example have a collection of Person objects with properties FirstName and LastName as ListBox items you can bind like this in your UserControl:
<UserControl ...>
<StackPanel>
<TextBlock Text="{Binding Path=FirstName}"/>
<TextBlock Text="{Binding Path=LastName}"/>
</StackPanel>
</UserControl>
You do not need to set the DataContext property explicitly.
I want to achieve the following:
My ViewModel exposes a property named 'Categories' which is a collection of CategoryViewModel objects
Each CategoryViewModel object exposes a property called 'Items' which is a collection of strings*.
On my View, I want a TabControl with a TabItem for each object in the 'Categories' collection.
The Content of each TabItem should be a xceed DataGrid control displaying the contents of the selected tab's Items collection.
<TabControl ItemsSource="{Binding Categories}">
<TabControl.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding CategoryName}" />
</DataTemplate>
</TabControl.ItemTemplate>
<TabControl.ContentTemplate>
<DataTemplate>
<xcdg:DataGridControl
ItemsSource="{Binding Items}"
AutoCreateColumns="True">
</xcdg:DataGridControl>
</DataTemplate>
</TabControl.ContentTemplate>
</TabControl>
This works ok when I bind directly to the ItemsSource property of the DataGridControl. However, in order to utilize all of the functionality of the DataGridControl, I need to bind the ItemsSource property of the DataGridControl to a DataGridCollectionViewSource object that is bound to my Items collection. I do this when the grid ISN'T nested in another control by creating a DataGridCollectionViewSource object in the Resources section of the UserControl and binding to that.
<UserControl>
<UserControl.Resources>
<xcdg:DataGridCollectionViewSource x:Key="GridData"
Source="{Binding Items}" />
</UserControl.Resources>
<Grid>
<xcdg:DataGridControl
ItemsSource="{Binding Source={StaticResource GridData}}"
AutoCreateColumns="True">
</xcdg:DataGridControl>
</Grid>
</UserControl>
How do I need to structure the XAML so that when the TabControl is being bound, a DataGridCollectionViewSource object is created for each TabItem so that the DataGridControl that is generated within the content of the TabItem can be bound to it?
Clear as mud, right? :)
Thanks!
Notes:
*In the real solution the collection contains objects of a class that is more complex than a simple string, but a string was used to make the example more simple.
OK, this is a bit of a long-shot, but could you use the DataGrid.Tag ...
<TabControl.ContentTemplate>
<DataTemplate>
<xcdg:DataGridControl
ItemsSource="{Binding RelativeSource={RelativeSource Self}, Path=Tag}"
AutoCreateColumns="True">
<xcdg:DataGridControl.Tag>
<xcdg:DataGridCollectionViewSource x:Key="GridData"
Source="{Binding Items}" />
</xcdg:DataGridControl.Tag>
</xcdg:DataGridControl>
</DataTemplate>
</TabControl.ContentTemplate>
Or ... resources can be defined on any FrameworkElement, so you could try:
<TabControl.ContentTemplate>
<DataTemplate>
<xcdg:DataGridControl
ItemsSource="{Binding Source={StaticResource GridData}}"
AutoCreateColumns="True">
<xcdg:DataGridControl.Resources>
<xcdg:DataGridCollectionViewSource x:Key="GridData"
Source="{Binding Items}" />
</xcdg:DataGridControl.Resources>
</xcdg:DataGridControl>
</DataTemplate>
</TabControl.ContentTemplate>
I don't use the eXceed Grid so cannot test whether these work - just a couple of ideas to try!
Colin E.
You can use x:Shared="True" attribute on a resource. That means a new instance is created for every use of that resource.
Example:
<UserControl.Resources>
<xcdg:DataGridCollectionViewSource x:Key="GridData"
x:Shared="False"
Source="{Binding Items}" />
</UserControl.Resources>
<UserControl.Resources>
<DataTemplate x:Key="LstBoxTemplate">
<TextBlock Text="{Binding Item}" TextWrapping="Wrap" HorizontalAlignment="Left"/>
<Image Grid.Column="2" Margin="0,0,10,0" Visibility="{Binding isVisible,Converter={StaticResource ImageCtlVisibilityConverter}}" Source="/pjct;component/Images/im.png"/>
</DataTemplate>
</UserControl.Resources>
<ListBox x:Name=lstbox ItemsSource="{Binding itemList}" ItemTemplate="{StaticResource LstBoxTemplate}" />
You question needs more detail, and so I may be missing the point...
If your listbox is bound to a collection of custom objects that you control (aka a view model). Then it should be fairly straight forward for you to add a property to the view model that contains the object that you want to bind your listboxitem to...
I have a ListBox that contains a textbox and a combobox in its datatemplate:
<ListBox Height="147" Margin="158,29,170,0" Name="PitcherListBox" VerticalAlignment="Top" ItemsSource="{Binding SomeCollectionOfObjects}" Background="Black">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBox Text="{Binding Path=Name}" />
<ComboBox ItemsSource="{Binding LocalArrayOfIntsProperty}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
I want to bind the listbox to a collection of objects (which I've done successfully), but I want the combobox in the above datatemplate to have its itemssource set to a local property on the window (array of ints). I still want the combobox to have a two-way bind between its selected item and a property on the collection of objects...
I have the following in code:
PitcherListBox.DataContext = this;
Basically in the end, I want the combobox within the listbox to have a different itemssource than the listbox itself. I can't seem to figure out how to change the ComboBox's ItemsSource in XAML. Can someone provide me some feedback? Thanks!
Try this:
<ComboBox ItemsSource="{Binding LocalArrayOfIntsProperty, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type YourWindowTypeHere}}}" />
Note that you need to replace YourWindowTypeHere with the type of the Window containing the LocalArrayOfIntsProperty! Also remember that you will need to define an xml namespace for that type!