nabulke
nabulke

Reputation: 11275

Use all available space with ListBox and a StackPanel as ItemsPanelTemplate

I use a ListBox to show the contents of an ObservableCollection in my view. In my simplified example, I just use an image for each item like that:

<Window>
    <Window.Resources>
        <DataTemplate DataType="{x:Type viewModel:HealthCriterionViewModel}">
            <Image VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Source="Optionsh.png" Stretch="Fill" />
        </DataTemplate>
    </Window.Resources>

    <ListBox ItemsSource="{Binding HealthCriteria}" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch">
        <ListBox.ItemsPanel>
            <ItemsPanelTemplate>
                <StackPanel Orientation="Vertical" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
            </ItemsPanelTemplate>
        </ListBox.ItemsPanel>
    </ListBox>
</Window>

HealthCriteria is a collection of type HealthCriterionViewModel.

What I get is this:

enter image description here

What I want is this (stretch images to use all available space both vertically and horizontally):

enter image description here

How can I achieve this?

Upvotes: 2

Views: 90

Answers (1)

Valera Scherbakov
Valera Scherbakov

Reputation: 488

I suggest you can't achieve it with ItemsControl. Because contents presenter size is not fixed, it's scrollable area. So size of each element should be fixed. It can be limited directly in ItemsPanel with "Weight" or "Height" (depends on orientation) properties or limited by content size.

Upvotes: 1

Related Questions