APP模板开发注意事项以及规范
HYBBS APP模板开发规范
模板开发涉及技术：
HTML
CSS
JavaScript
初级 PHP
模板引擎介绍 模板编译引擎还是一样使用HYPHP，依然支持HOOK,RE插件机制。依然支持{if for include foreach 等快捷标签}，APP模板虽然仍然支持PHP语言，但会有很大限制，无法再使用PHP语言输出数据到模板。
模板开发规范
头部文件必须命名为 header
尾部文件必须命名为 footer
后缀可以是.php或.html (推荐使用.php)
使用php作为模板后缀第一句代码必须是
<?php !defined('HY_PATH') && exit('HY_PATH not defined.'); ?>
下面才是正式模板内容header 头部文件head标签内必须提前定义三个常量
<script type="text/javascript">
//定义内核所需常量
window.VIEW_VERSION = '{#VIEW_VERSION}_'; //模板版本
window.DATA_VERSION = '{#DATA_VERSION}_'; //数据缓存版本
window.exp = '{#EXP}';
</script>然后到注入HTML5+API支持
<!-- 提前注入HTML5+ API --> <script src="html5plus://ready"></script>
最后加载核心JS文件
<!-- 核心JS资源 -->
<script src="{#RES_WWW}js/core.js?var={#CORE_VERSION}"></script>核心部分已完成
APP还需要加载 共用资源
<!-- 公用Js资源 -->
<script src="{#RES_WWW}js/mui.min.js?var={#JS_VERSION}"></script>
<script src="{#RES_WWW}js/function.js?var={#JS_VERSION}"></script>
<script src="{#RES_WWW}js/jquery.min.js?var={#JS_VERSION}"></script>
<script src="{#RES_WWW}js/webviewGroup.js?var={#JS_VERSION}"></script>
<!-- CSS -->
<link rel="stylesheet" href="{#RES_WWW}css/mui.min.css?var={#CSS_VERSION}"/>
这里可以加上你自己模板的css以及js文件APP默认采用MUI作为UI基础
APP初始化HTML5+API
<script> mui.init(); </script>
以上内容组成
<?php !defined('HY_PATH') && exit('HY_PATH not defined.'); ?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>标题</title>
<meta name="renderer" content="webkit">
<meta http-equiv="Cache-Control" content="no-siteapp"/>
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="format-detection" content="telephone=no">
<meta name="format-detection" content="email=no">
<script type="text/javascript">
//定义内核所需常量
window.VIEW_VERSION = '{#VIEW_VERSION}_'; //模板版本
window.DATA_VERSION = '{#DATA_VERSION}_'; //数据缓存版本
window.exp = '{#EXP}';
</script>
<!-- 提前注入HTML5+ API -->
<script src="html5plus://ready"></script>
<!-- 核心JS资源 -->
<script src="{#RES_WWW}js/core.js?var={#CORE_VERSION}"></script>
<!-- 公用Js资源 -->
<script src="{#RES_WWW}js/mui.min.js?var={#JS_VERSION}"></script>
<script src="{#RES_WWW}js/function.js?var={#JS_VERSION}"></script>
<script src="{#RES_WWW}js/jquery.min.js?var={#JS_VERSION}"></script>
<script src="{#RES_WWW}js/webviewGroup.js?var={#JS_VERSION}"></script>
<!-- CSS -->
<link rel="stylesheet" href="{#RES_WWW}css/mui.min.css?var={#CSS_VERSION}"/>
<link rel="stylesheet" href="{#THEME_WWW}css/app.css?var={#CSS_VERSION}"/> 自己模板 CSS
<link rel="stylesheet" href="{#THEME_WWW}icon/iconfont.css?var={#CSS_VERSION}"/> 自己模板的图标
<script>
//初始化HTML5+API
mui.init();
</script>
</head>
<body>额外内容
快捷重启APP 用于调试
<script>
//双击APP页面 重启APP
$(window).dblclick(function(){
plus.runtime.restart(); //重启APP API
});
</script>
登录后才可发表内容
返回：手机APP
APP模板开发
小黑屋社区
发表于 2018-1-8
支持 虽然看不懂
评论列表
加载数据中...
至上福利哥
发表于 2018-2-18
看看，学习
评论列表
加载数据中...