Read this article in your language IT | EN | DE | ES
Lets flex our WPF Muscles and figure out how to render a list of Images:
1: <ListBox Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2" Name="ImagePanel" ScrollViewer.HorizontalScrollBarVisibility="Disabled">
2: <ListBox.ItemsPanel>
3: <ItemsPanelTemplate>
4: <WrapPanel />
5: </ItemsPanelTemplate>
6: </ListBox.ItemsPanel>
7: <ListBox.ItemTemplate>
8: <DataTemplate>
9: <TextBlock Text="{Binding ContextKey}" Width="100" />
10: </DataTemplate>
11: </ListBox.ItemTemplate>
12: </ListBox>
Notice, The System.Windows.DataTemplate requires us to set the width on the item in order to allow ‘line breaks’ where we want them. Otherwise, we will just get a ton of items running off the view.
The above code manufactures this view:
There are a few theories about using System.Windows.Data.RelativeSource to target the WrapPanel’s Width:
1: <ListBox.ItemsPanel>
2: <ItemsPanelTemplate>
3: <WrapPanel Width="{Binding ActualWidth,
4: RelativeSource={RelativeSource Mode=FindAncestor,
5: AncestorType={x:Type ScrollContentPresenter}, AncestorLevel=1}}" />
6: </ItemsPanelTemplate>
7: </ListBox.ItemsPanel>
Be the first to rate this post
- Currently 0/5 Stars.
- 1
- 2
- 3
- 4
- 5