Silverlight+WCF 新手实例 象棋 主界面-棋盘区(二十二)

概述在线演示地址： Silverlight+WCF 新手实例 象棋 在线演示   这节我们要布局Index.xaml界面。 首先，我们定义一下全局的宽和高：1000*620[数字差不多就行了] 一堆代码，都是自动生成的，只是改了两个数字,不说大伙也知道改啥数字了。 < UserControl x:Class = " NewChessProject.Index "     xmlns = " http: 在线演示地址： Silverlight+WCF 新手实例 象棋 在线演示

 

这节我们要布局Index.xaml界面。

首先，我们定义一下全局的宽和高：1000*620[数字差不多就行了]

一堆代码，都是自动生成的，只是改了两个数字,不说大伙也知道改啥数字了。

< UserControl x:Class = " NewChessproject.Index "
    xmlns = " http://schemas.microsoft.com/winfx/2006/xaml/presentation "
    xmlns:x = " http://schemas.microsoft.com/winfx/2006/xaml "
    xmlns:d = " http://schemas.microsoft.com/Expression/blend/2008 "
    xmlns:mc = " http://schemas.openxmlformats.org/markup-compatibility/2006 "
    mc:Ignorable = " d "
    d:DesignHeight = " 620 "  d:DesignWIDth = " 1000 " >
    
     < GrID x:name = " LayoutRoot "  Background = " White " >
     </ GrID >
</ UserControl >

 

接着我们要分块了，如果看过主界面就知道分几块了，如下图：

共有五个区，每个区我都弄成一个用户控件,然后往里加载。

怎么个加载？新建几个用户控件，然后往里拖？拖过了，好像不太行。

于是，不知从哪看到这么一种方法来加载：

A：拖一个border控件到界面去

B：后台写上这两句代码：

控件A chessControl  =   new  控件A（）；
chessBoard.Child = chessControl;

 

通过这种方式能动态加载用户控件，有点Asp.net里的literal控件。

 

好了，所以目前我们要往界面里预备好几个border控件，然后起好名称：

先来一个下棋区的吧，放完之后界面是一片空白的，不要着急先：

< border borderBrush = " Silver "  borderThickness = " 1 "  Height = " 544 "  HorizontalAlignment = " left "  margin = " 10,10,0 "  name = " chessBoard "  VerticalAlignment = " top "  WIDth = " 522 " ></ border >

 

然后我们新建一个一区的下棋控件：

添加控件大伙都会了吧：对着项目右键-》添加—》新建项->用户控件->输入名称：Chess.xaml

好了，我们回到Index.xaml.cs后台去，把添加控件的代码写进去：

 

  public   partial   class  Index : UserControl
    {
         public  Index()
        {
            InitializeComponent();
            Chess chessControl = new  Chess(); // 实例化控件
            chessBoard.Child  =  chessControl; // 加载控件
        }
    }

 

 

如果你想看效果，你就运行了，不过结果也是一片空白的，因为新建的用户控件啥也没有？接下来让它有-》棋

进入Chess.xaml，我们把GrID删除，换成Cavans：

 

< Canvas Background = " White "  Height = " 300 "  HorizontalAlignment = " left "  margin = " 0,0 "  name = " canvasRoot "  VerticalAlignment = " top "  WIDth = " 400 "   >
     </ Canvas >

 

 

这里的宽和高我们先不急着改，因为我们后台根据棋盘的大小来设置

写到这里博客园挂了15:21分,也许是这边挂了，但QQ还正常着,网易也能上）：

 

public  Chess()
        {
            InitializeComponent();
            ChessNewInstance.Chess chess  =   new  ChessNewInstance.Chess(canvasRoot);
            chess.InitBoard();
            chess.InitChessman();
            canvasRoot.WIDth  =  chess.Board.WIDth;
            canvasRoot.Height  =  chess.Board.Height;
        }

 

 

上面代码看着很熟悉吧，以前经常示例用来显示棋盘和棋子的，最后两行就是设置宽和高了。

现在可以F5运行了：登陆->进入房间->主界面：一个棋盘出来了（这里就不上图片了，博客园访问不了）

好，这节简单点到这里了，下节我们布局下一个区在线用户区[没按图的顺序来的，哪个简单先来哪个了]。

总结

以上是内存溢出为你收集整理的Silverlight+WCF 新手实例 象棋 主界面-棋盘区(二十二)全部内容，希望文章能够帮你解决Silverlight+WCF 新手实例 象棋 主界面-棋盘区(二十二)所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。