新手silverlight练习--五子棋( 二 )

         新一天又开始了，继续上次的话题，讲到哪里了呢：?   (这都忘记了，先拍一板砖）。。。

嘿嘿，想起来了，上次讲到把棋盘作好了。那咱们就继续，接着讲棋子的设计。其实棋子比棋盘还简单------------

设计思路：

1.简单的定义它几个属性：

（1）棋子颜色（黑和白）Color

（2）棋子半径  Radius

（3）棋子坐标  Point

（4）棋子的标记（0，1，2） ----到时候方便用来判断（0表示没有棋子，1表示黑棋，2表示白棋）Tag

2.作一个函数：

此函数用来画棋子，并把棋子放到棋盘上去。放到棋盘上去的方法，和上篇文章中把棋盘格子画到棋盘上去的方法同样，因此函数大概是这样的：

 

代码

  ///   <summary>
         ///  画棋子
         ///   </summary>
         public   void  DrowChessman(Canvas container)
        {

            Ellipse el  =   new  Ellipse();                  
            el.Fill  =   new  SolidColorBrush(CHcolor);     //  设置颜色
            el.Width  =  CRadius  *   2 ;
            el.Height  =  CRadius  *   2 ;
            
            container.Children.Add(el);
            Canvas.SetLeft(el,Cpoint.X - 300 - CRadius);    // 在棋盘中定位棋子
            Canvas.SetTop(el, Cpoint.Y - CRadius);
        }

 

 

这个函数有一个形参，主要用来传进来上级容器，就是容纳棋子的容器（棋盘） ，而后根据棋子自己属性来设置颜色，大小等属性。而

Canvas.SetLeft(el,Cpoint.X-300-CRadius);   //在棋盘中定位棋子
Canvas.SetTop(el, Cpoint.Y-CRadius);
这两个是用来定位在棋盘中棋子的,涉及到了屏幕坐标和Canvas容器内坐标的关系转换，下面我用图示简单讲解下原理：

 

     如今咱们要设置的是棋子在棋盘中的位置，咱们以棋盘左上角的黑棋为例：

因为在以前进行布局的时候，在一个Grid中分红了三列，棋盘是中间的一列，而它左边的一列有300个单位，在进行画棋盘格子的时候咱们当初用MarginLeft设置为50，因此最边上的竖线距离棋盘左边边缘50个单位。距离上边缘30个单位。而如今咱们是在Canvas中对它进行定位，因此MarginLeft应该为50-radius；而咱们能获得的是咱们鼠标按下时候的屏幕坐标，在这个位置获得的x坐标为350，经过Cpoint.X-300-radius=50-radius 就推算出屏幕坐标与Canvas定位坐标的关系。其实，也能够这么想，假设当整个棋盘充满整个窗口的时候，咱们获得的x坐标就能够直接用来在Canvas中进行定位，由于在Canvas中距离左边缘的位子，就是等于距离窗口最左边的位子。而如今，咱们的Canvas相对于窗口向右边移动了300个单位，因此当咱们获得屏幕坐标后须要减去300个单位。而y坐标也相同原理。

整个ChessMan类以下：

 

代码

namespace  ChessGame
{
     public   class  ChessMan
    {
       
         ///   <summary>
         ///  棋子坐标
         ///   </summary>
         public  Point Cpoint {  get ;  set ; }
         ///   <summary>
         ///  棋子半径
         ///   </summary>
         public   int  CRadius {  get ;  set ; }
         ///   <summary>
         ///  棋子颜色
         ///   </summary>
         public  Color CHcolor {  get ;  set ; }

         ///   <summary>
         ///    颜色标记，便于操做
         ///   </summary>

         public   int  tag {  get ;  set ; }

        


        ///   <summary>
        ///  构造函数
        ///   </summary>
        ///   <param name="pt"></param>
        ///   <param name="radius"></param>
        ///   <param name="color"></param>
         public  ChessMan()
        {
            tag  =   0 ;
        }
         public  ChessMan(Point pt,  int  radius, Color color, int  x)
        {
            CRadius  =  radius;
            Cpoint  =  pt;
            CHcolor  =  color;
            tag  =  x;
        }

         ///   <summary>
         ///  画棋子
         ///   </summary>
         public   void  DrowChessman(Canvas container)
        {

            Ellipse el  =   new  Ellipse();
            el.Fill  =   new  SolidColorBrush(CHcolor);
            el.Width  =  CRadius  *   2 ;
            el.Height  =  CRadius  *   2 ;
            
            container.Children.Add(el);
            Canvas.SetLeft(el,Cpoint.X - 300 - CRadius);
            Canvas.SetTop(el, Cpoint.Y - CRadius);
        }
       
    }
}

 

ChessMan类作好了，接下来继续来作剩下的一个类，GameEnigin类--------

有了棋盘，棋子，是该下几颗棋子了，那么就须要有个东西来控制下棋，这就是GameEnigin类的功能。这个类相比前面两个就要复杂的多，不过先别怕，咱们慢慢来完善它。其它先无论，作棋盘，棋子作那么辛苦，也不知道它们有没有用，因此，我决定先在GameEnigin类中来控制下画棋盘。棋子，暂时不考虑位置啊，坐标啥的，先能把棋子放到棋盘上再说。

因而，就开始了。。。

  先定义一个构造函数：

 

代码

public  GameEnigin(Panel control)
        {
            
            ChessBoard cb  =   new  ChessBoard(control);
            cb.DrawBoard();
            ChessMan ce = new  ChessMan( new  Point( 350 , 28 ),radius,Colors.Black, 1 );
            ce.DrowChessman(Board);
         }
             

 

完工。。。。

等等，这边还有个radius（棋子半径)没定义，因此在GameEnigin类中定义radius=15；

这样，GameEnigin类就是这个样子了：

 

代码

namespace  ChessGame
{
     public   class  GameEnigin
    {
         int  radius  =   15 ;


    public  GameEnigin(Panel control)
        {
            
            ChessBoard cb  =   new  ChessBoard(control);
            cb.DrawBoard();
            ChessMan ce = new  ChessMan( new  Point( 350 , 28 ),radius,Colors.Black, 1 );
            ce.DrowChessman(Board);
         }
             
}
}

 

 

接下来，咱们就开始测试吧；打开MainPage.xaml.cs文件，

在MainPage（）函数中加入代码，以下：

 

public  MainPage()
        {
            InitializeComponent();
            GameEnigin ge = new  GameEnigin(Board);
         }

 

好运行下看看。。

运气不错，成功了，今天就到这里，在下一篇中将讲解黑白棋子的分别建立和屏幕坐标与逻辑坐标的转换。