ThinkPHP Mobile使用方法简明教程

我们知道ThinkPHP的模板也是用HTML,CSS,JS 开发的。所以我们想能否将ThinkPHP的模板直接打包成手机APP？让我们能一次开放同时拥有电脑版网站，手机版网站和手机APP，因此才有了TPM的诞生。TPM能让我们将ThinkPHP的模板打包成一个HybridApp。

2.手机APP的一般架构

很多手机APP的数据都是动态获取的，我们需要给APP提供接口，让APP请求接口获取数据。不管你是开发NavtiveApp 还是 HybridApp，都需要给APP提供接口。

传统的HybridApp 开发方式任然需要我们为APP开发一个接口程序，我们还要用js写调用接口的ajax的代码。
如果使用TPM开发，不用特意写接口程序，也不用写ajax调用接口的程序。我们还是按照开发网站的方式开发手机客户端，在
Action中指派模板变量，在模板中使用模板变量。当我们将模板打包成APP时，APP能自动请求Action，然后渲染对应的模板，这时候请求Action时，Action会自动返回json格式数据。

3.其他手机开发的知识

我们要开发好手机APP，还需要了解更多手机开发的知识。手机的尺寸大小不一样，所有我们的界面一般不能写成固定尺寸的，要做响应式设计。建议大家了解一下响应式设计的知识。也可以结合一些UI框架，如bootstrap、purecss 他们自带对响应式的支持。建议大家再阅读一下《移动端webapp开发必备知识》 http://www.qianduan.net/mobile-webapp-develop-essential-knowledge.html

二、环境搭建

首先你需要建立一个包含TPM的ThinkPHP项目。你可以在ThinkPHP官方网站上下载TPM，也可以中github中获得。 Github的地址是： https://github.com/liu21st/extend/tree/master/Extend/Tool/TPM 将下载的文件中， Tpl目录下的文件复制到你的项目文件夹下Tpl目录中。将SwitchMobileTplBehavior.class.php 复制到项目目录下 Lib/Behavior 目录下，将TemplateMobile.class.php 文件复制到 ThinkPHP/Extend/Driver/Template 下。项目需要开启layout ，在项目配置文件中配置：

如果想手机客户端支持页面跳转，需要修改核心文件 ThinkPHP/Common/functions.php 中得redirect函数，修改为：

将网址修改为你项目的真实访问地址。然后，我们可将模板目录打包成手机APP 。首先打开你的命令行， cd 到模板目录，运行命令：

然后我们发现在模板目录会生成手机APP文件，我们在手机上面安装即可。命令行打包程序需要你的环境开启zip和curl扩展，如果不清楚的话请自行百度解决。注意：打包命令需要联网，如果没有联网的话可以用第三方打包工具例如phonegap打包。

参数说明：

platform

name ：

package：

version:

三使用说明

1.运行原理

之前我们在部署项目的时候发现ThinkPHP开启了layout，其实浏览器浏览网站时使用的layout文件是Tpl/layout.html，而打包成手机APP后，layout文件其实是 Tpl/index.html ，我们用编辑器打开 Tpl/index.html文件，发现里面多加载了一个js文件：TPM.js 。在手机APP上运行时,TPM.js文件负责解析ThinkPHP模板标签和自动请求接口。 Tpl/index.html 中需要有这两个层：

TPM会把每次渲染模板的结果放到ID为main的层中。 class为ajax_wait的层是在请求接口的时候会显示，我们可以在css文件中定义ajax_wait的样式。

2.模板标签

我们知道在手机APP中并没用PHP运行环境，解析ThinkPHP模板标签的是js，ThinkPHP的大部分模板标签都可以正常使用，但也有一些限制，比如模板标签中不能用PHP的函数，所以也不能在模板中使用U函数。支持的ThinkPHP模板标签有： volist,foreach,for,empty,notempty,present,notpresent,eq,neq,heq,nheq,egt,gt,elt,lt,if,elseif,else,switch,case,default,in,notin,between,notbetween,include。

include标签在使用时有点限制，file属性必须写明控制器和方法，不能省略控制器。如

不能省略Action。如果有分组也不能省略分组。其他标签的用法不变。

TPM未实现的标签有： defined，define等

TPM未实现 __URL__，__PUBLIC__，__ROOT__，__SELF__ 等模板替换变量。

大家需要在模板中写固定的URL ，以斜杠开头。URL地址格式为： /Action/method

3.独立手机APP的模板

我们如果希望网站模板和手机APP模板分离，可以定义项目配置:

'mobile'

然后在Tpl目录下建立一个mobile文件夹。在mobile文件夹中放置手机APP的模板。这样如果是浏览器浏览网站首页，程序渲染的模板是Tpl/Index/index.html，如果是手机APP打开，渲染的首页模板是 Tpl/mobile/Index/index.html .

4.配置说明

Tpl/index.html文件中需要加载TPM.js以及运行TPM ，运行TPM的代码是：

TPM.run传递的config参数是配置项。以对象形式传递。可以设置的主要配置有：

api_base：

项目入口文件地址,http开头。

api_index：

首次请求的控制器方法，默认为/Index/index 下面举例说明一下这些配置项。假设我们创建了一个项目，入口文件的浏览地址是 http://www.xxx.com/index.php,我们想手机APP打开的第一个页面不是首页，而是登陆页，登陆页的浏览地址假设是： http://www.xxx.com/index.php/Index/login

那么TPM.run的传参如下：

如果你的项目做了隐藏入口文件的处理，那么api_base也可以不写入口文件，配置为：

如果只想配置api_base这个参数，其他参数使用默认值，只传递一个网址作为参数：

5.元素监听

我们做一些js效果，往往会监听元素事件，比如：

$(document).ready(function(){ $('#id').click(function(){ alert('click'); }); });

ThinkPHP Mobile使用方法简明教程

1.手机APP的类型

WebApp

NativeApp

HybridApp

2.手机APP的一般架构

3.其他手机开发的知识

二、环境搭建

参数说明：

platform

name ：

package：

version:

三使用说明

1.运行原理

2.模板标签

3.独立手机APP的模板

4.配置说明

api_base：

api_index：

5.元素监听

ThinkPHP Mobile使用方法简明教程

1.手机APP的类型

WebApp

NativeApp

HybridApp

2.手机APP的一般架构

3.其他手机开发的知识

二、环境搭建

参数说明：

platform

name ：

package：

version:

三 使用说明

1.运行原理

2.模板标签

3.独立手机APP的模板

4.配置说明

api_base：

api_index：

5.元素监听

三使用说明