30 分鐘寫個象棋遊戲(一)

利用 Silverlight 視覺化元件架構，可以很容易的寫些小遊戲(Casual Game)，只要熟悉Silverlight 基本概念，花個30分鐘就可以寫個象棋遊戲，不相信嗎? 讓我們試試看吧!

目標:
1. 依物件導向方式設計視覺化元件：棋子、棋盤、計分板
2. 棋面佈局、棋子走法檢查、盤勢分析
3. 人機棋賽(不在本專案範圍)

首先打開 Microsoft Expression Blend，新增一個 Silverlight Application + Web Site 專案，再按下列步驟，設計棋子
1. 在MainPage.xaml內以Ellipse畫個圓，取名為EllipseChess，再放入一個TextBlock，作為棋子上的文字標示，將TextBlock取名為TextBlockChessName
2. 框住圓，MouseDragElementBehavior，Double Click mouse，讓棋子可在畫面上可以用滑鼠移動
3. 框住圓及TextBlock，按滑鼠右鍵，選【Make into UserControl】，將棋子轉換為元件，取名ChessControl.xaml，打開ChessControl.xaml，調整段落至下層，如下：

...
   
 
   

4. 從專案中打開ChessControl.xaml.vb，建立屬性如下:

 public property ChessName as String
  Get
   return TextBlockChessName.Text
  end Get
  Set(val as String)
   TextBlockChessName.Text=val
  End Set
 end property

 public property ChessColor as color
  Get
   return ctype(EllipseChess.Fill,solidcolorbrush).color
  end Get
  Set(val as color)
   ctype(EllipseChess.Fill,solidcolorbrush).color=val
   'EllipseChess.Effect.color=iif(val=colors.black,colors.red,colors.black)
  End Set
 end property

5. 切換到MainPage.xaml，在Asset視窗內Behavior類別內找到ChessControl，拖曳到畫布中，指定ChessColor 、ChessName ，就可以新增一顆棋子了。

大功告成，按F5執行，就可在畫面看到棋子，並試看看移動棋子，若沒問題，下次就要設計棋盤了。
Keep going.

範例程式