[Solved] Draw samurai sudoku grid on WPF

by


Example for demonstration.
It is not as difficult as in the picture in the question.
But it will not be a problem for you to supplement it.

public class SudokuCell
{
    public Thickness Border { get; }
    public int Value { get; set; }

    public int Row { get; }
    public int Column { get; }

    public SudokuCell(int row, int column, Thickness border)
    {
        Row = row;
        Column = column;
        Border = border;
    }

    public SudokuCell(int row, int column, Thickness border, int value)
        : this(row, column, border)
    {
        Value = value;
    }
}

public class SudokuViewModel
{
    public ObservableCollection<SudokuCell> Cells { get; }
        = new ObservableCollection<SudokuCell>();

    public IEnumerable<int> ValidValues { get; } = Enumerable.Range(1, 9);

    private readonly SudokuCell[,] cellsArray;

    private static readonly Random random = new Random();
    public SudokuViewModel()
    {
        cellsArray = new SudokuCell[9, 9];
        for (int row = 0; row < 9; row++)
        {
            for (int column = 0; column < 9; column++)
            {
                if ((row / 3 + column / 3) % 2 == 1)
                    continue;

                double left = 0.5;
                if (column % 3 == 0)
                    left = 3;

                double top = 0.5;
                if (row % 3 == 0)
                    top = 3;

                double right = 0.5;
                if (column % 3 == 2)
                    right = 3;

                double bottom = 0.5;
                if (row % 3 == 2)
                    bottom = 3;

                int value = 0;
                if (random.Next(5) < 2)
                    value = random.Next(9) + 1;

                cellsArray[row, column] = new SudokuCell(
                    row,
                    column,
                    new Thickness(left, top, right, bottom),
                    value);
            }
        }

        foreach (var cell in cellsArray)
        {
            Cells.Add(cell);
        }
    }
}

    <Window.Resources>
        <local:SudokuViewModel x:Key="viewModel"/>
        <ItemsPanelTemplate x:Key="Sudoku.Panel">
            <UniformGrid Columns="9" Rows="9"/>
        </ItemsPanelTemplate>
        <DataTemplate x:Key="Sudoku.CellTemplate" DataType="{x:Type local:SudokuCell}">
            <Border BorderBrush="SkyBlue" BorderThickness="{Binding Border}"
                    Background="{Binding Background, ElementName=comboBox}">
                <Border.Style>
                    <Style>
                        <Style.Triggers>
                            <DataTrigger Binding="{Binding}" Value="{x:Null}">
                                <Setter Property="Border.Opacity" Value="0"/>
                            </DataTrigger>
                        </Style.Triggers>
                    </Style>
                </Border.Style>
                <ComboBox x:Name="comboBox" ItemsSource="{Binding ValidValues, Source={StaticResource viewModel}}"
                          SelectedItem="{Binding Value}"
                          FontSize="20" VerticalAlignment="Center" HorizontalAlignment="Center"
                          BorderThickness="0"/>
                </Border>
        </DataTemplate>
    </Window.Resources>

    <ItemsControl ItemsSource="{Binding Cells, Source={StaticResource viewModel}}"
                  ItemTemplate="{DynamicResource Sudoku.CellTemplate}"
                  ItemsPanel="{DynamicResource Sudoku.Panel}"/>

enter image description here

0

solved Draw samurai sudoku grid on WPF