How Do I Bind a "selected Item" in a Listbox to a ItemsControl in WPF?
- by Scott
LowDown: I am trying to create a Document Viewer in WPF. It will allow the user to preview selected documents and if they want, compare the documents in WPF. So they can view them side by side.
The layout is this: Left side is a full list box. On the right side is a Collection or an Items control. Inside the items control will be a collection of the "selected documents" in the list box. So A user can select multiple items in the list box and for each new item they select, they can add the item to the collection on the right. I want the collection to look like a image gallery that shows up in Google/Bing Image searches. Make sense?
The problem I am having is I can't get the WPFPreviewer to bind correctly to the selected item in the list box under the itemscontrol.
Side Note: The WPFPreviewer is something Micorosft puts out that allows us to preview documents. Other previewers can be built for all types of documents, but im going basic here until I get this working right.
I have been successful in binding to the list box WITHOUT the items control here:
<Window.Resources>
<DataTemplate x:Key="listBoxTemplate">
<StackPanel Margin="3" >
<DockPanel >
<Image Source="{Binding IconURL}" Height="30"></Image>
<TextBlock Text=" " />
<TextBlock x:Name="Title" Text="{Binding Title}"
FontWeight="Bold" />
<TextBlock x:Name="URL" Visibility="Collapsed"
Text="{Binding Url}"/>
</DockPanel>
</StackPanel>
</DataTemplate>
</Window.Resources>
<Grid Background="Cyan">
<ListBox HorizontalAlignment="Left"
ItemTemplate="{StaticResource listBoxTemplate}" Width="200"
AllowDrop="True" x:Name="lbDocuments"
ItemsSource="{Binding Path=DocumentElements,ElementName=winDocument}"
DragEnter="documentListBox_DragEnter" />
<l:WPFPreviewHandler
Content="{Binding ElementName=lbDocuments, Path=SelectedItem.Url}"/>
</Grid>
Though, once I add in the ItemsControl, I can't get it to work anymore:
<Window.Resources>
<DataTemplate x:Key="listBoxTemplate">
<StackPanel Margin="3" >
<DockPanel >
<Image Source="{Binding IconURL}" Height="30"></Image>
<TextBlock Text=" " />
<TextBlock x:Name="Title" Text="{Binding Title}" FontWeight="Bold" />
<TextBlock x:Name="URL" Visibility="Collapsed" Text="{Binding Url}"/>
</DockPanel>
</StackPanel>
</DataTemplate>
</Window.Resources>
<Grid>
<ListBox HorizontalAlignment="Left"
ItemTemplate="{StaticResource listBoxTemplate}" Width="200"
AllowDrop="True" x:Name="lbDocuments"
ItemsSource="{Binding Path=DocumentElements,ElementName=winDocument}"
DragEnter="documentListBox_DragEnter" />
<ItemsControl x:Name="DocumentViewer"
ItemsSource="{Binding ElementName=lbDocuments, Path=SelectedItem.Url}" >
<ItemsControl.ItemTemplate>
<DataTemplate>
<Grid Background="Cyan">
<l:WPFPreviewHandler Content="{Binding Url}"/>
</Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</Grid>
Can someone please help me out with trying to bind to the ItemsControl if I select one or even multiple items in the listbox.
