GifImage

立即使用

open close show hide reset

概述

本模块可在指定位置显示一张 Gif 图，原生实现，节省内存，提高性能。可自定义大小、位置等。支持同一页面打开多个模块，并以 ID 区分。可通过模块 ID 移动、显示、隐藏、关闭已经打开的模块。

关于AVM方式

本模块支持 AVM 方式打开。通过 AVM 标签方式打开的模块，在 js 代码中需要通过 document.getElementById 的形式获取该模块实例对象然后进行其它逻辑的操作（setGif、hide、show）。否则会产生莫名其妙的问题。

示例：

<mo-gifimage id="engine3GifImage"></mo-gifimage>

该模块同时也支持 api.require 方式调用，通过 open 接口相当于 AVM 的标签打开了一个GIF图片显示区域的 frame（view）模块。

模块接口

setGif

设置通过 AVM 方式打开的模块的 GIF 图片

setGif({params},callback(ret))

params

path：

  • 类型：字符串
  • 描述：本地图片路径，支持fs://、widget://

示例代码

var GifImage = document.getElementById('engine3GifImage');
GifImage.setGif({
  path:'widget://res/gif.gif'
})

可用性

iOS 系统，Android 系统暂不支持AVM方式打开

可提供的 1.0.0 及更高版本

open

在指定页面显示一张 GIF 图片

open({params},callback(ret))

params

path：

  • 类型：字符串
  • 描述：本地图片路径，支持fs://、widget://

rect：

  • 类型：JSON 类型
  • 描述：（可选项）GIF 图片显示区域的位置及大小
  • 内部字段：
{
    x: 0,        //（可选项）数字类型；模块左上角的 x 坐标（相对于所属的 Window 或 Frame）；默认值：0
    y: 0,        //（可选项）数字类型；模块左上角的 y 坐标（相对于所属的 Window 或 Frame）；默认值：0
    w:300,       //（可选项）数字类型；模块宽度（相对于所属的 Window 或 Frame;默认：100%
    h:600        //（可选项）数字类型；模块高度（相对于所属的 Window 或 Frame;默认：100%
}

fixedOn：

  • 类型：字符串类型
  • 描述：（可选项）模块添加到指定 frame 的名字（只指 frame，传 window 无效）
  • 默认：预览窗口依附于当前 window

fixed:

  • 类型：布尔
  • 描述：（可选项）预览窗口是否随所属 window 或 frame 滚动
  • 默认值：true（不随之滚动）

callback(ret)

  • 类型：JSON对象
  • 描述：回调模块ID
  • 内部字段：
{
     status:true, //布尔类型，是否成功打开
     ID:'',        //字符串类型；打开的 Gif 图片的 ID
     message:'' //status为false时返回错误信息
}

示例代码

var GifImage = api.require('GifImage');
GifImage.open({
  rect:{
    x:,
    y:,
    w:,
    h:
  },
  fixedOn:'',
  fixed:false
},function(ret){
   api.alert({msg:JSON.stringify(ret)});
})

可用性

iOS 系统，Android 系统

可提供的 1.0.0 及更高版本

close

关闭打开的 Gif 图片

close({params})

params

ID：

  • 类型：字符串
  • 描述：Gif 图片的 ID

示例代码

var GifImage = api.require('GifImage');
GifImage.close({
  ID:
})

可用性

iOS 系统，Android 系统

可提供的 1.0.0 及更高版本

show

显示打开的 Gif 图片

show({params})

params

ID：

  • 类型：字符串
  • 描述：Gif 图片的 ID

示例代码

var GifImage = api.require('GifImage');
GifImage.show({
  ID:
})
//显示avm方式打开的模块
var e3GifImage = document.getElementById('engine3GifImage');
e3GifImage.show();

可用性

iOS 系统，Android 系统

可提供的 1.0.0 及更高版本

hide

隐藏打开的 Gif 图片

hide({params})

params

ID：

  • 类型：字符串
  • 描述：Gif 图片的 ID

示例代码

var GifImage = api.require('GifImage');
GifImage.hide{
  ID:
})

//隐藏avm方式打开的模块
var e3GifImage = document.getElementById('engine3GifImage');
e3GifImage.hide();

可用性

iOS 系统，Android 系统

可提供的 1.0.0 及更高版本

reset

重设指定 GIF 图片的位置和大小

reset({params})

params

ID：

  • 类型：字符串
  • 描述：重设的 Gif 图片的 ID

rect：

  • 类型：JSON 类型
  • 描述：（可选项）GIF 图片显示区域的位置及大小
  • 内部字段：
{
    x: 0,        //（可选项）数字类型；模块左上角的 x 坐标（相对于所属的 Window 或 Frame）；默认值：0
    y: 0,        //（可选项）数字类型；模块左上角的 y 坐标（相对于所属的 Window 或 Frame）；默认值：0
    w:300,       //（可选项）数字类型；模块宽度（相对于所属的 Window 或 Frame;默认：100%
    h:600        //（可选项）数字类型；模块高度（相对于所属的 Window 或 Frame;默认：100%
}

示例代码

var GifImage = api.require('GifImage');
GifImage.reset({
  rect:{
    x:,
    y:,
    w:,
    h:
  }
})

可用性

iOS 系统，Android 系统

可提供的 1.0.0 及更高版本