第六课视图

上节课我们了解了控制器的用法，控制器执行到最后，会跳转到一个界面，用于显示数据，这个用于显示数据的html文件，我们就称之为视图。

一、视图目录

iWebShop的视图存放目录位于views下，views下每个目录为一个主题，default为系统前台的默认主题，sysdefault为系统后台默认主题，syssellers为商家后台的主题，mobile为手机端的主题。下面以default为例，说明目录结构：

javascript为该主题要使用到的js文件
layouts存放的为视图布局文件(后面详解)
skin为该主题要使用到的皮肤css文件
simple，site，ucenter为控制器的名称，每个控制器对应一个目录，目录下的每个文件默认对应控制器中的Action（如在URL解析控制器Action时，如果在控制器程序中找不到Action的定义，就会直接跳转到该视图）
config为该主题的配置文件
preview.jpg为主题的预览图，只在后台选择主题可以见到.

二、conifg.php文件

default主题的config文件如下：

<?php
return array(
	"name"    => "锦绣前程",    //主题名称
	"author"  => "aircheng",    //主题作者
	"time"    => "2014/12/29 10:03:05",     //制作时间
	"version" => "3.0",     //主题版本
	"thumb"   => "preview.jpg",     //主题预览图
	"info"    => "默认主题方案，此主题适用于3.0.0 系列产品",    //主题描述信息
	"type"    => "商城前台-PC",     //主题类型
);
?>

主要是定义主题的一些基本信息。

三、视图布局 layout

官方解释

简单说下 iWebShop 的 layout（布局），对于一般网页视图来说，基本的结构形式都是固定好的，比如网页的头部，页脚底部，公共样式，公共 js 类库等等，所有这些公共的部分我们把它抽象出来，做成一个 layout 模板（html形式的），layout 存在于每个主题模板的 layouts目录中，可以为不同的控制器（controller），动作（action）指定不同的布局，比如网站的首页和网站的注册页面头部布局就可以不同：

简单来说，layouts的作用就是把公用的代码提取出来，提高代码的使用率。具体的开发方式会在主题开发的过程中说明。

layouts设置

官方提供了以下三种方法设置layouts

（1）在控制器（controller）中增加 public $layout 公共属性，表示这个控制器下的所有视图都默认用这个布局，如下：

<?php
class Test extends IController
{
  public $layout="site";
  public function helloworld(){
    echo "hello world";
  }
}
?>

（2）我们也可以在主题目录下的 config.php 文件中配置 layout 布局。

<?php
return array(
	"name"    => "锦绣前程",
	"author"  => "aircheng",
	"time"    => "2014/12/29 10:03:05",
	"version" => "3.0",
	"thumb"   => "preview.jpg",
	"info"    => "默认主题方案，此主题适用于3.0.0 系列产品",
	"type"    => "商城前台-PC",
  	"layout" => array("simple" => "site")   //增加这一句
);
?>

如果我们希望 simple 下面有个视图reg使用 site_mini 的 layout 布局就应该这么写：
layout => array(‘simple’ => ‘site’,‘simple@reg’ => ‘site_mini’)

注意：iWebShop 用@符号表示包括子关系，比如 site@index 表示的就是 site 控制器下的 index 方法。

（3）也可以在每个动作（action）方法里面临时设置 layout 比如：

<?php
class Test extends IController
{
    public function helloworld(){
        $this->layout = "site";
        echo "hello world";
    }
}
?>

四、视图开发举例

把上节课的控制器代码改为,高亮的代码表示跳转到”helloworld”这个视图。

<?php
class Test extends IController
{
    public function helloworld(){
        $this->redirect("helloworld");
    }
}
?>

在views/default建立文件夹test，再建立一个html文件helloworld，输入以下代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>hello</title>
</head>
<body>
三众简悦iWebShop开发教程
</body>
</html>

显示效果如下：

如有不明白的地方，留言或是加入我们 “三众技术QQ交流群”一起讨论

关于我们

三众科技资讯平台——大道至简，悦你所阅！
>本教程由三众简悦原创，转载请注明出处，作者：bobball，由bobo整理成牛骨文书籍

三众技术交流群：543102562

欢迎大家加入我们，共同讨论IT，互联网技术。同时可以扫描下面的二维码关注我们，谢谢！

三众科技服务号

第六课 视图