网页小游戏五子棋设计文档

1、如何用c#窗体做五子棋小游戏，求开始的按钮到对应的代码能整个实现

用c#窗体做五子棋小游戏 :   

首先是界面设计，控件一共有4个,1个PictureBox ；1个开始按钮，命名为btnStart；1个重置按钮，命名为btnReset；1个文本框Label，用于显示游戏状态;

2. 新建一个MainSize类用于存放界面上的可能用到的参数，主框体大小520*460，棋盘是一个PictureBox控件，大小401*401，棋盘20行20列，每个格子边长20，棋子直径16。

3. 新建一个ChessBoard类表示棋盘，有一个静态函数DrawBoard,函数代码如下:

class ChessBoard
{
static readonly Color color = Color.Black;
static readonly float penWid = 1.0f;
static readonly Pen pen = new Pen(color, penWid);
public static void DrawCB(Graphics gra,PictureBox pic)
{
//每排数量
int horC = MainSize.CBWid / MainSize.CBGap;
//间隔
int gap = MainSize.CBGap;
Image img = new Bitmap(MainSize.CBWid, MainSize.CBHei);
gra = Graphics.FromImage(img);
gra.Clear(Color.White);
gra.DrawRectangle(pen, 0, 0, MainSize.CBWid, MainSize.CBHei);
//画棋盘
for (int i = 0; i < horC; i++)
{
gra.DrawLine(pen, 0, i * gap, MainSize.CBWid, i * gap);
gra.DrawLine(pen, i * gap, 0, i * gap, MainSize.CBHei);
}
gra.DrawLine(pen, 0, horC * gap, MainSize.CBWid, horC * gap - 1);
gra.DrawLine(pen, horC * gap - 1, 0, horC * gap, MainSize.CBHei);
pic.Image = img;
}
}

4.新建一个基本类Chess，用来表示棋子，有一个静态函数DrawChess，代码如下:

class Chess
{public static void DrawChess(bool type,PictureBox pic,Graphics graphic,MouseEventArgs e)

//bool型变量用于表示下棋的双方

{
graphic = pic.CreateGraphics();
Pen pen1 = new Pen(Color.Red, 1);
Brush bru1 = new SolidBrush(Color.Red);
Pen pen2 = new Pen(Color.Blue, 1);
Brush bru2 = new SolidBrush(Color.Blue);
int newX = (int)((e.X + MainSize.CBGap / 2) / MainSize.CBGap) * MainSize.CBGap - MainSize.ChessRadious / 2;
int newY = (int)((e.Y + MainSize.CBGap / 2) / MainSize.CBGap) * MainSize.CBGap - MainSize.ChessRadious / 2;

//pen1和pen2用于绘制双方的棋子,颜色设置为红蓝      

if (type)
{graphic.DrawEllipse(pen1, newX, newY, MainSize.ChessRadious, MainSize.ChessRadious);
graphic.FillEllipse(bru1, newX, newY, MainSize.ChessRadious, MainSize.ChessRadious); }
if (!type)
{ graphic.DrawEllipse(pen2, newX, newY, MainSize.ChessRadious, MainSize.ChessRadious);
graphic.FillEllipse(bru2, newX, newY, MainSize.ChessRadious, MainSize.ChessRadious);}

//整型变量nexX和newY用于表示棋子在棋盘上的坐标，根据四舍五入就近原则落点   graphic.Dispose(); 

}

}

5. 主程序，一共设置了4个全局变量，Graphics graphic用于画图，bool type用于表示下棋双方，bool start表示游戏是否开始，二维数组ChessBack用于模拟下棋场景并进行计算。 主程序的构造函数对主框体和PictureBox的大小进行初始化，在Form1_Load函数中添加函数InitializeThis()对游戏进行初始化，包括将ChessBack数组全部置0，type设为true，start设为false，绘制棋盘，按键开始的Enabled属性设为true，按键重置设为false。 按键开始和重置的功能较为简单，代码如下:

private void btnStart_Click(object sender, EventArgs e)
{
start = true;
label1.Text = "游戏开始！";
btnStart.Enabled = false;
btnReset.Enabled = true;
} 

private void btnReset_Click(object sender, EventArgs e)
{ if (MessageBox.Show("确定要重新开始？", "提示", MessageBoxButtons.YesNo) == DialogResult.Yes)
{                           InitializeThis();
}
}

