搜索
aardio官方社区 门户 查看主题

HTMLayout中使用aardio10模板语法

发布者: Jacen.He | 发布时间: 2016-3-12 03:32| 查看数: 3567| 评论数: 14|帖子模式

不仅仅是做网页可以使用模板语法,用HTMLayout写桌面软件界面也可以使用相同的模板语法,
需要用到HTML文件的地方可以直接把后缀名改为 aardio,就可以在里面嵌入aardio代码了,页内的HTML超链接都可以改为*.aardio文件链接,

一个最简单的例子:
import win.ui;
/*DSG{{*/
var winform = win.form( text="HTMLayout 使用模板语法" )
/*}}*/

import web.layout;
var wbLayout = web.layout(winform)
  
wbLayout.html =
/**
<!doctype html>
<html><head></head><body>
    <?
for(i=1;100;1){ ?>
        <div>
            循环次数<?
= i ?> 当前时间   <?= time() ?>
        </div>
    <?
} ?>
</body>
</html>
**/

winform.show()
win.loopMessage();

最新评论

Jacen.He 发表于 2016-3-12 03:33:12

aardio模板语法说明

在aardio代码中直接支持HTML模板语法。
一、一个aardio文件,即可以是纯aardio代码,也可以是纯HTML,也可以是HTML、aardio相互混合的模板代码,aardio都能自动识别并解析。

二、aardio源代码文件里可以直接书写HTML代码,在HTML代码中aardio代码必须置于 <? ..... ?> 内部,,类似PHP的模板语法, 但是要注意与PHP的区别是,aardio规定开始标记  <? 必须独立不能紧跟英文字母,例如 <?xml.....  不是合法的aardio代码段开始标记(aardio会认为这是一个XML标记)。 另外,aardio总是忽略?>后面或文件开始的空白字符(包含空格、制表符,换行,全角空格)。

三、在一个aardio文件中如果混合了HTML代码,aardio将<? ..... ?> 之外的部分解析为: print("HTML代码") 以调用全局函数print输出HTML。
关于print函数的规则:
   1)、print允许接收多个参数,并且必须对每个参数调用tostring()转换为字符串
   2)、在一个aardio文件解析结束时,print函数将收到一个null参数调用

四、可以使用 <?=表达式?> 输出文本,该代码的作用类似于 print( 表达式 )

五、aardio文件应当并且只能以UTF-8编码保存,不建议添加UTF8 BOM(如果添加了BOM,aardio仍然会自动移除)

六、aardio编辑器支持识别以上语法编辑HTML模板文件,可直接将HTML模板代码复制到aardio编辑器中运行并生成网页。

aardio开发环境也可以直接支持解析运行HTML模板,可新建一个aardio源码文全,复制下面的源代码粘帖到aardio编辑器中
<!doctype html>
<html><head><meta charset="utf-8"><title>帮助页面</title></head>
<body>当前时间<?
= time() ?>
</body></html>

然后点【运行】按钮,可以看到立即生成了一个网页。
Jacen.He 发表于 2017-4-15 13:56:37

HTMLayout模板文件传递参数

所有HTMLayout中使用的URL链接,都可以直接在URL后面增加URL参数,例如:
  1.     <div id="header">
  2.           <include src="titlebar.aardio?a=123&b=value" />
  3.     </div>
复制代码


在aardio文件中使用 requset.get 获取URL参数(所有参数为字符串类型),例如:
  1. <?=request.get["a"] ?>
复制代码


或者用下面的方法获取参数也可以:
  1. <?=(...).a ?>
复制代码


wbLayout.go() 可以直接用第二个参数指定模板参数,例如:
  1. wbLayout.go("/layout/main.aardio",{
  2.         a="hello";
  3.         b=123;
  4. });
复制代码
Jacen.He 发表于 2017-4-15 14:03:55

CSS文件如何使用模板

实际上HTMLayout里任何文件都可以用aardio模板文件代替,CSS当然也可以。

但是要注意你不能直接把一个CSS文件复制到 aardio文件里,因为不符合aardio语法,CSS文件需要在前面加上模板标记,例如:

  1. <?
  2.         //这里是aardio代码,即使没有aardio代码也要有这个标记
  3. ?>
  4. html,body{
  5.     margin:0;
  6.     height:100%;
  7.     background:#fff;
  8.     overflow:hidden;
  9. }
