Displaying images in grid with WPF
13,463
You could use a ListBox
that has a WrapPanel
for its panel type, then use a DataTemplate that uses an Image
element for the icon and a TextBlock for their caption.
EG:
public class MyItemType
{
public byte[] Icon { get; set; }
public string Title { get; set; }
}
In window.xaml.cs:
public List<MyItemType> MyItems { get; set; }
public Window1()
{
InitializeComponent();
MyItems = new List<MyItemType>();
MyItemType newItem = new MyItemType();
newItem.Image = ... load BMP here ...;
newItem.Title = "FooBar Icon";
MyItems.Add(newItem);
this.MainGrid.DataContext = this;
}
When loading the icon, refer to Microsoft's Imaging Overview since there are a lot of ways to do it.
Then in window.xaml:
<Window x:Class="MyApplication.Window1"
xmlns:local="clr-namespace:MyApplication"
>
<Window.Resources>
<DataTemplate DataType="{x:Type local:MyItemType}">
<StackPanel>
<Image Source="{Binding Path=Icon}"/>
<TextBlock Text="{Binding Path=Title}"/>
</StackPanel>
</DataTemplate>
</Window.Resources>
<Grid Name="MainGrid">
<ListBox ItemsSource="{Binding Path=MyItems}">
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel IsItemsHost="True"/>
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
</ListBox>
</Grid>
Author by
Eliazar
Updated on June 04, 2022Comments
-
Eliazar almost 2 years
I'm creating an application with a store inside of it, so I need a grid view for items' icons with text. iTunes gives a good example of what I need. Any ideas?