点击这里给我发消息 点击这里给我发消息

PHP开发框架Yii Framework教程(4) Hangman猜单词游戏实例

添加时间:2013-12-6
    相关阅读: 设计 开发 技术 模板 页面 数据库 HTML
 

有了前面“Hello,World”的例子和对Yii Framework Web应用基础的介绍,可以开始介绍一个简单而相对而有比较完整的 Web应用-Hangman(猜单词游戏),这个例子是随Yii 开发包发布的。通过这个例子可以了解开发Yii应用的基本步骤.

说 起“Hangman”,让我想起80年代末期高中时在CPC464计算机上完过的“猜单词游戏”-Hangman,每猜错一次,就把一个小人离 绞刑架前进一步。当时DOS才刚刚出来:-)。

开发一个Web应用,首先是进行需求分析,这个不在本教程之内,但为完整 起见,还是把“猜单词游戏”的规则列在下面:

猜单词游戏(英文:Hangman,“上吊的人”之意)是一个双人游戏。一 位玩家想一个字,另一位尝试猜该玩家所想的字中的每一个字母。

要猜的字以一列横线表示,让玩家知道该字有多少个 字母。如果猜字的玩家猜中其中一个字母,另一位便须于该字母出现的所有位置上写上该字母。如果猜的字母没有于该字中出现 ,另一位玩家便会画吊颈公仔的其中一笔。游戏会在以下情况结束:

 

 

“我要t字 。”“有, 在第八和第十一位。”

猜字的玩家猜完所有字母,或猜中整个字

另一位玩家画完整幅图:

今天给出的例子就不画出“上吊人”了,猜对了显示“You Win”,猜错了显示“You Lose”。 因此我们可以设计四个页面 :

这四个页面对应到Yii Framework为 四个View,可以分别取名为play, guess, win,lose ,每个页面都显示了 “Hangman Game”的标题,因此可以设计一个”MasterPage”,在Yii中成为Layout布局的模板以供四个View共享。Yii应用采用 了MVC设计模式,因此我们可以为四个View设计一个Controller–>GameController.

前面的教程说过Yii应用使用缺省 的目录结构来存放应用的不同部分,可以使用Yii提供的工具来参加一个缺省的项目目录。不过我个人还是比较喜欢自己创建各 个目录,因此根据上面的需求和界面设计,可以创建项目的目录结构如下:

创建的GameController.php 放在 protected/controller 目录下。

创建的四个View guess.php, lose.php, play.php, win.php 放在 protected/views/game 目录下 。目录名game 对应到所 使用到GameController.

创建的共享的Layout放在  protected/views/layout 目录下,缺省的布局名称为main.php

应用的配置文件放在 protected/config ,缺省配置文件为main.php

应用的入口脚本为 index.php

此外,供猜单词的文本文件为 word.txt

1. 首先来看看配置文件protected/config/main.php

return array(    
    'name'=>'Hangman Game',    
    'defaultController'=>'game',    
    'components'=>array(    
        'urlManager'=>array(    
            'urlFormat'=>'path',    
            'rules'=>array(    
                'game/guess/<g:\w>'=>'game/guess',    
            ),    
        ),    

    ),    
);CWebApplication应用的所有可写的属性都可以通过配置文件来定义,我们看到配置文件定义了应用的名称为”Hangman Game” ,然后修改Web应用缺省的Controller名字为game 对应到 GameController, 如果没有重新定义defaultController,则 缺省的Controller名字为SiteController,这样对于的View就要存放到 protected/views/site 目录下。另外这个Yii应用打开 了urlManager组件,这个组件的功能就在后面介绍,主要是用来定义用户可以访问的URL的格式(路由格式)。

2. 有了 这个配置文件,就可以在入口脚本中使用它,每个Yii应用的入口脚本index.php都是大同小异的,大部分情况下都是Copy & Paste

$yii=dirname(__FILE__).'/../../framework/yii.php';    
$config=dirname(__FILE__).'/protected/config/main.php';    
require_once($yii);    
Yii::createWebApplication($config)->run();3. 然后定义View使用的布局文件 protected/views/layout/main.php main.php 为缺省的布局模板,应用可以修改View使用的布局,本例就是要缺省的布局名称 main.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0

Transitional//EN"    
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">    
<html xmlns="http://www.w3.org/1999/xhtml">    
<head>    
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    
<title>Hangman Game</title>    
</head>    

<body>    
<h1>Hangman Game</h1>    

<?php echo $content; ?>    

</body>    
</html>

