c# - 跳棋和可移动人物 WPF

Question

我正在用 C# 和 WPF 做简单的西洋跳棋游戏。我面临的问题与正确显示内容有关。我有一个棋盘，我可以把棋子放在我想要的任何地方，但不幸的是我不能让任何人物移动(我的设想是玩家点击棋子/皇后 - 这个人物现在可以用光标移动 - 然后他把它放在正确的位置)。我尝试从父对象中删除图像并添加到不同的网格和其他一些想法 - 但我失败了。

<Window x:Class="Checkers.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:Checkers"
    Title="Checkers" WindowStyle="ThreeDBorderWindow" MinWidth="800" MinHeight="680"  Width="800" Height="680" Icon="C:\Users\NAME\Documents\Visual Studio 2012\Projects\Checkers\Checkers\Resources\package_games_board.ico" WindowStartupLocation="CenterScreen" >
<Window.Resources>
    <DataTemplate DataType="{x:Type local:Pawn}">
        <Image Source="{Binding ImageSource}" MouseDown="ItemsControl_MouseDown_1" MouseMove="helo_MouseMove_1" Name="helo" Tag="{Binding Reference}"/>
    </DataTemplate>
</Window.Resources>

<Grid x:Name="LayoutRoot" Background="MidnightBlue">
    <Grid.RowDefinitions>
        <RowDefinition Height="20"/>
        <RowDefinition Height="600"/>
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>

    <Menu Grid.Row="0" Grid.Column="1" Height="18" VerticalAlignment="Top" Margin="0,0,0,0"/>
    <Grid Grid.Row="1">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="600" />
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <UniformGrid Grid.Column="1" x:Name="CheckersBoard" Rows="8" Columns="8"  SnapsToDevicePixels="False"/>

        <ItemsControl Grid.Column="1" ItemsSource="{Binding}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate x:Name="GridBoard">
                    <Grid IsItemsHost="True">
                        <Grid.RowDefinitions>
                            <RowDefinition/>
                            <RowDefinition/>
                            <RowDefinition/>
                            <RowDefinition/>
                            <RowDefinition/>
                            <RowDefinition/>
                            <RowDefinition/>
                            <RowDefinition/>
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition/>
                            <ColumnDefinition/>
                            <ColumnDefinition/>
                            <ColumnDefinition/>
                            <ColumnDefinition/>
                            <ColumnDefinition/>
                            <ColumnDefinition/>
                            <ColumnDefinition/>
                        </Grid.ColumnDefinitions>
                    </Grid>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemContainerStyle>
                <Style TargetType="ContentPresenter">
                    <Setter Property="Grid.Row" Value="{Binding Row}"/>
                    <Setter Property="Grid.Column" Value="{Binding Column}"/>
                </Style>
            </ItemsControl.ItemContainerStyle>
        </ItemsControl>

    </Grid>
</Grid>

然后我有 Pawn 类:

public class Pawn : INotifyPropertyChanged
{

    public bool IsBlack { get; set; }

    public Pawn Reference { get; set; }
    private int _row;
    public Pawn()
    {
        Reference = this;
    }

    public int Row
    {
        get { return _row; }
        set
        {
            _row = value;
            OnPropertyChanged("Row");
        }
    }

    private int _column;
    public int Column
    {
        get { return _column; }
        set
        {
            _column = value;
            OnPropertyChanged("Column");
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;
    protected virtual void OnPropertyChanged(string propertyName)
    {
        PropertyChangedEventHandler handler = PropertyChanged;
        if (handler != null) handler(this, new PropertyChangedEventArgs(propertyName));
    }

    public string ImageSource 
    {
        get { return "C:\\Users\\NAME\\Documents\\Visual Studio 2012\\Projects\\Checkers\\Checkers\\Resources\\" + (IsBlack ? "black" : "white") + "_transparent.png"; }
    }

}

和主要代码(其余不是这样):

public partial class MainWindow : Window
{
    private ObservableCollection<Pawn> Pawns;
    private void ShowBoard()
    {
        SolidColorBrush scb_white = (SolidColorBrush)(new BrushConverter().ConvertFrom("#8080FF"));
        SolidColorBrush scb_dark = (SolidColorBrush)(new BrushConverter().ConvertFrom("#004A95"));
        for (int i = 0; i < 64; i++)
            CheckersBoard.Children.Add(new Rectangle() { Name = "field"+i, Stroke=Brushes.Black, Fill = (i + 1 + i / 8) % 2 == 0 ? scb_white : scb_dark });

        Pawns.Add(new Pawn() { Row = 0, Column = 0, IsBlack = true });
        Pawns.Add(new Pawn() { Row = 0, Column = 2, IsBlack = false });
        Pawns.Add(new Pawn() { Row = 0, Column = 4, IsBlack = true });
    }

    public MainWindow()
    {
        Pawns = new ObservableCollection<Pawn>();
        InitializeComponent();
        DataContext = Pawns;
        ShowBoard();
    }

    Mouse handlers ...

有人知道解决方案吗？

Answer 1

对于您拥有的代码，只需在 Pawn 对象上设置 Row/Column appears 就像它会执行您想要的“移动”一样。如果它不起作用，请检查绑定(bind)异常的输出窗口。

话虽这么说，但这只会让他们跳来跳去。对于真正的移动，您需要编写 Storyboard(可能在代码隐藏中)并移动它们的位置。最好的方法是通过 TranslateTransform。

更新

在这种系统中进行拖放操作会非常困难，而且效率不高。您可能想看看这个问题/答案:Dragging a WPF user control