复制代码


也可以简单一点只写一个  ?>也行,例如:




  1. ?>
  2. html,body{
  3.     margin:0;
  4.     height:100%;
  5.     background:#fff;
  6.     overflow:hidden;
  7. }
复制代码


这是为了告诉aardio,后面的CSS代码不是 aardio代码( 不要再用aardio语法去执行了 )
当然如果是HTML代码的话就不用这么做,aardio文件默认就能自动识别出HTML语法。
Jacen.He 发表于 2017-4-15 14:10:17

图像文件如何使用模板( 显示二维码的例子 )

HTMLayout里很酷的一个地方就是任何文件你都可以用模板来输出,
例如图像,下面是一个用模板显示二维码的例子:

首先在aardio工程中添加一个模板文件,例如 /images/qrcode.aardio,代码如下:
  1. import qrencode.bitmap;
  2. var qrBmp = qrencode.bitmap(request.get.data,tonumber(request.get.version),tonumber(request.get.level) );
  3. print( qrBmp.copyBitmapString(tonumber(request.get.width) : qrBmp.width,"*.jpg",100)  );//输出图像
复制代码


然后在HTMLayout的页面中就可以直接显示二维码了,HTML代码如下:
  1. wbLayout.html = /**
  2. <img src="\images\qrcode.aardio?data=www.aardio.com&level=2&width=300" style="margin:0 auto;">
  3. **/
复制代码


显示效果:
qr.jpg
Jacen.He 发表于 2017-4-15 14:14:54

使用嵌入式服务器加载aardio模板

我们还可以使用  wsock.tcp.simpleHttpServer 启动一个嵌入式的HTTP服务器,
这时候就可以象在网站上编程一样可以直接使用HTML模板语法,例如:

  1. import wsock.tcp.simpleHttpServer;
  2. wbLayout.go( wsock.tcp.simpleHttpServer.startUrl("/html/main.aardio") );
复制代码


非常方便的是wsock.tcp.simpleHttpServer 可以自动分配可用端口,并且可以支持aardio资源目录下的嵌入文件,这个方法加载aardio模板可以适用于所有嵌入式浏览器组件,例如  web.form,web.kit,web.layout 等等。
5e365 发表于 2016-3-12 12:22:57

赞!!之前有人想在htmlayout里使用js,现在可以写aardio代码来达到效果,可能还会更方便

赞!!之前有人想在htmlayout里使用js,现在可以写aardio代码来达到效果,可能还会更方便
hedogn 发表于 2016-3-14 11:34:16

看到这个帖子,真是想哭,太激动了。 多少年的梦想,终于实现了。 曾经用HTMLayout开发桌面,梦想桌面啥时候也可以用asp方式开发开发。终于有一个优雅的

看到这个帖子,真是想哭,太激动了。
多少年的梦想,终于实现了。
曾经用HTMLayout开发桌面,梦想桌面啥时候也可以用asp方式开发开发。终于有一个优雅的解决方案了。
这可大大降低了HTMLayout的使用难度,不用再费劲的拼接字符串了,以后写数据库管理方面的程序将会太简单了。
aardio威武!
hedogn 发表于 2016-3-17 19:43:43

asp中可以使用aa.asp?id=25的方式,然后时候request("id")获取该值。 如果想给打开的*.aardio模板传递一个参数,怎么办? 例如

asp中可以使用aa.asp?id=25的方式,然后时候request("id")获取该值。
如果想给打开的*.aardio模板传递一个参数,怎么办?
例如在页面中加入下面的超链接新建一个叫YB25-2005的选项卡:
<a href="tabs://result.aardio?id=YB25-2005" target="YB25-2005" title="YB25-2005">YB25-2005</a>
希望result.aardio能根据参数(YB25-2005)生成相应的内容。或者有其他方式给result.aardio传递参数?
Jacen.He 发表于 2016-3-18 06:38:11

