Основы основ любого WPF проекта, это XAML и привязки, если вы их игнорируете, то у вас будет не проект, а каша, которую будет трудно развивать дальше, трудно поддерживать, и она даже будет медленней работать.
Задаем DataContext
- это некое свойство контрола или окна, которое отвечает за то, от куда будут забираться данные для привязок. В нашем случае, мы делаем простой пример, без каких либо правил и прочего, а значит смело пишем в конструкторе MainWindow
, после InitializeComponent();
строку DataContext = this;
.
Теперь нам нужна коллекция, которая будет хранить наши символы. Так, как у нас некая "матрица", то нам нужна коллекция с вложенной коллекцией. Если вы работаете с привязками, то для оповещения UI об изменении данных в коллекции, она должна реализовать интерфейс INotifyCollectionChanged
, без него, если вы добавите/удалите что либо из коллекции, в UI вы это не увидите. Стандартными такими коллекциями в WPF являются ObservableCollection<>
и BindingList<>
, возьмем с вами первую. Также привязки доступны только к публичным свойствам, это тоже надо учитывать! В итоге, делаем в классе окна свойство:
public ObservableCollection<ObservableCollection<char>> Chars { get; set; }
Далее надо заполнить эту коллекцию, тут уж сами возитесь как надо, но дам подсказку, если вы хотите потом собирать слова, то надо как минимум из списка слов брать все символы, а потом уже на их основе, случайно все расставлять, но это уже на вашей совести) Я пока возьму ваш код генерации и просто грубо переделаю его под коллекцию. В итоге весь наш код окна выглядит так:
public partial class MainWindow : Window
{
public ObservableCollection<ObservableCollection<char>> Chars { get; set; }
public MainWindow()
{
InitializeComponent();
DataContext = this;
Random rchar = new Random();
Chars = new();
for (int x = 0; x < 10; x++)
{
Chars.Add(new());
for (int y = 0; y < 10; y ++)
{
Chars[x].Add((char)rchar.Next(65, 91));
}
}
}
}
Все очень просто, да?)
Имея данные, мы можем теперь делать UI. Что нам нужно? Хм, нам нужны кнопки, которые будут размещаться по столбцам и рядам, можем поступить как с коллекцией (коллекция внутри коллекции)? Да, можем, давайте сделаем:
<ItemsControl ItemsSource="{Binding Chars}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<ItemsControl ItemsSource="{Binding}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal" />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Button
Width="30"
Height="30"
Margin="3"
Content="{Binding}" />
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
Тут интересно может быть следующее:
{Binding}
- это привязка, через которую мы задаем то свойство, которое нас интересует в классе, указанным как DataContext
, без обозначения свойства мы привязываемся к объекту, а не к его свойству.
ItemTemplate
- так мы переопределяем вид на нужный нам, где в первом случае мы задаем ItemsControl
, а во втором видом у нас является простая кнопка.
ItemsPanel
- задаем другую панель, которая разместит наши объекты не снизу вверх, а в один ряд.
Результатом у нас будет такое:

Спросите теперь как кликнуть и узнать, что за кнопка?
Когда вы привязываетесь, и хотите все сделать грамотно, то лучше использовать ICommand
, ибо они для привязок и созданны. Но так, как вы новичек, лишним вас грузить не буду, а значит для нас подойдут простые Click
события.
Пишем у кнопки в XAML Click="Button_Click"
В коде окна пишем обработчик:
private void Button_Click(object sender, RoutedEventArgs e)
{
if (sender is Button button)
{
Debug.WriteLine($"Мы нажали на {button.Content}");
}
}
Debug.WriteLine()
- это вывод в консоль отладки, меняйте на свою логику.
Собственно, вот вам и весь ваш код, с привязками и всем, чем положено. Из замечаний, советую сразу начать понимать, что такое MVVM, избавляться от Click
, кода в классе окна, и так далее. Также этот код можно переделать без вложенной коллекции в коллекцию и ItemsControl
в ItemsControl
, для этого вам понадобиться коллекция символов, без каких-либо уровней, а также UniformGrid
. Вот вам уже "домашнее задание")
Ну и да, забудьте раз и на всегда про дергание контролов через имена в WPF проекте, вообще забудьте про x:Name
, они вам нужны максимум для XAML стилей. Если вы делаете в C# коде myControl.SomeProperty = ...;
, то вы сразу, автоматом должны понимать, что делаете что-то не то.
ListBox
илиItemsControl
, измените ему вид элемента на вложенный такжеListBox
илиItemsControl
, который в свою очередь будет иметь вид ячейки. Дальше привяжите это к коллекции коллекций, и привяжите. Вот вам и весь проект.