我决定在学期假期开始一个项目,使用 asp.net 创建一个国际象棋引擎。我对如何实现引擎本身有一个好主意,我的问题是将它绘制到浏览器的最佳方式是什么?
我计划只使用 asp:image 控件,并在每次鼠标按下事件时在棋盘图像上重新绘制棋子。我将有一个 2D 数组的 ChessPiece 对象,它具有用于绘制不同棋子的抽象绘制方法,有点像 2D 瓦片 map 。这将使用 .NET 中的 Drawing 类来完成,但我在 MSDN 网站上了解到它不受 asp.net 支持。
基本上我的问题是使用 asp.net 将服务器端图像绘制到客户端的最佳方法是什么。我以前没有做过这样的事情,所以如果你能指出我正确的方向,我将不胜感激。
干杯,戴夫。
如果是我,我会完全使用 HTML、CSS 和 JavaScript 制作界面。您可以单独使用 HTML 和 CSS 轻松生成电路板。然后,您需要为所有棋子创建一个 CSS“ Sprite ”。 sprite 基本上是一堆图像拼接成一个图像(然后你创建具有不同名称的 CSS 类来指定 sprite 的部分以一次显示)。所以你可以创建类似 <div class="rook white"></div>
的东西显示 CSS Sprite 中的白车。然后你会制作一个 <div></div>
每个棋子的元素,并将它们放入您的 HTML 中,以便它们显示在您棋盘上的方法方 block 中。然后,您可以使用 JavaScript 在每个片段上连接 mousedown/mouseup 事件。我可能会将棋盘格式以 JSON 格式存储在内存中,然后当用户尝试移动棋子时,我会使用 JavaScript 验证移动。如果它是一个有效的移动,我会显示一个加载微调器并通过 JavaScript 向您的 ASP.NET 代码执行一个 Ajax 请求。我会使用 WebApi 托管 ASP.NET 代码。您的 WebApi Controller 将接受具有新板状态的 POST 数据。然后它可以计算计算机应该采取什么行动,并以 JSON 格式返回新的棋盘状态。然后,您的 JavaScript 可以更新其内部 JSON,您可以让它更新 HTML 界面。像这样实现双向绑定(bind)的一种简单方法是使用 Angular.js 或 Knockout.js。如果您使用任一框架,您可以避免在 HTML 中设置初始板,而是在 JSON 中设置板并让它相应地创建相应的 HTML。板状态更新后,我将隐藏加载微调器。