[quote][size=2][url=forum.php?mod=redirect&goto=findpost&pid=70888&ptid=13213][c

hedogn 发表于 2016-3-17 19:43
asp中可以使用aa.asp?id=25的方式,然后时候request("id")获取该值。
如果想给打开的*.aardio模板传递一个 ...
你的想法很好,新版已增加此功能,
模板文件最前面加上 var queryString = ... 接收参数。参考工程向导生成的范例。

你也可以在behavior中自己调用 string.loadcode() 函数直接解析模板文件,可以自定义调用参数。

另外注意aardio模板文件都共享一个全局名字空间,即使不传参数,全局变量都可以相互访问。
xx.sir 发表于 2016-3-23 11:48:43

HTMLayout中嵌入aardio代码的时候不能用连接运算符 “++”, 比如下面的代码不能执行,请你麻烦。 [code] import win.ui

HTMLayout中嵌入aardio代码的时候不能用连接运算符 “++”, 比如下面的代码不能执行,请你麻烦。


  1. import win.ui;
  2. /*DSG{{*/
  3. var winform = win.form( text="HTMLayout 使用模板语法" )
  4. /*}}*/

  5. import web.layout;
  6. var wbLayout = web.layout(winform)
  7.   
  8. wbLayout.html = /**
  9. <!doctype html>
  10. <html><head></head><body>
  11.     <? for(i=1;100;1){ ?>
  12.         <div>
  13.             循环次数<?= i ++"="++ time() ?>
  14.         </div>
  15.     <? } ?>
  16. </body>
  17. </html>
  18. **/

  19. winform.show()
  20. win.loopMessage();
复制代码
quicker 发表于 2016-3-23 12:35:18

[quote][size=2][url=forum.php?mod=redirect&goto=findpost&pid=70949&ptid=13213][c

xx.sir 发表于 2016-3-23 11:48
HTMLayout中嵌入aardio代码的时候不能用连接运算符 “++”, 比如下面的代码不能执行,请你麻烦。

你这个问题不是模板导致的,代码本身就写错了,错误信息里也提示了原因。

正确的是这样写:
<?= i ++"="++ tostring( time() ) ?>
time对象要先转换为字符串,不然怎么做连接呢?

xx.sir 发表于 2016-3-23 12:57:48

谢谢你。 , 这个直接出来, 那么 这个代码中“=” 这个符号的作用是对象转换字符串的吗? 我是用 php 的, 所以就一点晕了

谢谢你。
<?= time() ?> , 这个直接出来, 那么 这个代码中“=” 这个符号的作用是对象转换字符串的吗?
我是用 php 的, 所以就一点晕了
quicker 发表于 2016-3-23 13:28:26

[quote][size=2][url=forum.php?mod=redirect&goto=findpost&pid=70951&ptid=13213][c

xx.sir 发表于 2016-3-23 12:57
那么 这个代码中“=” 这个符号的作用是对象转换字符串的吗?  ...

当然可以转换,你这样写同样可以直接出来:
循环次数<?= i,"=",time() ?>

模板就会自动转换所有参数为字符串,自动连接字符串,这没错。
但是他转换的只是你传给他的参数,并不会改变aardio基本语法,改变 ++ 操作符的行为。

你的数据还没有传给HTMLayout模板之前就已经出错了。
aardio作为弱类型语言自动转换已经属于比较多,过多的自动隐式转换没有好处,所以如果错误提示你某个对象不支持字符串连接操作,请明确添加 tostring( )


xx.sir 发表于 2016-3-30 11:41:51

谢谢回答,解决问题了

谢谢回答,解决问题了
四月物语 发表于 2017-4-15 11:32:30
Jacen.He 发表于 2016-3-18 06:38
你的想法很好,新版已增加此功能,
模板文件最前面加上 var queryString = ... 接收参数。参考工程向导生 ...

老大,有没有范例?
模板文件和html传递参数的范例
还有,css文件中能不能用模板语法

点评

上面已补充教程  发表于 2017-4-15 14:17

手机版|未经许可严禁引用或转载本站文章|站长邮箱|aardio.com|aardio官方社区 ( 皖ICP备09012014号 )

GMT+8, 2017-11-23 21:00 , Processed in 0.156250 second(s), 27 queries , WinCache On.

Powered by Discuz! X3.4

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表