Блог

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

Спасибо

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

 <ListBox Name="lstBoxMyRecentPhotos"
                                         MaxHeight="650"
                                         Margin="0,8,0,0"
                                         SelectionChanged="lstImageList_SelectionChanged">
                                    <ListBox.ItemsPanel>
                                        <ItemsPanelTemplate>
                                            <toolkit1:VariableSizedWrapGrid ItemHeight="200" ItemWidth="230" />
                                        </ItemsPanelTemplate>
                                    </ListBox.ItemsPanel>

                                    <ListBox.ItemTemplate>
                                        <DataTemplate>

                                            <Border Name="brdr"
                                                    Margin="5"
                                                    BorderBrush="White"
                                                    BorderThickness="3">
                                                <Border.Background>
                                                    <ImageBrush ImageSource="Images/capsule_image_holder.png" Stretch="Uniform" />
                                                </Border.Background>
                                                <Image Width="{Binding width}"
                                                       Height="{Binding height}"
                                                       Hold="imgRecent_Hold"
                                                       Source="{Binding photoUrl}"
                                                       Stretch="UniformToFill">

                                                </Image>
                                            </Border>

                                        </DataTemplate>
                                    </ListBox.ItemTemplate>

                                </ListBox>
 

Два способа

1. Сделайте так, чтобы изображение всегда растягивалось UniformToFill и использовало жестко заданный размер — таким образом, оно будет равномерно заполнять отведенное ему пространство, и все фотографии будут хорошо использовать данное пространство
2. Используйте VariableSizedWrapGrid.

Предоставляет панель макета в стиле сетки, где каждая плитка / ячейка может иметь переменный размер в зависимости от содержимого. Аналогично WinRT VariableSizedWrapGrid.

Я не знаю, какой инструментарий вы используете для VariableSizedWrapGrid, но вы уверены, что вам нужно установить его ItemHeight? Что произойдет, если вы этого не сделаете?

Я лично использую элементы управления Telerik, чтобы создать сетку-оболочку. Если у вас есть доступ к их элементам управления, я могу поделиться примером.

Вот как выглядит моя реализация: