In my listView, I'm loading images and it's name; it works. Then I decided to add a GridViewColumn to make it more proper & let the user to delete(delete from Listbox & from source) & editI images by button click.
After adding the GridViewColumn in the ListView, I don't any images. The error message is `System.Window.Media.Imaging.UnmanagedBitmapWrapper`
How can I display the images? & How can i delete the Image during button click? Thank you very much.
Original ListView Xaml Code:
<ListView x:Name="ListViewImage" Width="Auto" SelectedItem="{Binding ImageFileName}" Grid.Row="0" ItemsSource="{Binding Path=AllImages}" Margin="0,10,0,0" VirtualizingStackPanel.IsVirtualizing="True" VirtualizingStackPanel.VirtualizationMode= "Recycling" Height="333" VerticalAlignment="Top"><ListView.ItemTemplate><DataTemplate><DataTemplate.Resources><Storyboard x:Key="WaitingTimeline" Timeline.DesiredFrameRate="10"><DoubleAnimationUsingKeyFrames BeginTime="00:00:00" RepeatBehavior="Forever" Storyboard.TargetName="WaitingImage" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0] .(RotateTransform.Angle)"><SplineDoubleKeyFrame KeyTime="00:00:00" Value="-15"/><SplineDoubleKeyFrame KeyTime="00:00:03" Value="15"/></DoubleAnimationUsingKeyFrames></Storyboard></DataTemplate.Resources><StackPanel Orientation="Horizontal" Height="150"><Border Padding="1" Margin="4" Background="PaleGoldenrod" BorderBrush="#22000000" BorderThickness="1"><Image x:Name="ThumbnailImage" Margin="2" Visibility="Collapsed" Height="130" Width="130" HorizontalAlignment="Center" Stretch="Uniform" Source="{Binding Path=Thumbnail}" ><Image.ToolTip><Border Margin="10" BorderBrush="DarkGray" BorderThickness="2,2,2,2" CornerRadius="10,10,10,10"><StackPanel Orientation="Vertical" Margin="5" Visibility="Visible"><Image Source="{Binding Thumbnail}" Stretch="Uniform" HorizontalAlignment="Center" Height="140" Width="140"></Image></StackPanel></Border></Image.ToolTip></Image></Border><Image x:Name="WaitingImage" Visibility="Visible" Height="20" Width="20" Source="./Hourglass.png"><Image.RenderTransform><TransformGroup><RotateTransform Angle="0" CenterX="10" CenterY="10"/></TransformGroup></Image.RenderTransform></Image><TextBlock Margin="10,50,0,0" FontStyle="Italic" FontWeight="SemiBold" FontSize="15" Foreground="#1432AA" Text="{Binding Path=ShortName}" /></StackPanel><DataTemplate.Triggers><DataTrigger Binding="{Binding Path=IsLoaded}" Value="True"><Setter Property="Visibility" TargetName="ThumbnailImage" Value="Visible"/><Setter Property="Visibility" TargetName="WaitingImage" Value="Collapsed"/></DataTrigger><DataTrigger Binding="{Binding Path=IsLoaded}" Value="False"><Setter Property="Visibility" TargetName="WaitingImage" Value="Visible"/><Setter Property="Visibility" TargetName="ThumbnailImage" Value="Collapsed"/><DataTrigger.EnterActions><BeginStoryboard x:Name="WaitingTimeline_BeginStoryboard" Storyboard="{StaticResource WaitingTimeline}"/></DataTrigger.EnterActions><DataTrigger.ExitActions><StopStoryboard BeginStoryboardName="WaitingTimeline_BeginStoryboard"/></DataTrigger.ExitActions></DataTrigger></DataTemplate.Triggers></DataTemplate></ListView.ItemTemplate></ListView>
SS:
After adding the GridViewColumn , the XAML Code:
<ListView x:Name="ListViewImage" Width="Auto" SelectedItem="{Binding ImageFileName}" Grid.Row="0" ItemsSource="{Binding Path=AllImages}" Margin="0,10,0,0" VirtualizingStackPanel.IsVirtualizing="True" VirtualizingStackPanel.VirtualizationMode= "Recycling" Height="333" VerticalAlignment="Top"><ListView.ItemTemplate><DataTemplate><DataTemplate.Resources><Storyboard x:Key="WaitingTimeline" Timeline.DesiredFrameRate="10"><DoubleAnimationUsingKeyFrames BeginTime="00:00:00" RepeatBehavior="Forever" Storyboard.TargetName="WaitingImage" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0] .(RotateTransform.Angle)"><SplineDoubleKeyFrame KeyTime="00:00:00" Value="-15"/><SplineDoubleKeyFrame KeyTime="00:00:03" Value="15"/></DoubleAnimationUsingKeyFrames></Storyboard></DataTemplate.Resources><StackPanel Orientation="Horizontal" Height="150"><Border Padding="1" Margin="4" Background="PaleGoldenrod" BorderBrush="#22000000" BorderThickness="1"><Image x:Name="ThumbnailImage" Margin="2" Visibility="Collapsed" Height="130" Width="130" HorizontalAlignment="Center" Stretch="Uniform" Source="{Binding Path=Thumbnail}" ><Image.ToolTip><Border Margin="10" BorderBrush="DarkGray" BorderThickness="2,2,2,2" CornerRadius="10,10,10,10"><StackPanel Orientation="Vertical" Margin="5" Visibility="Visible"><Image Source="{Binding Thumbnail}" Stretch="Uniform" HorizontalAlignment="Center" Height="140" Width="140"></Image></StackPanel></Border></Image.ToolTip></Image></Border><Image x:Name="WaitingImage" Visibility="Visible" Height="20" Width="20" Source="./Hourglass.png"><Image.RenderTransform><TransformGroup><RotateTransform Angle="0" CenterX="10" CenterY="10"/></TransformGroup></Image.RenderTransform></Image><TextBlock Margin="10,50,0,0" FontStyle="Italic" FontWeight="SemiBold" FontSize="15" Foreground="#1432AA" Text="{Binding Path=ShortName}" /></StackPanel><DataTemplate.Triggers><DataTrigger Binding="{Binding Path=IsLoaded}" Value="True"><Setter Property="Visibility" TargetName="ThumbnailImage" Value="Visible"/><Setter Property="Visibility" TargetName="WaitingImage" Value="Collapsed"/></DataTrigger><DataTrigger Binding="{Binding Path=IsLoaded}" Value="False"><Setter Property="Visibility" TargetName="WaitingImage" Value="Visible"/><Setter Property="Visibility" TargetName="ThumbnailImage" Value="Collapsed"/><DataTrigger.EnterActions><BeginStoryboard x:Name="WaitingTimeline_BeginStoryboard" Storyboard="{StaticResource WaitingTimeline}"/></DataTrigger.EnterActions><DataTrigger.ExitActions><StopStoryboard BeginStoryboardName="WaitingTimeline_BeginStoryboard"/></DataTrigger.ExitActions></DataTrigger></DataTemplate.Triggers></DataTemplate></ListView.ItemTemplate><ListView.View><GridView><GridViewColumn Header="Image" DisplayMemberBinding="{Binding Path=Thumbnail}"/><GridViewColumn Header="Image Name" DisplayMemberBinding="{Binding Path=ShortName}"/><GridViewColumn Header="Delete" Width="150"><GridViewColumn.CellTemplate><DataTemplate><Button Content="Delete" Foreground="#1432AA" Cursor="Hand" Width="100" Click="Button_Click" /></DataTemplate></GridViewColumn.CellTemplate></GridViewColumn><GridViewColumn Header="Edit" Width="150"><GridViewColumn.CellTemplate><DataTemplate><Button Content="Edit" Foreground="#1432AA" Cursor="Hand" Width="100" /></DataTemplate></GridViewColumn.CellTemplate></GridViewColumn></GridView></ListView.View> ></ListView>
SS:
I have a function to delete which deleted the selected listItem. How can i adapt this for the GridViewColumn cell Button?
ImageFileCollectionViewModel viewModel = ListViewImage.DataContext as ImageFileCollectionViewModel; if (viewModel != null) { ImageFileViewModel image = ListViewImage.SelectedItem as ImageFileViewModel; if (image != null) { //remove physical file from disk: File.Delete(image.FileName); //remove item from ObservableCollection: viewModel.AllImages.Remove(image); } }