WPF: Как создать панель управления пользовательскими элементами? - PullRequest
Новая
       14

WPF: Как создать панель управления пользовательскими элементами?

5 голосов
/ 27 декабря 2010

Я хочу спроектировать панель управления пользовательскими элементами для ListBox. Есть 3 требования:

  1. Он должен иметь свойства int rows и int columns, которые будут определять матрицу ячеек, из которых состоит панель. Вот как должна выглядеть панель (цвета не имеют значения, я просто хотел показать, что панель состоит из 12 пустых ячеек в матрице 3х4): alt text

  2. Если количество элементов в элементе управления меньше, чем количество определенных ячеек, все ячейки должны быть нарисованы. Например. если в матрице 3х4, показанной на рисунке, нужно разместить только 4 элемента, следует нарисовать все ячейки, и только 4 из них должны содержать элементы.

  3. Должно быть возможно установить, в какой ячейке будет размещаться какой элемент, посредством некоторой привязки данных. Например, допустим, у меня был список людей. Этот список содержит элементы типа Person, а класс Person содержит два свойства X и Y. Я должен иметь возможность привязывать данные X к row ячейки и Y к column ячейки, что позволяет мне самому определять, какая ячейка на панели будет содержать какого человека из списка.

Если создание панели управления предметами не имеет смысла, пожалуйста, порекомендуйте, что было бы лучше. Честно говоря, я озадачен тем, как вообще начать с этим. Спасибо за помощь. Ура!

1 Ответ

1 голос
/ 30 декабря 2010

Полезной стратегией для решения этой проблемы является манипулирование исходными данными в формате, более подходящем для использования ItemsControl. Например, двумерный массив элементов или линейный набор элементов, которые содержат свои собственные двумерные координаты, трудно использовать.

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

Вот пример 2x2, чтобы показать вам, что я имею в виду: 

<Grid>
    <Grid.Resources>
        <coll:ArrayList x:Key="sampleData">
            <x:Array Type="sys:String">
                <sys:String>1</sys:String><sys:String>2</sys:String>
            </x:Array>
            <x:Array Type="sys:String">
                <sys:String>3</sys:String<sys:String>4</sys:String>
            </x:Array>
        </coll:ArrayList>
    </Grid.Resources>
    <ItemsControl ItemsSource="{StaticResource sampleData}">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <StackPanel/>
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <ItemsControl ItemsSource="{Binding}">
                    <ItemsControl.ItemsPanel>
                        <ItemsPanelTemplate>
                            <StackPanel Orientation="Horizontal"/>
                        </ItemsPanelTemplate>
                    </ItemsControl.ItemsPanel>
                    <ItemsControl.ItemTemplate>
                        <DataTemplate>
                            <Border BorderBrush="Black" BorderThickness="1" Width="50" Height="50">
                                <TextBlock Text="{Binding}"/>
                            </Border>
                        </DataTemplate>
                    </ItemsControl.ItemTemplate>
                </ItemsControl>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</Grid>

, который производит: 

+---+---+
| 1 | 2 |
+---+---+
| 3 | 4 |
+---+---+
...