отображение изображений в списке, поэтому размер изображения изменяется в зависимости от родительского контейнера

У меня есть расширитель со списком, в котором отображаются миниатюры изображений. Я хочу, чтобы размеры изображений соответствовали размеру списка, а размер списка был основан на ширине расширителя. Когда я расширяю расширитель, я хочу, чтобы список и изображения также изменялись. Кто-нибудь знает, как я могу это сделать?

   <Expander
            Style="{DynamicResource ExpanderStyle}"
            Name="pictureExpander"
            IsExpanded="True"                
            ExpandDirection="Left"
            Collapsed="pictureExpander_Collapsed"
            Expanded="pictureExpander_Expanded"
            Grid.Column="4">
            <ListBox 
                Name="photoList" 
                ItemsSource="{Binding Source={StaticResource PhotoBin}}"
                IsSynchronizedWithCurrentItem="True"
                HorizontalAlignment="Stretch"
                ScrollViewer.CanContentScroll="False">
                <ListBox.ItemContainerStyle>
                    <Style TargetType="{x:Type ListBoxItem}">
                        <Style.Resources>
                            <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Yellow" />
                        </Style.Resources>
                        <Style.Triggers>
                            <Trigger Property="IsSelected" Value="True">
                                <Setter Property="BorderBrush" Value="Black"/>
                                <Setter Property="BorderThickness" Value="5"/>
                            </Trigger>
                        </Style.Triggers>
                    </Style>
                </ListBox.ItemContainerStyle>
                <ListBox.ItemTemplate>
                    <DataTemplate>
                        <Image 
                            Source="{Binding FileLocation}"
                            Margin="0,5"
                            HorizontalAlignment="Stretch"
                            MouseLeftButtonDown="DragImage" />
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>
        </Expander>

person MBU    schedule 22.12.2010    source источник


Ответы (1)


с помощью свойства «Растянуть» на вашем изображении:

<Image 
     Source="{Binding FileLocation}"
     Margin="0,5"
     MouseLeftButtonDown="DragImage"
     Stretch="Uniform"
     StretchDirection="Both"/>

вы можете поиграть со значениями, чтобы получить желаемый эффект:

http://msdn.microsoft.com/en-en/library/system.windows.controls.image.stretch.aspx

http://msdn.microsoft.com/en-en/library/system.windows.controls.image.stretchdirection.aspx

http://msdn.microsoft.com/en-us/library/system.windows.media.stretch.aspx

http://msdn.microsoft.com/en-us/library/system.windows.controls.stretchdirection.aspx

person David    schedule 22.12.2010
comment
Мне удалось заставить его изменить размер, когда я манипулирую расширителем, но проблема теперь в том, что когда приложение отображает изображения, они отображаются в полном размере. Как бы я получил, чтобы он изначально имел ширину около 200 пикселей? - person MBU; 22.12.2010
comment
хм ... Я не думаю, что вы можете принудительно изменить размер и исходную ширину. потому что, если вы установите исходную ширину, она больше не будет адаптироваться к ширине родителя. В зависимости от эффекта, которого вы хотите достичь, вы можете поиграть с maxWidth/minWidth на вашем изображении и/или в stretchDirection, но я не уверен, что вы сможете это сделать. - person David; 23.12.2010