一、前言
很久很久以前，找导师交流的时候他就说有想做一款吸引学生学习的游戏的想法，暑假的时候也试着用python写了一下，但是写完了才想起来考虑平台的问题，让所有人去安装python？这实在不是一个好的想法。考虑到目前大家使用手机的频率远远高于电脑，而我对于Object-C和Java实在提不起兴趣，于是就有想到了目前大热的html5游戏开发。
动手之前考虑了很久，最终选择了Egret这个引擎，这是国内的一款引擎，问题和毛病不在少数，而且更新的频率也让我有点头疼，不过没关系，边学边解决问题，痛苦但是很有成就感。
二、流程构建
我习惯在动手之前，有一个整体把握，要干嘛，怎么做。既然是把答题和游戏相结合，那么首先得有个题库，放在哪？数据库嘛。在做好之前我是不会去买服务器的，所以弄虚拟机搭个就行了，这里选择的数据库是mysql，因为熟悉。我了解到Egret是没办法直接和数据库交互的。拿起API手册搜了搜：
1.png
这样的话，我只要写个php页面，让它去和数据库交互就OK了，再回头想想，不管什么游戏，我只要写完前端，主要的逻辑都是和数据库交互的，其他应该就没什么大问题了。接下来就开始动手。
三、把题目录入数据库
首先是把题目写到数据库里面，翻出我解剖学的题库，找了两道题（因为是演示，所以不需要花那么多时间去录入了，后期大量题库的问题，可以考虑用python写个脚本往里填）。
偷个懒，打开phpstudy -> phpmyadmin，建一个名叫jiepou的库，然后再建一个名叫jiepou的表，结构的话就大概如下了：
2.png
两道题目对应填好：
3.png
这样的话就大概完成我们要测试的环境了。
四、php编写查询页面
接下来，用php写一个查询页面，让我们的引擎能通过和http相关的api，获取到数据库里面的内容，这个页面编写的很简单，直接贴代码了：
<?php
$id= $_GET['id'];
$conn = mysql_connect('127.0.0.1','root','root');
mysql_select_db('jiepou',$conn);
$sql = "select * from jiepou where id=$id";
$result = mysql_query($sql);
if (!$result) {
printf("Error: %s\n", mysqli_error($dbc));
exit();
}
while($row = mysql_fetch_array($result)){
echo "ID".$row['id']."</br>";
echo "题目:".$row['question']."</br>";
echo "A:".$row['answer_A']."</br>";
echo "B:".$row['answer_B']."</br>";
echo "C:".$row['answer_C']."</br>";
echo "D:".$row['answer_D']."</br>";
echo "答案：".$row['answer']."</br>";
}
mysql_close($conn);
?>
打开之后发现是乱码，所以想到用html的meta标签的charset属性改一下编码，完整代码就如下了：
<html>
<head>
<meta charset="utf-8">
<title>connection</title>
</head>
</body>
<?php
$id= $_GET['id'];
$conn = mysql_connect('127.0.0.1','root','root');
mysql_select_db('jiepou',$conn);
$sql = "select * from jiepou where id=$id";
$result = mysql_query($sql);
if (!$result) {
printf("Error: %s\n", mysqli_error($dbc));
exit();
}
while($row = mysql_fetch_array($result)){
echo "ID".$row['id']."</br>";
echo "题目:".$row['question']."</br>";
echo "A:".$row['answer_A']."</br>";
echo "B:".$row['answer_B']."</br>";
echo "C:".$row['answer_C']."</br>";
echo "D:".$row['answer_D']."</br>";
echo "答案：".$row['answer']."</br>";
}
mysql_close($conn);
?>
</body>
</html>
看看效果
4.png
至此，最基本的问题就解决了，下面就开始编写前端吧。这个引擎用到的语言是TypeScript，然后就是各种API的作用，到目前为止写完了开始界面和进度条加载，等再有一些进展之后再写第二篇吧。
网友评论