On one, we give pieces confers a mouse click events, and to move the pieces by storyboards Storyboard, while achieving eat pieces.
Now we are on the board in the realization of a mouse click, and then you move the pieces go there.
Well, click the mouse on the board, click here to checkerboard, in fact, it is the most out of that Panel container you, or add a MouseLeftButtonDown event.
We returned to Chess class, because here is where Canvas passed in first-hand, we in the constructor's Chess, add this event to Panel
{
control.MouseLeftButtonDown += new MouseButtonEventHandler(control_MouseLeftButtonDown); // 新加的
container = control;
ChessmanList = new List < Chessman > ( 32 );
Action = new ChessAction( this );
}
void control_MouseLeftButtonDown( object sender, MouseButtonEventArgs e)
{
MessageBox.Show( " I am a board, you point me, my coordinates is: " + e.GetPosition ( null ) .X + " , " + e.GetPosition ( null ) .Y); }
OK, run press F5, results came out, just find a place to click, renderings below, to the salient points here to get on the green background Canvas:
Here are a few things to note:
1. Canvas outside must have a background color, background color, if not, click on the event is invalid.
2. After adding a background color, we find that the range can click too much, we just like the board so wide and high range is enough. So we return to DrawIn function chessboard Board class, the way the width of the container gave high added.
{
Width = gap * 9 + marginLeft;
Height = gap * 10 + marginTop;
container = control;
container.Width = Width; // 设置宽
container.Height = Height; // 设置高
Draw();
}
OK, then run to see results, just right of the background range.
OK, with the click event and we can get to the point where the coordinates of the click, but we clicked coordinates, not necessarily exactly on point, so we supposed to do?
If you are eating a pawn to say, because you can eat the pieces you can get accurate coordinates to be eaten piece by piece.
Here ye that we can precisely locate it on the line to the intersection of it? ?
Not supposed to say that, add a function corrected.
Thus a correction point coordinates Chess class functions generated:
/// 修正像素并转成坐标
/// </summary>
public Point FixPoint(Point point)
{
Point fixPoint = new Point();
fixPoint.X = Math.Round((point.X - Board.marginLeft) / Board.gap);
fixPoint.Y = Math.Round((point.Y - Board.marginTop) / Board.gap);
return fixPoint;
}
看，很简单吧，首先把点减去margin的，然后剩下的除以棋盘间隔，最后四舍五入就行了。
OKOK，有了修正点坐标，我们回去修改下那个点击事件，让它调用ChessAction的MoveTo方法移动吧
{
// MessageBox.Show("我是棋盘，你点中我了，我的坐标是：" + e.GetPosition(null).X+"," + e.GetPosition(null).Y);
if (e.OriginalSource is Canvas || e.OriginalSource is Line)
{
Chessman chessman = ReadyMoveChessman;
if (chessman != null )
{
Point fixPoint = FixPoint(e.GetPosition( null ));
Action.MoveTo(chessman, fixPoint);
}
}
}
OK, F5 to run, move the pieces. . Renderings up:
Wow ~ ~ called, stupid came here to move to the chessboard, and who know that they went outside.
So I studied a bit small, but also the relative coordinates to blame, look, ran to the middle of the board by default, not by the left and top aligned.
We return to the Silverlight application, locate the Canvas container, put it in horizontal alignment set to Left, vertical alignment is set to Top,
Of course, the attribute values may be set by the code.
Then look at the results:
OKOK, this is normal, and we let the pieces moved to the specified location go up.
The next section, we add pieces to the rules, so they can not move freely, get to work by the rules.
On the blog: http://cyq1162.cnblogs.com/
Reproduced in: https: //my.oschina.net/secyaher/blog/274228