6. picturebox的函数，先判断游戏是否开始，否则不会有反应。游戏开始后点击即可落子，并修改ChessBack矩阵，红色为1，蓝色为2，如果已经有棋子则返回，即落子失败。如果棋盘已满但没有分出胜负则弹出平局的提示框并给出提示。之后判断是否分出胜负，添加函数bool Victory(int bx,int by)，分出胜负后提示胜利，如果没有则返回。最后换人，type=！type即可，然后修改label的文字表面到哪一方落子了。代码如下。

private void pictureBox1_MouseClick(object sender, MouseEventArgs e)
{
if (start)
{
//在计算矩阵中的位置
int bX = (int)((e.X + MainSize.CBGap / 2) / MainSize.CBGap);
int bY = (int)((e.Y + MainSize.CBGap / 2) / MainSize.CBGap);
//防止在同一个位置落子
if (ChessBack[bX, bY] != 0)
return;
Chess.DrawChess(type, pictureBox1, graphic, e);
ChessBack[bX,bY] = type?1:2;
//判断棋盘是否满了
if (IsFull() && !Victory(bX,bY))
{
if (MessageBox.Show("游戏结束，平局") == DialogResult.OK)
InitializeThis();
return;
}
//判断胜利
if (Victory(bX,bY))
{
string Vic = type ? "红" : "蓝";
if (MessageBox.Show(Vic + "方胜利!") == DialogResult.OK)
InitializeThis();
return;
}
//换人
type = !type;
label1.Text = type ? "红方's trun!" : "蓝方's turn!";
}
else
return;
}

7.判断胜负的函数，先写了一个横向的进行测试，如果横向两端的值与当前值相同则变量count++，最后返回count的值，如果>4则表示胜利。但是这个函数运行出错，显示为stackoverflow，但我不知道错误在哪，只好换一种判断方法。后来才想明白两端的值都是0则会溢出，应该判断两端的值是否为1或2而不是当前值。此处借鉴了实验楼网站上的C语言版五子棋的判断胜负方式，从当前落子的矩阵中，横竖斜4个方向任意一个方向有连续5个数的值与当前的值相同则胜利，实现也不复杂，细分为三个函数实现。代码如下:

#region 判断胜利
private bool Victory(int bx,int by)
{
if (HorVic(bx, by))
return true;
if (VerVic(bx, by))
return true;
if (Vic45(bx, by))
return true;
else
return false;
}
private bool Vic45(int bx, int by)
 {

 int b1 = (bx - 4) > 0 ? bx - 4 : 0;
int b2 = (by - 4) > 0 ? by - 4 : 0;
//int buttom = b1 > b2 ? b2 : b1;
int val = ChessBack[bx, by];
for (int i = b1,j=b2; i < 16&&j<16; i++,j++)
{
if (ChessBack[i, j] == val && ChessBack[i + 1, j + 1] == val &&
ChessBack[i + 2, j + 2] == val && ChessBack[i + 3, j + 3] == val
&& ChessBack[i + 4, j + 4] == val)
return true;
}
for (int i = b1, j = b2; i < 16 && j < 16; i++, j++)
{
if (ChessBack[i, j] == val && ChessBack[i + 1, j - 1] == val &&
ChessBack[i + 2, j - 2] == val && ChessBack[i + 3, j - 3] == val
&& ChessBack[i - 4, j - 4] == val)
return true;
}
return false;
}
private bool VerVic(int bx, int by)
{
int buttom = (by - 4) > 0 ? by - 4 : 0;
int val = ChessBack[bx, by];
for (int i = buttom; i < 16; i++)
{
if (ChessBack[bx, i] == val && ChessBack[bx, i+1] == val &&
ChessBack[bx, i+2] == val && ChessBack[bx ,i+3] == val
&& ChessBack[bx, i+4] == val)
return true;
}
return false;
}
private bool HorVic(int bx, int by)
{
int left = (bx-4)>0?bx-4:0;
int val = ChessBack[bx,by];
for (int i = left; i < 16; i++)
{
if (ChessBack[i, by] == val && ChessBack[i + 1, by] == val &&
ChessBack[i + 2, by] == val && ChessBack[i + 3, by] == val
&& ChessBack[i + 4, by] == val)
return true;
}
return false;
}
#endregion

8 .经过测试，没有问题大功告成

楼主要及时采纳加分哦

2、求一个编写的五子棋小游戏python的代码，求借鉴啊！！急急急。。。

