cat-album类包下载:
cat-album原代码下载:
cat-album示例下载:
cat-album版本历史:
cat-albumAPI参考文档:coming soon…
cat-album是一款开源相册程序,{zx1}的版本是1.13
cat-album是从相册程序的开发过程中演变而来的。它对相册的皮肤,数据与播放控制进行了很好的分离,从而方便了在cat-album的基础上进行自定义开发。cat-album的核心只是一个图片播放区域和自动播放功能,只要准备好相册数据(),实例化一个AlbumPlayer对象,把数据对象作为{wy}必须的参数写入AlbumPlayer对象,一个最基本的相册就生成了。
当然cat-album不只这样简单,它提供了丰富的功能:
可以设置外调皮肤文件() ,
可以加入转场效果(),
可以添加缩略图导航功能(参看cat-album缩略图模块),
可以从外部访问相册(参看从外部访问cat-album)的公共控制方法来实现对相册的控制。
目前catAlbum只有一种图片播放效果:当前图片渐隐,然后播放转场同时下一张图片放大进入的效果,在未来的版本中,将把图片播放效果分离出来,作为插件提供下载,从而实现丰富多样的相册图片播放效果。
cat-album可以用来做什么(以下例子是用cat-album模仿开发,体验原本的相册与轮播器请去官网)
–用于开发flash相册
–用于开发图片轮播放器
cat-album程序的API介绍
设置皮肤的方法
setAlbumSkin(skin:Object)
/**
* setAlbumSkin方法可以在皮肤文件加载成功后,把皮肤对象设置为albumPlayer的皮肤文件
* @param skin 是一个Object,皮肤swf文件要按提供的示例文件制作,
* 皮肤文件中需要提供返回各皮肤模块的公共方法,以让相册获取相应的模块。
* @example 下面例子是外调皮肤文件,并把加载到的皮肤设置与albumPlayer的皮肤。
*
* var albumSkin:Object;
* var __albumSkin:Class;
* var skinUrl:String = "./skin/albumSkin.swf";
* loadSkin();
*
* function loadSkin():void {
* var loadSkin:Loader = new Loader();
* var context:LoaderContext = new LoaderContext();
* context.checkPolicyFile=true;
* context.applicationDomain=new ApplicationDomain(ApplicationDomain.currentDomain);
* loadSkin.load(new URLRequest(skinUrl));
* loadSkin.contentLoaderInfo.addEventListener(Event.COMPLETE,skinLoadedFunc);
* }
* function skinLoadedFunc(e:Event):void {
* __albumSkin=e.target.applicationDomain.getDefinition("AlbumSkin") as Class;
*
* albumSkin = new __albumSkin();
* albumPlayer.setAlbumSkin(albumSkin);
* trace("[Skin loaded successfully!]");
* }
*
* @return void
**/
设置转场的方法
setTransition(tansArr:Array,tranSwf:Object)
/**
* setTransitionMask方法可以在转场文件加载成功后,把转场对象设置为albumPlayer的转场文件
* @param tansArr 每张图片对应的转场编号,这是一个数组
* @param tranSwf 是一个Object,转场swf文件中需要包含返回每一种转场效果对象的公共方法
* @example 下面例子是外调转场文件,并把加载到的转场设置与albumPlayer的转场。
*
* var __tranSwf:Class;
* var tranSwf:Object;
* var transUrl:String = "./transition/albumTransition.swf";
* loadTransition();
*
* function loadTransition():void {
* var loadTrans:Loader = new Loader();
* var transContext:LoaderContext = new LoaderContext();
* transContext.checkPolicyFile=true;
* transContext.applicationDomain=new ApplicationDomain(ApplicationDomain.currentDomain);
* loadTrans.load(new URLRequest(transUrl),transContext);
* loadTrans.contentLoaderInfo.addEventListener(Event.COMPLETE,transitionLoadedFun);
* }
* function transitionLoadedFun(e:Event):void {
* __tranSwf=e.target.applicationDomain.getDefinition("AlbumTransition") as Class;
* tranSwf = new __tranSwf();
*
* albumPlayer.setTransition(albumData["transArr"],tranSwf);
* trace("[Transition loaded successfully!]");
* }
*
* @return void
**/
获取相册信息的只读属性
autoState:Boolean 相册自动播放状态
title:String 相册标题
total:int 相册总图片数
current:int 相册当前图片序号
page:int 相册当前缩略图分页数
totalPage:int 相册总缩略图分页数
text:String 相册当前图片的文字内容
侦听相册事件
updateAlbum事件
//这个事件可以在切换图片时,实时更新相册当前图片数,缩略图分页数,图片文字
var albumPlayer:AlbumPlayer=new AlbumPlayer(albumData);
albumPlayer.addEventListener("updateAlbum",updateAlbum);
function updateAlbum(e:Event):void{
cPanel_top.imgtxt.text = (albumPlayer.current+1)+"/"+(albumPlayer.total+1);
cPanel_bottom.pagetxt.text = albumPlayer.page+"/"+albumPlayer.totalPage;
}
syncAutoState事件
//这个事件可以在自动播放状态切换时,实时更新自动播放按钮ui状态
var albumPlayer:AlbumPlayer=new AlbumPlayer(albumData);
albumPlayer.addEventListener("syncAutoState",syncAutoState);
function syncAutoState(e:Event):void{
if(albumPlayer.autoState){
autoPlayBtn.gotoAndStop(2);
}else{
autoPlayBtn.gotoAndStop(1);
}
}
registThumbModule方法注册生成缩略图导航功能
registThumbModule(prePageBtn:Sprite=null,nextPageBtn:Sprite=null,dragBar:Sprite=null):void
/**
* registThumbModule方法用于添加缩略图导航模块。如果你有使用外调皮肤,就不能再使用这个方法,
* 可以在外调皮肤中修改翻页与拖动按钮的外观,然后设置albumPlayer.thumbEnabled=true,打开albumPlayer的缩略图模块即可。
* @param prePageBtn 用于缩略图导航翻页,上一页按钮
* @param nextPageBtn 用于缩略图导航翻页,下一页按钮
* @param dragBar 用于拖拽缩略图翻滚的拖动按钮,
如果不需要拖动功能请不用传入dragBar参数,并设置相册对象的属性thumbDragEnabled = false;
* @return void
**/
全屏ui控制方法
public function fullScreenShow(showMap:Array):void
/**
* 把只在全屏时显示的内容,面板或功能条放在showMap数组中,使用showMap作为参数执行fullScreenShow,
* 那么这些显示对象就会在全屏的时候显示出来,退出全屏状态时则消失。
* @param showMap
* @return void
**/
public function fullScreenPark(parkMap:Array):void
/**
* 把全屏与退出全屏时都显示,但全屏时停靠在屏幕的”top”,”right”,”bottom”,”left”四种位置上,
* 把相关设置做成对象,把每一个对象放在parkMap中,使用parkMap作为参数执行fullScreenPark。
* 每个对象的书写格式:parkMap = [{target:cPanel_top,align:"top",offset:0,pad:cPanel_top.height},
* {target:cPanel_bottom,align:"bottom",offset:0,pad:cPanel_bottom.height}]
* 其中offset可以设置为直接的数字也可以设置为”right”,”center”,”left”,”top”,”bottom”
* @param parkMap
* @return void
**/
public function fullScreenHide(hideMap:Array):void
/**
* 把只在进入全屏时消失的内容,面板或功能条放在hideMap数组中,使用hideMap作为参数执行fullScreenHide,
* 那么这些显示对象就会在进入全屏状态时消失,退出全屏的时候显示出来。
* @param hideMap
* @return void
**/
相册控制方法
next():void 下一张图片
pre():void 上一张图片
play()void 开始自动播放
stop():void 停止自动播放
first():void {dy}张图片
last():void {zh1}一张图片
prePage():void 缩略图翻到前一页
nextPage():void 缩略图翻到后一页
firstPage():void 缩略图翻到{dy}页
lastPage():void 缩略图翻到{zh1}一页
goto(n:int):void 指定到第几张
mute(state:Boolean):void 静音
setVolume(n:Number):void 设置音量
fullScreen():void 全屏
openEffect(state:Boolean):void 打开动画与相框效果
设置模块位置的属性:
各模块是指区域
设置图片区域位置
imageX:Number
imageY:Number
设置播放框区域位置
playerX:Number
playerY:Number
设置控制面板区域位置
cPanelX:Number
cPanelY:Number
设置缩略图导航区域位置
thumbX:Number
thumbY:Number
设置播放框环绕功能条区域位置
aroundBarX:Number
aroundBarY:Number
设置相册图片的文字内容区域位置
albumTextX:Number
albumTextY:Number
设置相册标题区域位置
titleX:Number
titleY:Number
设置是否自动播放,自动播放间隔
autoPlay:Boolean 设置是否自动播放
autoTime:Number 设置自动播放间隔
设置切换图片时是否中断自动播放,切换图片是否放大进入
gotoStop:Boolean 设置切换图片时是否中断自动播放
scaleIn:Boolean 设置切换图片是否放大进入
附:与缩略图导航相关的属性
设置整个缩略图区域位置
thumbX:Number
thumbY:Number设置每张缩略区的内外边距与边线的borderSize
thumbMargin:Number 内边距
thumbPad:Number 外边距
thumbBorder:Number 边线粗细设置每张缩略图的高宽
thumbWidth:Number
thumbHeight:Number每张缩略图背景区域的色与透明度
thumbBgColor:uint
thumbBgAlpha:Number每张缩略图图片区域的背景色与透明度(这个图片背景不包括缩略图内边距与边线区域)
thumbImgBgColor:uint
thumbImgBgAlpha:Number当前图片边的边线色与透明度
thumbCurrentColor:uint
thumbCurrentAlpha:NumberthumbDirection:String 缩略图是水平走向还是垂直走向可设置为”x”或”y”
pageNum:int 每页缩略图的总缩略图数
thumbDragEnabled:Boolean 是否开启缩略图拖拽翻动功能