最近在看《Pro Silverlight 2 in C# 2008》,个人感觉这本书写的不错。
全书采用彩色印刷,可以使读者立刻看到程序运行的最后效果。虽然说是高级教程,
但看起来还是非常通俗易懂,个别地方可能有些难度需要仔细研究下。
书看了不少光看不练难免会感觉生疏。结合书中的示例举一反三做一些东东,
同时也和正在学习Silverlight的朋友交流下经验。根据第四章关于Mouse Event的示例,
改编成一个五子棋游戏。

XAML Code:

<UserControl x:Class="WuZi.Page"      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">      <Canvas x:Name="parentCanvas" MouseLeftButt Background="BurlyWood">      </Canvas>  </UserControl>

C# Code:

首先,画出一个15×15的棋盘。

public Page()  {    InitializeComponent();    int offset = 0;    //横竖各15条线    for (int i = 0; i <= 15; i++)    {      //垂直线      Line lineX = new Line();      lineX.Stroke = new SolidColorBrush(Colors.Black);      lineX.X1 = 10 + offset;      lineX.Y1 = 10;      lineX.X2 = 10 + offset;      lineX.Y2 = 610;      parentCanvas.Children.Add(lineX);      //水平线      Line lineY = new Line();      lineY.Stroke = new SolidColorBrush(Colors.Black);      lineY.X1 = 10;      lineY.Y1 = 10 + offset;      lineY.X2 = 610;      lineY.Y2 = 10 + offset;      parentCanvas.Children.Add(lineY);      //线间距       offset += 40;     }
}

当点击棋盘时,按次序显示黑白子。

       //跟踪棋子是否被拖拽          private bool isDragging = false;          //当棋子被点击时,记录相对于棋子的坐标值。          private Point mouseOffset;                  //判断黑子          private int num = 0;          private void canvas_Click(object sender, MouseButtonEventArgs e)          {              //当鼠标没进行拖拽时,创建棋子。              if (!isDragging)              {                  int y;                  y = num % 2;                  Ellipse ellipse = new Ellipse();                  //判断棋子的颜色,奇数黑、偶数白。                  if (y == 0)                  {                      ellipse.Fill = new SolidColorBrush(Colors.Black);                  }                  else                  {                      ellipse.Fill = new SolidColorBrush(Colors.White);                  }                  //设置棋子大小                    ellipse.Width = 40;                  ellipse.Height = 40;                  //改变棋子鼠标形状(手型)                  ellipse.Cursor = Cursors.Hand;                  //根据鼠标位置定位棋子的坐标                    Point point = e.GetPosition(this);                  ellipse.SetValue(Canvas.TopProperty, point.Y - ellipse.Height / 2);                  ellipse.SetValue(Canvas.LeftProperty, point.X - ellipse.Width / 2);                  //跟踪鼠标左键操作                    ellipse.MouseLeftButtonDown += ellipse_MouseDown;                  //添加棋子                    parentCanvas.Children.Add(ellipse);                  num++;              }          }

鼠标操作跟踪

       //按住鼠标左键          private void ellipse_MouseDown(object sender, MouseButtonEventArgs e)          {              //对棋子进行拖拽                isDragging = true;              Ellipse ellipse = (Ellipse)sender;              //获取相对棋子的坐标值,以棋子左上角为(0,0)点                mouseOffset = e.GetPosition(ellipse);              //跟踪鼠标其他操作                ellipse.MouseMove += ellipse_MouseMove;              ellipse.MouseLeftButtonUp += ellipse_MouseUp;              //捕获鼠标位置,将棋子与鼠标绑定                ellipse.CaptureMouse();          }          //鼠标移动           private void ellipse_MouseMove(object sender, MouseEventArgs e)          {              if (isDragging)              {                  Ellipse ellipse = (Ellipse)sender;                  //获取相对Canvas的坐标值                    Point point = e.GetPosition(this);                  //移动棋子                    ellipse.SetValue(Canvas.TopProperty, point.Y - mouseOffset.Y);                  ellipse.SetValue(Canvas.LeftProperty, point.X - mouseOffset.X);              }          }          //放开鼠标左键          private void ellipse_MouseUp(object sender, MouseButtonEventArgs e)          {              if (isDragging)              {                  Ellipse ellipse = (Ellipse)sender;                  //取消鼠标操作跟踪                    ellipse.MouseMove -= ellipse_MouseMove;                  ellipse.MouseLeftButtonUp -= ellipse_MouseUp;                  ellipse.ReleaseMouseCapture();                  isDragging = false;              }          }

效果图

2009-7-1-21.21.45

至此一个五子棋的雏形完成,还可以进行其他功能完善。例如,将棋子摆放整齐、判定输赢等等,大家可以举一反三。
本例参考自Apress《Pro Silverlight 2 in C# 2008》CHAPTER 4 ■ DEPENDENCY PROPERTIES AND ROUTED EVENTS