#五子棋import appuifw,e32,key_codes
from graphics import *def cn(x):return x.decode('utf-8')
def quit(): _quit=1
global running
running=1
def redraw(rect): canvas.blit(img)def default():
 global con,color,font
 con={"l":15,"x":15,"y":33,"r":13,"n":15}
 color={"bg":0x7777bb,"fg":0x333333,"p1":0x000000,"p2":0xffffff,"w":0xff0000}
 font=u"Sans MT 936_S60"def initial():
 global img,canvas,con,color,cur_x,cur_y,turn,pos1,pos2,pos
 appuifw.app.screen='full'
 appuifw.app.body=canvas=appuifw.Canvas()
 img=Image.new((240,320))
 img.clear(color["bg"])
 cur_x=7
 cur_y=7
 turn=1
 pos1=[]
 pos2=[]
 pos=[]
 for i in range(con["n"]*con["n"]):
  pos.append(0)def paint_back():
 global img,color,font
 #img.text((90,25),cn('欢乐五子棋'),color["fg"],font)
 for i in range(con["x"],con["x"]+con["l"]*con["n"]-1,con["l"]):
  img.line((i,con["y"],i,con["y"]+con["l"]*(con["n"]-1)),color["fg"])
 for i in range(con["y"],con["y"]+con["l"]*con["n"]-1,con["l"]):
  img.line((con["x"],i,con["x"]+con["l"]*(con["n"]-1),i),color["fg"])
 img.text((40,270),cn('玩家1'),color["p1"],font)
 img.text((160,270),cn('玩家2'),color["p2"],font)
 img.point((90,263),color["p1"],width=con["r"],fill=color["p1"])
 img.point((144,263),color["p2"],width=con["r"],fill=color["p2"])
 
def paint_cur(x,y,sh):
 global img,con,color,pos1,pos2,running
 if running<>1:return
 ax=con["x"]+con["l"]*x
 ay=con["y"]+con["l"]*y
 b=con["l"]/2
 if sh<>0:
  c=color["p"+str(sh)]
  if rp((x,y))<>0:
   c=color["w"]
 if sh==0:
  c=color["bg"]
 img.line((ax-b,ay-2,ax-b,ay-b,ax-2,ay-b),c)
 img.line((ax-b,ay+2,ax-b,ay+b,ax-2,ay+b),c)
 img.line((ax+b,ay-2,ax+b,ay-b,ax+2,ay-b),c)
 img.line((ax+b,ay+2,ax+b,ay+b,ax+2,ay+b),c)
 redraw(())def paint_q(x,y,z):
 global img,con,color
 ax=con["x"]+con["l"]*x
 ay=con["y"]+con["l"]*y
 b=con["l"]/2
 if z==0:
  c=color["bg"]
 else:
  c=color["p"+str(z)]
 img.point((ax,ay),c,width=con["r"],fill=c)
 redraw(())
 if z==0:
  img.line((ax-b,ay,ax+b,ay),c)
  img.line((ax,ay-b,ax,ay+b),c)
  
def k_up():
 global cur_x,cur_y,con,turn
 paint_cur(cur_x,cur_y,0)
 cur_y=cur_y-1
 if cur_y==-1:
  cur_y=con["n"]-1
 paint_cur(cur_x,cur_y,turn)def k_down():
 global cur_x,cur_y,con,turn
 paint_cur(cur_x,cur_y,0)
 cur_y=cur_y+1
 if cur_y==con["n"]:
  cur_y=0
 paint_cur(cur_x,cur_y,turn)def k_left():
 global cur_x,cur_y,con,turn
 paint_cur(cur_x,cur_y,0)
 cur_x=cur_x-1
 if cur_x==-1:
  cur_x=con["n"]-1
 paint_cur(cur_x,cur_y,turn)def k_right():
 global cur_x,cur_y,con,turn
 paint_cur(cur_x,cur_y,0)
 cur_x=cur_x+1
 if cur_x==con["n"]:
  cur_x=0
 paint_cur(cur_x,cur_y,turn)def rp(x):
 global con,pos
 if (x[0]<0 or x[0]>=con["n"] or x[1]<0 or x[1]>=con["n"]):return 0
 #print x,pos[x[0]*con["n"]+x[1]]
 return pos[x[0]*con["n"]+x[1]]def wp(x,y):
 global con,pos
 pos[x[0]*con["n"]+x[1]]=y
  
