结对编程作业

一、链接
github博客链接：https://github.com/031804120/huarongdao
队友博客链接：https://www.cnblogs.com/sunqingqing/p/13799014.html
队友孙晴晴的github链接：https://github.com/031804126/pairWork
游戏部分为Java语言，AI大比拼代码重点内容为python。
具体分工：

• 二、原型设计
  （1）设计说明：
  1、HTML界面主要分为两部分，游戏菜单部分和游戏活动区域。
  2、整个html文件采用flex布局，所以css文件里需要使用flex布局实现html文件的界面需求；总体布局采用列方向排列子元素；然后每一列中采用行方向排列子元素。
  

3、进行游戏的区域中内容通过JS动态生成
所以生成的界面是这样的。

在这个界面内，实现的功能有：
关于更换游戏图片的实现
因为要动态更换图片，所以我们需要一个全局变量来记录我们当前用到的图片，在js中我们用到了image对象以及imagePath这两个变量。image对象在动态计算小方格的宽度和高度时需要用到；而imagePath则是为了在更换图片事件发生时，重新修改image对象的属性；具体功能由onChooseImage()函数实现；
关于难度选择的实现
通过image的宽度和高度除以难度值来计算每一个小方格的宽度和高度，并计算填充小方块时图片的偏移量；具体功能由onChooseDifficulty()来实现；
关于记录操作次数的实现
我们都需要交换两个小方块的数据（即背景图像的位置信息），所以只需要在这个函数里更新一个score全局变量即可；这个函数是doExchange(item)；即将item的相关内容同emptyBlock(空方块)交换；
关于提示功能：
在getOpeningPosition()函数里模拟用户操作交换小方块时，如果空块向左移动，那么我们就将一个使空块向右移动的函数emptyMoveRIght对象压入操作栈，即把用户操作的反动作压入操作栈；当用户产生操作时，我们就接着把对应的反动作压入操作栈。当用户点击提示时，我们从操作栈弹出一个函数对象并执行，当栈空时，自然游戏场景被还原，即游戏结束。
数据存储
每一个position对象有x属性和y属性；然后将该对象转换为字符串后存到div的dataset中。当触发事件是就可以获得div的imagePosition和physicalPosition。

（2）原型设计工具：
JavaScript。Prototype。

（3）讨论照片

（4）遇到的困难与解决方法
1、困难描述：HTML浏览器打开的时候，碰到了不稳定的情况，如以下。

2、解决尝试：
查询了B站，百度，知乎等相关APP极其网站上的相关知识文章。
3、是否解决：不是非常的确定。
4、有何收获：
通过这一次的学习和查询资料，我更加的理解了js的使用，以及在网页脚本之类的内容有了亲身实践过后的理解。

• 三、AI与原型设计实现：
  （1）、代码实现思路：
  1、网络接口的使用：
  一开始的接口用的是：

url = "http://47.102.118.1:8089/api/problem?stuid=031804120"
# 发送get请求
r=requests.get(url)
user_dic = json.loads(r.text)
# swap=user_dic['step']
# uuid=user_dic['uuid']
data = user_dic['img']
image_data = base64.b64decode(data)
np_img=imageio.imread(image_data)
plt.imshow(np_img)
plt.show()

后面发现还不如用postman。

2、代码组织与内部实现设计（类图）：

3、说明算法的关键与关键实现部分流程图：
AI大比拼的算法：主要还是广度优先搜索，A*那里只是大约是排序，把那些最有可能得到解的结果先搜索。

游戏设计的时候：我觉得在进行图片排列的这一步挺重要的。

