Image flickering in WP7 ListBox - listbox

Question

I'm trying to display a list of images embedded in my asssembly in a ListBox. I can get the images to display using a converter, but rather than loading, then staying still, they constantly reload from the assembly causing them to flicker. I'm using the same Converter to load the icons in various other places around my app but this problem does not occur- it seems to be cause by the lisbox somehow. I've tried removing the VisualStates and switching the CreateOption for the Bitmap image which the converter returns, but I get the same result. I'm fairly sure this didn't happen on WP7.0, only 7.1.
The style is:
<Style x:Key="SnapshotList" TargetType="ListBox">
<Setter Property="Margin" Value="2" />
<Setter Property="BorderThickness" Value="1"/>
<!--<Setter Property="Background" Value="{StaticResource WindowBackgroundBrush}" />
<Setter Property="BorderBrush" Value="{StaticResource PhoneBorderBrush}" />-->
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled"/>
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
<!--Setter Property="OverridesDefaultStyle" Value="True"/-->
<Setter Property="ItemTemplate" Value="{StaticResource SnapshotTemplate}"/>
<Setter Property="ItemsPanel">
<Setter.Value>
<ItemsPanelTemplate>
<Controls:WrapPanel HorizontalAlignment="Stretch" VerticalAlignment="Top"/>
<!--<WP7:BindingHelper.Binding>
<WP7:RelativeSourceBinding Path="(FrameworkElement.ActualWidth)" TargetProperty="Width"
RelativeMode="FindAncestor"
AncestorType="ScrollContentPresenter" />
</WP7:BindingHelper.Binding>-->
<!--</Controls:WrapPanel>-->
</ItemsPanelTemplate>
</Setter.Value>
</Setter>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBox">
<Border Name="Border" Background="{TemplateBinding Background}" BorderThickness="{TemplateBinding BorderThickness}"
BorderBrush="{StaticResource PhoneBorderBrush}" CornerRadius="2">
<ScrollViewer Margin="0">
<ItemsPresenter/>
</ScrollViewer>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
The listbox in question:
<ListBox x:Name="lstIcon" ItemsSource="{Binding AvailableIcons}" SelectedItem="{Binding Recipe.Icon,Mode=TwoWay}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" SelectionMode="Single"
Style="{StaticResource SnapshotList}">
<ListBox.ItemTemplate>
<DataTemplate>
<Border Background="Transparent" MinWidth="30" MinHeight="30" Margin="3" Padding="3">
<Image Source="{Binding Converter={StaticResource IconConverter}, ConverterParameter=32}" Stretch="None" MinWidth="30" MinHeight="30" />
</Border>
</DataTemplate>
</ListBox.ItemTemplate>
The converter:
public class IconConverter : IValueConverter
{
private static IEnumerable<string> _names;
private static IEnumerable<string> ResourceNames {
get {
if (_names == null) {
_names = WP7Utils.GetResourcePaths(Assembly.GetExecutingAssembly()).Select(p=>System.Convert.ToString(p)).ToList();
}
return _names;
}
}
public object Convert(object value, Type targetType, object parameter, CultureInfo culture) {
string baseFilename = (value ?? Shared.Constants.DefaultIcon).ToString().Trim();
string size = (parameter ?? "32").ToString();
try {
BitmapImage img = new BitmapImage();
using (var store = IsolatedStorageFile.GetUserStoreForApplication()) {
string fileName = string.Format("{0}_{1}.png", baseFilename, size);
img = ResourceHelper.GetBitmap("Resources/types/" + fileName, "MyAssembly");
}
return img;
} catch (Exception ex) {
Console.WriteLine(string.Format("Error loading image {0} ({1}px): {2}", baseFilename, size, ex.Message));
}
return value;
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) {
throw new NotImplementedException();
}
}

Answer 1

This was caused by specifying the MinHeight and MinWidth in the DataTemplate for the ListBox. Removing the attributes fixed the problem.

Answer 2

You should also set the caching on the caching on the image to BitmpaCache to prevent the need for the framework to need to reload/redraw the image.