布局基本上就是HTML文件,其中 作为 view 的placeholder ,也就是在显示具体的View时,比如 play.php 就用 play.php 的内容来替代 $content。从而实现了类似“MasterPage” 的功能。 4. 下面就可以逐一定义四个View,这里就不一一列出了,以play.php 为例:

<p>This is the game of

Hangman.    
You must guess a word, a letter at a time.    
If you make too many mistakes, you lose the game!</p>    
        
<?php echo CHtml::beginForm(); ?>    
        
<?php echo CHtml::radioButtonList('level', null, $levels); ?>    
        
<br/>    
<?php echo CHtml::submitButton('Play!'); ?>    
        
<?php if($error): ?>    
<span style="color:red">You must choose a difficulty level!</span>    
<?php endif; ?>    
        
<?php echo CHtml::endForm(); ?>可以看到基本上也是HTML ,其中CHtml 为Yii 框架支持的一个辅助类,用来 帮助生成HTML代码。 Hangman比较简单,因此没有使用单独的Model,而是通过render推送的方式传入参数。

需通过传递 视图的名称调用 CController::render()。这个方法将在 protected/views/ControllerID 目录下寻找对应的视图文件.

在视图脚本内部,我们可以通过 $this 来访问控制器实例.我们可以在视图里以 $this->propertyName 的方式 拉取 控制器 的任何属性.

我们也可以用以下 推送 的方式传递数据到视图里:

$this->render('edit', array(
    'var1'=>$value1,
    'var2'=>$value2,
));在以上的方式中, render() 方法将提取数组的第二个参数到变量里.其产生的结果是,在视图脚本里,我们可以直接 访问变量 $var1 和 $var2.

5.定义好布局和View之后,就可以写GameController了,

class GameController

extends CController    
{    
    /**   
     * @var string sets the default action to be 'play'   
     */
    public $defaultAction='play';    

    /**   
     * The 'play' action.   
     * In this action, users are asked to choose a difficulty level   
     * of the game.   
     */
    public function actionPlay()    
    {    
        ...
    }

    /**   
     * The 'guess' action.   
     * This action is invoked each time when the user makes a guess.   
     */
    public function actionGuess()    
    {    
        ...    
    }    

    /**   
     * The 'guess' action.   
     * This action is invoked when the user gives up the game.   
     */
    public function actionGiveup()
    {    
        ...
    }

    ...    
}一般情况下Controller缺省的action 为 index ,可以通过$defaultAction修改缺省的Action,本例修改为play. 因 此如果本例的 url 为 http://127.0.0.1:8888/yii/demos/hangman/ 那么使用 http://127.0.0.1:8888/yii/demos/hangman/index.php 和使用 http://127.0.0.1:8888/yii/demos/hangman/index.php?game/play的效果是一样的。缺省的Controller为 GameController,GameController缺省的action为play.

Action (动作),动作可以被定义为一个以 action 单词作为前 缀命名的方法。Hangman定义了三个action ,actionPlay ,actionGuess, actionGiveup ,GameController 其它方法和属性和生 成单词,判断是否猜对等为具体的游戏逻辑和Yii框架关系不大,就不介绍了。

6. 首先看看缺省的playAction ,这是用 户调用的缺省方法,也就是说当用户组地址栏输入http://127.0.0.1:8888/yii/demos/hangman/index.php (或 http://127.0.0.1:8888/yii/demos/hangman/index.php?game/play)所调用的Action。

public function

actionPlay()    
{    
    static $levels=array(    
        '10'=>'Easy game; you are allowed 10 misses.',    
        '5'=>'Medium game; you are allowed 5 misses.',    
        '3'=>'Hard game; you are allowed 3 misses.',    
    );    
        
    // if a difficulty level is correctly chosen    
    if(isset($_POST['level'])    
       && isset($levels[$_POST['level']]))    
    {    
        $this->word=$this->generateWord();    
        $this->guessWord=str_repeat('_',strlen($this->word));    
        $this->level=$_POST['level'];    
        $this->misses=0;    
        $this->setPageState('guessed',null);    
        // show the guess page    
        $this->render('guess');    
    }    
    else
    {    
        $params=array(    
            'levels'=>$levels,    
            // if this is a POST request,    
            //it means the level is not chosen    
            'error'=>Yii::app()->request->isPostRequest,    
        );    
        // show the difficulty level page    
        $this->render('play',$params);    
    }    
}

这个方法定义了游戏的三个难度等级$levels, 有两个分支,如果没有选择难易等级,则调用$this->render (‘play’,$params),显示Play页面,就$params (Array)推送到对应的View ,protected/views/play.php,参考上面View的 定义:

