Media Resources
出自OpenFace
第十五章 媒体资源
第三部分 基本概念
本章描述怎样把外部媒体资源(图片,动画)包含到OpenLaszlo 程序中来.
目录 |
概述
LZX被设计成易于灵活动态的将媒体资源结合到应用程序中.你可以包含使用第三方内容创建工具创建的图片,和动画.本章描述了OpenFace支持的媒体模式.继而描述如何在应用程序中使用和控制媒体.
支持的媒体类型
OpenFace支持以下媒体类型:
JPEG
所有.jpg or .jpeg 文件都支持.详见W3C JPEG JFIF 说明.
GIF
所有.gif文件都支持.详见GIF说明.
PNG
所有PNG(便携式网络图形)文件都支持.这其中包含带有透明度的PNGs
以上对媒体支持和它们在各种运行环境下的配置请参阅OpenLaszlo Wiki.
视图和资源
在OpenFace应用中<view>是最基本的可视元素的一种，将在视图那章对其具体描述。资源可以附加在视图上。资源代表着视图控制的一系列媒体（图片或动画）。对于图像来说，通过视图来显示图片。对于时间媒体（动画），视图能通过开始、停止来控制动画。
一些简单的关于视图附加资源的介绍，见第８章 媒体和艺术要素。本章你可以由简入深的读到使用指南。
资源能直接在视图中，通过resource属性来使用：
Example 15.1. 引入资源
<canvas height="110"> <view resource="logo.gif"/> </canvas>
或先用<resource>来引入图片，然后在视图中使用：
Example 15.2. 声明资源
<canvas height="110"> <resource name="myname" src="logo.gif"/> <view resource="myname"/> </canvas>
资源不是视图
注意<resource>本身并不是一个视图。资源没有x和y坐标、背景颜色或任何视图所拥有的属性。在应用中资源如果不附加在视图上，那么是不可见的。为了能对资源进行操作，你需要把资源附加在视图中来操作。
对资源起作用的API摘要
能使用一些视图的API（方法、字段、事件）来控制视图中的资源。
资源和视图大小，缩放比例和拉伸：
资源的声明和命名:
当一个资源被声明后，它必须有个名字。资源的名字在整个应用中是全局的。资源标签仅仅能作为<canvas>或<library>标签的子标签。
这种风格的资源共享使得它更简单地从代码中分离出来，并能够提高设计者、开发者的交互。
当你引入了没有名字的资源时，在第一个例子中，LZX编译器会分派唯一的名字给这个资源。
当两个资源分享同一个未定义的名字时。因此你应该确定每个资源有唯一的适当的名字。
多帧资源
Laszlo支持资源的<frame>概念。多帧资源是有单一的名字，但按次序引用了多个独立的媒体。这是一个简单的声明多帧资源的例子：
Example 15.3. 声明多帧资源
<canvas height="180">
<resource name="myresource">
<frame src="logo.gif"/>
<frame src="sky.jpg"/>
</resource>
<simplelayout spacing="5"/>
<view id="myview" resource="myresource"/>
<view layout="axis: x; spacing: 3">
<text>Frame:</text>
<handler name="onkeydown" reference="LzKeys" args="key">
var keycode=key.intValue();
if(keycode==37) myview.setResourceNumber(2);
else if(keycode==39) myview.setResourceNumber(1);
</handler>
</view>
</canvas>
多帧资源对于显示不同外观的可视元素或控件的结构也有帮助：
Example 15.4. 使用多帧资源
<canvas height="120">
<resource name="mybutton_rsrc">
<frame src="1.gif"/>
<frame src="2.gif"/>
<frame src="3.gif"/>
</resource>
<view resource="mybutton_rsrc">
<handler name="onkeydown" reference="LzKeys" args="k">
var key=k.intValue();
if(key==37) this.setResourceNumber(2)"
if(key==38) this.setResourceNumber(1)"
if(key==39) this.setResourceNumber(3)"
</handler>
</view>
</canvas>
资源加载
在以上的例子中，我们是依靠视图声明资源。当我们不能把应用中需要的资源位置确定时，LZX提供给我们了一种弹性地向应用中加载资源的办法。大多数的选择是，在编译时装载资源还是在运行时间装载资源。
编译时资源
在应用中资源以二进制的形式被装载进来，并且在初始应用时被下载下来。
Example 15.5. 编译时包含资源
<resource name="myname" src="resources/logo.gif"/>
有效的使用编译时包含资源：
运行的应用程序中，小资源都始终是固定的。
应用中所有用户都需要使用的资源。
运行时资源
在运行时加载资源有两种主要的方式。第一种是通过视图的resource属性使用专门的语法。如果为这个属性值指定一个HTTP连接，那么编译器会假设这个资源应该在运行时加载：
Example 15.6. 运行时载入资源
<canvas height="180"> <view resource="http:../resources/logo.gif"/> </canvas>
第二种方法是使用LzView.setSource()方法。下面的例子与先前的例子是等效的：
Example 17.8. 运行时通过脚本载入资源
<canvas height="180">
<view oninit="this.setSource('http:../resources/logo.gif')"/>
</canvas>
注意
LzView.setSource()提供了对资源加载更多的控制。使用这个方法，你能：
选择在服务器或客户端缓冲资源；
指示服务器用一个具体协议指定链接，以获取资源；
通过HTTP请求来获得资源。