def win():
 for i in pos1:
  k=0
  for j in range(0,6):
   if rp((i[0]+j,i[1]))==1:
    k=k+1
   else:
    break
  if k>=5:
   return 1
  k=0
  for j in range(0,6):
   if rp((i[0],i[1]+j))==1:
    k=k+1
   else:
    break
  if k>=5:
   return 1
  k=0
  for j in range(0,6):
   if rp((i[0]+j,i[1]+j))==1:
    k=k+1
   else:
    break
  if k>=5:
   return 1
  k=0
  for j in range(0,6):
   if rp((i[0]+j,i[1]-j))==1:
    k=k+1
   else:
    break
  if k>=5:
   return 1 for i in pos2:
  k=0
  for j in range(0,6):
   if rp((i[0]+j,i[1]))==2:
    k=k+1
   else:
    break
  if k>=5:
   return 2
  k=0
  for j in range(0,6):
   if rp((i[0],i[1]+j))==2:
    k=k+1
   else:
    break
  if k>=5:
   return 2
  k=0
  for j in range(0,6):
   if rp((i[0]+j,i[1]+j))==2:
    k=k+1
   else:
    break
  if k>=5:
   return 2
  k=0
  for j in range(0,6):
   if rp((i[0]+j,i[1]-j))==2:
    k=k+1
   else:
    break
  if k>=5:
   return 2
 return 0
 
def k_enter():
 global cur_x,cur_y,turn,pos1,pos2,con,color,font,running
 if running<>1:return
 if rp((cur_x,cur_y))==0:
  if turn==1:
   pos1.append((cur_x,cur_y))
   img.rectangle((35,255,100,272),color["bg"])
   img.rectangle((135,255,200,272),color["p2"])
  if turn==2:
   pos2.append((cur_x,cur_y))
   img.rectangle((35,255,100,272),color["p1"])
   img.rectangle((135,255,200,272),color["bg"])
  paint_q(cur_x,cur_y,turn)
  wp((cur_x,cur_y),turn)
  if win()<>0:
   #img.text((80,300),cn('玩家')+str(turn)+cn("获胜！"),color["fg"],font)
   img.rectangle((35,255,100,272),color["bg"])
   img.rectangle((135,255,200,272),color["bg"])
   paint_cur(cur_x,cur_y,0)
   running=2
 turn=3-turn
 paint_cur(cur_x,cur_y,turn)def bindkey():
 canvas.bind(key_codes.EKeyUpArrow, k_up)
 canvas.bind(key_codes.EKeyDownArrow,k_down)
 canvas.bind(key_codes.EKeyLeftArrow, k_left)
 canvas.bind(key_codes.EKeyRightArrow,k_right)
 canvas.bind(key_codes.EKeySelect,k_enter)default()
initial()
paint_back()
paint_cur(cur_x,cur_y,1)
img.rectangle((35,255,100,272),color["p1"])
bindkey()redraw(())
appuifw.app.exit_key_handler = quit()
_quit=0
while (1-_quit):
 e32.ao_sleep(0.2)
 redraw(())

3、学习什么技术可以制作网页版的联机游戏（比如网页联机五子棋）

想做游戏啊，有出息哦！
不过这一段路上比较困难

4、五子棋怎样设计界面，

这个。。。我写的时候直接把qq五子棋的界面搬下来了。。。
搬的方法也很丑陋。。。直接一个截图完事。。。呵呵

5、求一个用java编写的网页版五子棋源代码

如果你有单机版的把它改成applet就行了

6、求数据结构课程设计 五子棋小游戏 （1）实现五子棋的人人对局功能；（2）实现实现五子棋的人机对局功能 谢

你可以去百科找找看

7、做一个网页小游戏，五子棋，用js可以实现吗？是否容易？

可以的。
使用Canvas+js就行
难度在于算法
比如怎么判定胜负
怎么指定下棋中的各种规则等

8、用js做网页小游戏容易实现吗？五子棋之类的。。。

很容易，当然得首先把js，html，css学好。我以前看过一本疯狂html，讲得蛮浅显易懂的书的最后有教伱用js做一个俄罗斯方块

9、课程设计用C++做一个五子棋游戏，要有设计思路，所参考文献

涉及人工智能，和链表，建议阅读美国Tom M.Mitchell写的machine learning（纯英文的文献），如果想做的更好则需要数据库的配合
设计思路很简单明了啊，就是一个19*19的棋盘界面，人工智能的强度（就是电脑对战时的难度），算法上会涉及博弈算法。
更具你给的分只能将这么多