<?php echo CHtml::radioButtonList('level', null, $levels); ?>View使用Radiobutton来 显示 $levels 定义的列表。

如果用户选择了难易等级,在把Level,单词等存放到GameController所定义的属性中,如 word,level等。GameController拍手与CController 也是CComponent的子类,CComponent支持了类似C#,Java的属性功能。具 体后面再介绍。然后调用$this->render(‘guess’); 显示Guess页面。 Guess页面 guess.php 定义如下:

<h2>Please make a guess</h2>    
        
<h3 style="letter-spacing: 4px;">    
  <?php echo $this->guessWord; ?></h3>    
        
<p>You have made    
  <?php echo $this->misses; ?>    
  bad guesses out of a maximum of    
  <?php echo $this->level; ?>.</p>    
        
<?php echo CHtml::statefulForm(); ?>    
        
<p>Guess:    
<?php    
for($i=ord('A');$i<=ord('Z');++$i)    
{    
    if(!$this->isGuessed(chr($i)))    
        echo "\n".CHtml::linkButton(chr($i),    
        array('submit'=>array('guess','g'=>chr($i))));    
}    
?>    
</p>    
        
<p><?php echo CHtml::linkButton('Give up?',    
array('submit'=>array('giveup'))); ?></p>    
        
</form>在View中可以直接通过$this 来访问对应的Controller实例对象的方法和属性。 如$this->guessWord,$this- >isGuessed(chr($i))等。其中点击26个字母触发guessAction (array(‘submit’=>array(‘guess’,'g’=>chr($i))))).

7. 下面为 guessAction 的定义

public function actionGuess()    
{    
    // check to see if the letter is guessed correctly    
    if(isset($_GET['g'][0]) && ($result=$this->guess($_GET['g'][0]))!==null)    
        $this->render($result ? 'win' : 'lose');    
    else // the letter is guessed correctly, but not win yet    
    {    
        $guessed=$this->getPageState('guessed',array());    
        $guessed[$_GET['g'][0]]=true;    
        $this->setPageState('guessed',$guessed,array());    
        $this->render('guess');    
    }    
}其中参数 ‘g’由 guess 页面提交是传入, 如果单词全部猜对在显示”You win” 或用完所有次数猜错显示“You lose” , $this->render($result ? ‘win’ : ‘lose’), 如果还有机会猜还是回到guess 页面$this->render(‘guess’);

8. 在Guess页面上还有一个“Give up” 按钮,用 户点击则触发giveupAction.这个方法比较简单,直接显示lose 页面

public function actionGiveup()    
{    
    $this->render('lose');    
}至此Hangman游戏基本就完成了。游戏虽然简单,但说明了使用Yii开发应用的基本流程,下面给出Yii开发文档给出 的开发流程,Hangman比较简单,没有用到数据库和国际化等。

此处的开发流程假设我们已经完成了对应用的需求分析和 必要的设计分析。

创建目录结构骨架。创建第一个Web应用 中讲到的 yiic工具可以快速实现此步骤。

配置此 应 用。这是通过修改应用配置文件实现的。 此步骤可能也需要编写一些应用组件(例如用户组件)。

为所管理的每个类型 的数据创建一个 模型 类。 Creating First Yii Application 和 Automatic Code Generation 中讲述的 Gii 工具可以用于快 速为每个数据表创建 active record 类。4.为每个类型的用户请求 创建一个 控制器 类。 具体如何对用户请求归类要看实际 需求。总体来说,如果一个模型类需要被用户访问,他就应该有一个相应的控制器类。 Gii 工具也可以自动实现这一步骤。

实现 动作 和他们相应的 视图。 这是真正所需要做的工作。

在控制器类中配置必要的动作 过滤器。

如 果需要主题功能,创建 主题 。

如果需要 国际化(I18N) ,创建翻译信息。

对可缓存的数据点和视图点应用适 当的 缓存 技术。

最终 调整 与部署。

上述的每个步骤中,可能需要创建并执行测试用例。

咨询热线:020-85648757 85648755 85648616 0755-27912581 客服:020-85648756 0755-27912581 业务传真:020-32579052
广州市网景网络科技有限公司 Copyright◎2003-2008 Veelink.com. All Rights Reserved.
广州商务地址:广东省广州市黄埔大道中203号(海景园区)海景花园C栋501室
= 深圳商务地址:深圳市宝源路华丰宝源大厦606
研发中心:广东广州市天河软件园海景园区 粤ICP备05103322号 工商注册