связывание большего количества элементов в одном ряду сетки - PullRequest
Новая
       3

связывание большего количества элементов в одном ряду сетки

0 голосов
/ 22 декабря 2011

Я хочу иметь 5 столбцов и связать список элементов. Каждый элемент имеет изображение. Я хочу отобразить изображение 5 элементов в одной строке.

На самом деле это мой код 

<ListBox ItemsSource="{Binding Buildings}" Width="350" Margin="0,5,0,10">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal" CanHorizontallyScroll="True">
                <!--<TextBlock Padding="5,0,5,0" Text="{Binding Name}" />-->
                <Image Source="{Binding Name,Converter={StaticResource CivToImage}}" Height="50px" Width="50px"/>
            </StackPanel>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

Я также хочу предоставить информацию, такую ​​как Имя (Buildings.Name) и Затраты (Buildings.Costs) с помощью всплывающей подсказки.

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

<DataGrid ItemsSource="{Binding Buildings}">
    <DataGrid.Columns>
        <DataGridTemplateColumn Header="Name" Width="SizeToCells" IsReadOnly="True">
            <DataGridTemplateColumn.CellTemplate>
                <DataTemplate>
                    <Image Source="{Binding Name,Converter={StaticResource CivToImage}}" Height="50px" Width="50px"/>
                </DataTemplate>
            </DataGridTemplateColumn.CellTemplate>
        </DataGridTemplateColumn>
    </DataGrid.Columns>
</DataGrid>

Спасибо за вашу помощь.

1 Ответ

0 голосов
/ 22 декабря 2011

Когда вы используете сетку, как: 

<Grid>
    <Image Name ="Image1" Source="{Binding Name,Converter={StaticResource CivToImage}}"  Height="50px" Width="50px"/>
    <Image Name ="Image2" Source="{Binding Name,Converter={StaticResource CivToImage}}" Height="50px" Width="50px"/>
</Grid>

Все элементы будут расположены в 0,0, так что вы увидите только один, который будет сверху. Вы можете расположить эти изображения так, как будто первое - это 0,0 секунды, в данном случае 50 пикселей, 0.

Но я думаю, что лучшим способом было бы добавить: 

<StackPanel Orientation="Horizontal">
    <Image Name ="Image1" Source="{Binding Name,Converter={StaticResource CivToImage}}" Height="50px" Width="50px"/>
    <Image Name ="Image2" Source="{Binding Name,Converter={StaticResource CivToImage}}" Height="50px" Width="50px"/>
 </StackPanel>

Это поместит все ваши предметы рядом друг с другом. Надеюсь, что это так, потому что я не уверен на 100%, что понял проблему.

...