用户界面

这是一个简单的五子棋程序，因此我们考虑使用一个包含一个组件的表单来渲染棋盘UI界面。

位置定义Position

public class Position
{
    public int Row = -1;  //行
    public int Col = -1;    //列
    public static Position Empty
    {
        get { return new Position(-1, -1); }
    }
    public bool IsEmpty
    {
        get { return Row == -1 && Col == -1; }
    }
    public Position(int pRow, int pCol)
    {
        Row = pRow;
        Col = pCol;
    }
    public int GetHashCode()
    {
        return (Row.ToString() + "_" + Col.ToString()).GetHashCode();
    }
    public Position Clone()
    {
        Position NewPostion = new Position(this.Row, this.Col);
        return NewPostion;
    }
    public string PositionString()
    {
        return Row.ToString() + "," + Col.ToString();
    }
    public bool IsEqual(Position pos2)
    {
        if (pos2 == null)
        {
            return false;
        }
        return this.PositionString() == pos2.PositionString();
    }
    public bool Is(int row, int column)
    {
        return Row == row && Col == column;
    }
}

用户界面\IUI.cs

此接口定义方法和事件。我们用于实现此接口。

public interface IUI
    {
        // 棋盘点击事件
        event Board.CellClickHandler CellClicked;
        // 重绘UI
        void RenderUI();
       // 手动移动鼠标结束（完成落子）
        void MoveCursorTo(Position position);
        // 机器人完成落子事件
        event EventHandler HasFinishedMoveCursor;
       // 游戏结束事件 
        void Game_GameFinished(object sender, EventArgs e);
       //机器人落子
        void Game_BotThinking(object sender, EventArgs e);
       //机器人落子完成
        void Game_BotFinishedThinking(object sender, EventArgs e);
    }

UI\LabelCustomPaint\GoMokuPaint.cs

为了支持各种主题，我们使用多个 class 来渲染。

• PaintStone() - 该方法会渲染棋子，它也支持渲染图像，或者只渲染棋子颜色。
• PaintBorder()- 该方法会在标签上画一条线来做边框，还会画一个交点。
• 该方法处理不同类型的绘图位置：
• TopLeftCorner
• TopBorder
• TopRightCorner
• LeftBorder
• Center
• RightBorder
• BottomLeftCorder
• BottomBorder
• BottomRightCorner

这是仅显示位置情况的代码，每个位置将绘制成 2 行，如果是交叉点，则中心会有一个小圆圈。

    private void PaintBorder(Graphics g, ExtendLabel pLabel)
    {
        Point fromPointX = Point.Empty;
        Point toPointX = Point.Empty;
        Point fromPointY = Point.Empty;
        Point toPointY = Point.Empty;

        int beginWidth = 0;
        int middleWidth = pLabel.Width / 2;
        int endWidth = pLabel.Width;
        int beginHeight = 0;
        int middleHeight = pLabel.Height / 2;
        int endHeight = pLabel.Height;

        switch (pLabel.CellAttribute.GoboardPosition)
        {
            case GoBoardPositionEnum.Center:
                fromPointY = new Point(middleWidth, beginHeight);
                toPointY = new Point(middleWidth, endHeight);

                fromPointX = new Point(beginWidth, middleHeight);
                toPointX = new Point(endWidth, middleHeight);
                break;
            //Omit the code for other position
        }

        g.DrawLine(penTable, fromPointY, toPointY);
        g.DrawLine(penTable, fromPointX, toPointX);
        
        g.CompositingMode = CompositingMode.SourceOver;

        if (pLabel.CellAttribute.IsIntersection)
        {
            RectangleF RecCircleIntersecton = 
                       new RectangleF(middleWidth - 4, middleHeight - 4, 8, 8);
            g.FillEllipse(ShareGraphicObject.SolidBrush(penTable.Color), 
                          RecCircleIntersecton);
        }
    }

在此图像中，蓝色是标签的区域，BH 表示，EH 表示，BW 表示，EW 表示 。

用户单击时的序列图。

这是用户单击时的序列图。我省略了 （Process） 部分中的细节。
您可以在 Game.cs 部分查看 bot 如何工作的序列图。

至此，关于五子棋游戏UI绘制基本完成。

SharpMoku a Gomoku/Five in a Row Written in C# - CodeProject