4、贴出你认为重要的/有价值的代码片段，并解释：
AI中：

  def cal_distance(idxs):
            distance = 0
            for i in range(len(idxs)):
                if idxs[i] == 0:
                    continue
                distance += abs(i // width - (idxs[i] - 1) // width) + 
                            abs(i % width - (idxs[i] - 1) % width)
            return distance

        # 优先队列，值越小，优先级越高
        pq = PriorityQueue()
        # [优先级, 中间List(3*3=9), 初始值的0索引, 步数, 按键顺序输出序列, 拼图中间转换过程]
        pq.put([0 + cal_distance(board_start), board_start, board_start.index(0), 0, "", []])
        # 已遍历过的序列
        visited = set(board_start)
        # BFS搜索
        while not pq.empty():
            # 获取中间值
            _, board, position, step, move_str, board_roads = pq.get()
            # 最终结果返回, 循环停止条件
            if board == board_end:
                return step, move_str, board_roads
            # BFS遍历上下左右的相邻结点
            for idx in (-width, width, -1, 1):
                # wsad字母 对应 上下左右 的按钮
                id2button = {-1: "a", 1: "d", - "w",  "s"}
                # 下一个需要遍历的点
                neighbor = position + idx
                # 不是相邻点的跳过
                if abs(neighbor // width - position // width) + abs(neighbor % width - position % width) != 1:
                    continue
                # 遍历上下左右符合边界条件的相邻数字(图片)
                if 0 <= neighbor < width * hight:
                    board_mid = list(board)
                    # 交换, 即移动0(即空图片)
                    board_mid[position], board_mid[neighbor] = board_mid[neighbor], board_mid[position]
                    board_new = tuple(board_mid)
                    if board_new not in visited:
                        visited.add(board_new)
                        pq.put([cal_distance(board_new) + step + 1, board_new, neighbor, step + 1,
                                move_str + id2button[idx], board_roads + [board_mid]])

这个地方主要就是为了找出好的路劲来。
游戏：

class ImgButtonAction implements ActionListener {
        public void actionPerformed(ActionEvent e) {
//			System.out.println(444);
            nums++;
//			System.out.println(nums);
            if (nums > 20) {
                JButton clickButton = (JButton) e.getSource();
                JPanel panel = (JPanel) clickButton.getParent();
                JButton one;
                while ((one = (JButton) panel.getComponent((int) (Math.random() * panel.getComponentCount()))) == emptyButton) {
                }
                JButton two;
                while ((two = (JButton) panel.getComponent((int) (Math.random() * panel.getComponentCount()))) == emptyButton || two == one) {
                }
                Icon icon=one.getIcon();
                one.setIcon(two.getIcon());
                two.setIcon(icon);
                nums=0;
            } else {
                String emptyName = emptyButton.getName();
                char emptyRow = emptyName.charAt(0);
//			System.out.println(emptyRow);
                if (emptyRow == '1') {
                    System.out.println("s");
                } else {
                    System.out.println("w");
                }

                char emptyCol = emptyName.charAt(1);
//			System.out.println(emptyCol);
                JButton clickButton = (JButton) e.getSource();
                String clickName = clickButton.getName();
                char clickRow = clickName.charAt(0);
                if (emptyRow == '1') {
                    System.out.println("a");
                } else {
                    System.out.println("d");
                }
//			System.out.println(clickRow);
                char clickCol = clickName.charAt(1);
//			System.out.println(clickCol);
                if (Math.abs(clickRow - emptyRow) + Math.abs(clickCol - emptyCol) == 1) {
                    emptyButton.setIcon(clickButton.getIcon());
                    clickButton.setIcon(new ImageIcon("image/" + num + "00.jpg"));
                    emptyButton = clickButton;
                }
            }
        }
    }

游戏过程中的移动以及强制调换图片。

5、性能分析与改进：
刚开始的时候还是存在着一些局限性，专一的用着一种方法，存在着一些比较浪费时间的没必要步骤。
6、描述你改进的思路：
改进的时候，就是将A*和广度以及深度优先搜索之类的，都尝试一下，然后再试着能不能结合改进。
7、展示性能分析图和程序中消耗最大的函数：
AI算法：


游戏程序：

8、展示出项目部分单元测试代码，并说明测试的函数，构造测试数据的思路 ：
部分代码：

单元测试coverage：

测试的函数的思路：就是在单元测试建立新的测试数据，然后通过调用同文件夹下的相关函数。
构造测试数据的思路：为了尽量保证有解，参考了逆序数的思想打乱。

（2）贴出Github的代码签入记录，合理记录commit信息：

（3）遇到的代码模块异常或结对困难及解决方法：
1、问题描述：
分着写部分代码的时候，一开始没有统一商量好，导致再整合代码后，出现了一些函数调用问题。还有一些思路上的小分歧。
2、解决尝试：
再次商量确定了负责部分的内容的代码写的规范。
3、是否解决：
解决了。
4、有何收获：
交谈非常重要，尤其是开始一项合作项目之前的商量！而且交流思路的时候要越详细越好，因为很容易出岔子，或者理解错误，毕竟每个人的思路都不一样的。

（4）评价你的队友：
1、值得学习的地方：
比我有耐心，有时候敲代码敲到烦的时候，感谢她的鼓励。
2、需要改进的地方：
没有，因为一样的缺点，菜是原罪。

PSP：

学习进度条：