Найдите пустое место на сетке 3x3 Silverlight

Question

Ну, я пытался выяснить это в течение трех дней подряд, и я до сих пор не нашел решения.

По сути, я пытаюсь поменять эллипс, на который нажали, с единственным пустым местом на шахматной доске 3х3. 8 из 9 квадратов заняты элементами эллипса во время выполнения.

Мне нужно найти одно место, которое не занято, и я не могу этого сделать. Зачем? Поскольку во время выполнения на сетке есть пустое место, Javascript отказывается это признать.

Я использовал строку: var childrenCount = canvasArray [i] .children.count; .. так что это все холсты. Если во время выполнения есть пустое место, то почему мой код отказывается его видеть? Или я не пишу правильный код? Как отображается и определяется пустое место во время выполнения? Это то, что я хочу знать.

Вот псевдокод:

 if (squareOnGrid is empty) {
     log.write(squareOnGrid + ' is empty');
     emptySquare = squareOnGrid;

     oldPositionBorder = sender;
     oldPositionR = checkerPiece.row;
     oldPositionC = checkerPiece.col;

     checkerPiece.row = empty.row;
     checkerPiece.column = squareOnGrid.column;

     oldPositionBorder = null;
 }

Я хочу сделать это с помощью Javascript (не C #).

У меня уже есть это (Javascript):

function switchPlaces(sender) {

    for (var i = 0; i < canvasArray.length; i++) {
        var oldLocationBorderParent = sender;
        var oldLocationCanvasParent = oldLocationBorderParent.findName('canvas' + (i + 1));
        var oldLocationChild = oldLocationCanvasParent.findName('ellipse' + (i + 1));

        var childrenCount = canvasArray[i].children.count;
        log.info(childrenCount); //all of this outputs '1'. It should have a '0' in there, but no.

        if (childrenCount == 0) {
            log.info(canvasArray[i] + ' has no children');
            var emptySpot = canvasArray[i];
            sender['Grid.Row'] = emptySpot['Grid.Row'];
            sender['Grid.Column'] = emptySpot['Grid.Column'];
            oldLocationCanvasParent.children.remove(oldLocationChild);
        }
    }
}

Вот мой код Silverlight:

<Grid
 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 Loaded="onLoaded" ShowGridLines="True" Background="CornflowerBlue">

 <Grid.ColumnDefinitions>
     <ColumnDefinition Width="100"/>
     <ColumnDefinition Width="100"/>
     <ColumnDefinition Width="100"/>
     <ColumnDefinition/>
 </Grid.ColumnDefinitions>

 <Grid.RowDefinitions>
     <RowDefinition Height="100"/>
     <RowDefinition Height="100"/>
     <RowDefinition Height="100"/>
 </Grid.RowDefinitions>

 <Border Grid.Row="0" Grid.Column="0" x:Name="b1" MouseLeftButtonUp="switchPlaces" >
     <Canvas x:Name="canvas1">
         <Ellipse Width="100" Height="100" x:Name="ellipse1" Fill="Red" Visibility="Visible"/>
     </Canvas>
 </Border>

 <Border Grid.Column="0" Grid.Row="1" x:Name="b2" MouseLeftButtonUp="switchPlaces" >
     <Canvas x:Name="canvas2">
         <Ellipse Width="100" Height="100" x:Name="ellipse2" Visibility="Visible"/>
     </Canvas>
 </Border>

 <Border Grid.Column="0" Grid.Row="2" x:Name="b3" MouseLeftButtonUp="switchPlaces" >
     <Canvas x:Name="canvas3">
         <Ellipse Width="100" Height="100" x:Name="ellipse3" Visibility="Visible"/>
     </Canvas>
 </Border>

 <Border Grid.Column="1" Grid.Row="1" x:Name="b4" MouseLeftButtonUp="switchPlaces" >
     <Canvas x:Name="canvas4">
         <Ellipse Width="100" Height="100" x:Name="ellipse4" Visibility="Visible"/>
     </Canvas>
 </Border>

 <Border Grid.Column="1" Grid.Row="2" x:Name="b5" MouseLeftButtonUp="switchPlaces" >
     <Canvas x:Name="canvas5">
         <Ellipse Width="100" Height="100" x:Name="ellipse5" Visibility="Visible"/>
     </Canvas>
 </Border>

 <Border Grid.Column="2" Grid.Row="0" x:Name="b6" MouseLeftButtonUp="switchPlaces" >
     <Canvas x:Name="canvas6">
         <Ellipse Width="100" Height="100" x:Name="ellipse6" Visibility="Visible"/>
     </Canvas>
 </Border>

 <Border Grid.Column="2" Grid.Row="1" x:Name="b7" MouseLeftButtonUp="switchPlaces" >
     <Canvas x:Name="canvas7">
         <Ellipse Width="100" Height="100" x:Name="ellipse7" Visibility="Visible"/>
     </Canvas>
 </Border>

 <Border Grid.Column="2" Grid.Row="2" x:Name="b8" MouseLeftButtonUp="switchPlaces" >
     <Canvas x:Name="canvas8">
         <Ellipse Width="100" Height="100" x:Name="ellipse8" Visibility="Visible"/>
     </Canvas>
 </Border>

 </Grid>

Если кто-нибудь знает, как это исправить ..

Спасибо

Answer 1

Я плохо разбираюсь в Javascript, поэтому вот ваш код на C #: (я думаю, это довольно понятно)

for(int rowIndex = 0; rowIndex < Grid.RowDefinitions.Count; rowIndex++)
{
    for(int columnIndex = 0; columnIndex < Grid.ColumnDefinitions.Count; columnIndex++)
    {
        bool cellIsEmpty = true;

        foreach(FrameworkElement fe in Grid.Children)
        {
            if((int)fe.GetValue(Grid.Row) == rowIndex
               && (int)fe.GetValue(Grid.Column) == columnIndex)
            {
                cellIsEmpty = false;
                break;
            }
        }

        if(cellIsEmpty == true)
        {
            // You've Found Your Empty Cell!
            break;
        }
    }
}

Я понимаю, что это крайне неэффективно, но у меня нет времени на работуоптимальное решение на данный момент.

Answer 2

Проблема в том, что вы проверяете все свои полотна, чтобы увидеть, есть ли в них дети. Однако, если вы посмотрите на свой XAML, станет ясно, что на всех ваших холстах всегда есть дети.

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