import { _decorator, assetManager, Color, Component, ImageAsset, Node, Size, Sprite, SpriteFrame, Texture2D, tween, Tween, UIOpacity, UITransform, Vec3 } from 'cc'; import { ani_frame, att_ani_data, event_item, widget_item_data } from '../../../data/data'; import { gameManager } from '../gameManager'; import { ClientEvent } from '../../clientEvent'; import { config } from '../../config'; import { tools } from '../../tools'; import { scene_page } from '../scene_page'; const { ccclass, property } = _decorator; class BindTarget{ color : Color; opacity:number; size:Size; pos:Vec3; rotation:number; anchorPointX:number; anchorPointY:number; scale:Vec3; } @ccclass('widget_base') export class widget_base extends Component { @property(Node) icon:Node = null; protected mData:widget_item_data = null; protected mAnimationList:att_ani_data[] = []; //动画组 protected mCurRunAnimation:ani_frame[] = []; protected mCurAnimation:att_ani_data = null; protected mPlayStatus:boolean = false; protected mIsFinish:boolean = false; protected mIsActive:boolean = false; protected mIsShow:boolean = false; private bindTarget:BindTarget = null; protected isInit:boolean = true; protected initWidget(data:widget_item_data){ this.mData = data; this.icon.getComponent(UITransform).contentSize = new Size(this.mData.att.width,this.mData.att.height) this.icon.position = new Vec3(this.mData.att.x,this.mData.att.y) var anchor_x = 0.5 if(this.mData.att.anchor_x!=undefined&&this.mData.att.anchor_x!=null) { anchor_x = this.mData.att.anchor_x } var anchor_y = 0.5 if(this.mData.att.anchor_x!=undefined&&this.mData.att.anchor_x!=null) { anchor_y = this.mData.att.anchor_y } this.icon.getComponent(UITransform).setAnchorPoint(anchor_x, anchor_y) if(this.mData.att.rotation==undefined||this.mData.att.rotation==null) { this.icon.angle = 0 } else { this.icon.angle = this.mData.att.rotation } if(this.icon.getComponent(UIOpacity)===null){ this.icon.addComponent(UIOpacity) } if(this.mData.att.src.length>0){ this.icon.getComponent(Sprite).spriteFrame = gameManager.getCacheSpriteFrameByName(this.mData.att.src) } this.updateDir() this.mIsShow = this.mData.att.is_show; this.mIsActive = this.mData.att.is_interaction; this.mAnimationList = this.mData.att.animation_list; if(this.mIsShow){ this.node.active = true; this.onWidgetShow() }else{ this.node.active = false; } if(this.isInit){ this.init() }else{ this.node.position = Vec3.ZERO; this.icon.position = Vec3.ZERO; this.node.active = true; this.onWidgetShow() } // ClientEvent.on(config.EventRun.NOTICE_EVENT,this.beActive.bind(this),this) // ClientEvent.on(config.EventRun.WIDGET_HIDE,this.hide.bind(this),this) }; updateDir(){ switch (this.mData.att.img_dir) { case config.widget_scale_dir.left: this.node.scale = new Vec3(-1,1,1) break; case config.widget_scale_dir.up: this.node.scale = new Vec3(1,-1,1) break; case config.widget_scale_dir.normal: this.node.scale = new Vec3(1,1,1) break; } } protected onDestroy(): void { // ClientEvent.off(config.EventRun.NOTICE_EVENT,this.beActive.bind(this),this) } private getAniById(id:number){ if(this.mAnimationList.length>0){ for (let index = 0; index < this.mAnimationList.length; index++) { const element = this.mAnimationList[index]; if(id==element.ani_id){ return element; } } } return null; } onWidgetShow(){ this.node.active = true; this.mIsShow = true; if(this.mData.att.animation_list.length>0){ if(this.mData.att.animation_list[0].ani_frame_list.length<=0){ }else{ this.mCurAnimation = this.getAniById(this.mData.att.animation_list[0].ani_id) if(this.mCurAnimation){ this.mCurRunAnimation = this.mCurAnimation.ani_frame_list; if(this.mCurRunAnimation.length<2){ }else{ this.runAnimation() } }else{ return tools.showToast(`错误的动画配置!id:${this.mData.att.id}-请检查`) } } } } public hide(widgetId:number,event:event_item){ if(widgetId===this.mData.att.id){ this.mIsShow = false; this.node.active = false; } } public beActive(widgetId:number,event:event_item){ if(widgetId===this.mData.att.id){ if(event.type===config.event_type.hide){ this.hide(widgetId,event) return } if(!this.mIsShow){ this.onWidgetShow() } if(!this.mIsActive){ this.registeredEvent() } this.mIsActive = true; switch (event.type) { case config.event_type.play_ani: //播放一个动画 let event_data_nai = event.event_item_play_ani_data if(event_data_nai!=null){ this.mCurAnimation = this.getAniById(event_data_nai.ani_id) if(this.mCurAnimation){ this.mCurRunAnimation = this.mCurAnimation.ani_frame_list; this.runAnimation() }else{ return tools.showToast("错误的动画配置!请检查") } } break; case config.event_type.change_one_item_status: //改变自己的突变资源属性 let event_data_change_one_item_status = event.event_item_change_one_item_status_data if(event_data_change_one_item_status!=null){ // gameManager.initUiBaseAtt(this.icon,event_data_change_one_item_status.att) let att_res = event_data_change_one_item_status.att.res if(att_res.length > 0) { tools.loadUrl(att_res,this.icon.getComponent(Sprite)) } } break; case config.event_type.show_new_item: //显示自己同时被激活 break; case config.event_type.stop_active_event: //停止交互 this.mIsActive = false; break; // case config.event_type.collect_event: //自己被触发后,被收集类给收集 // break; // case config.event_type.active_event: //立刻被激活 // break; case config.event_type.be_event: //被动激活,等待被玩家交互 console.log("this.be_event",this.mIsShow) break; } } } runAnimation(){ if(this.bindTarget!=null){ Tween.stopAllByTarget(this.bindTarget) this.bindTarget = null; } if(this.mCurAnimation.isMove==undefined||this.mCurAnimation.isMove==null){ this.mCurAnimation.isMove = true; } // Tween.stopAll() let getFrameData = (index)=>{ let cur_frame:ani_frame =this.mCurRunAnimation[index]; let up_frame:ani_frame = index>0?this.mCurRunAnimation[index-1]:this.mCurRunAnimation[0]; return {"cur_frame":cur_frame,"up_frame":up_frame} } let cur_index = 0; let data = getFrameData(cur_index); let call_back = ()=>{ cur_index++; if(cur_index>=this.mCurRunAnimation.length){ if(this.mCurAnimation.isLoop){ cur_index = 0; }else{ this.mPlayStatus = false; this.onFinishAnimation() return; } } let data = getFrameData(cur_index); this.runFrame(data.cur_frame,data.up_frame,call_back) } this.runFrame(data.cur_frame,data.up_frame,call_back) } runFrame(frame:ani_frame,up_frame:ani_frame,call){ if(!frame || !up_frame) { return } let self = this; let tweenDuration: number = frame.next_time; // let origin_x = self.mCurRunAnimation[0].pos_x; // let origin_y = self.mCurRunAnimation[0].pos_y this.icon.getComponent(Sprite).spriteFrame = gameManager.getCacheSpriteFrameByName(frame.url) let n_pos:Vec3 = new Vec3(frame.pos_x,frame.pos_y) let _color = new Color() _color = _color.fromHEX(frame.color) this.bindTarget = new BindTarget(); let rotation = up_frame.rotation == undefined?0:up_frame.rotation this.bindTarget.rotation = rotation this.bindTarget.color = new Color().fromHEX(up_frame.color) this.bindTarget.opacity = up_frame.transparent; this.bindTarget.size = new Size(up_frame.size_width,up_frame.size_height) this.bindTarget.pos = new Vec3(up_frame.pos_x,up_frame.pos_y) up_frame.scale_x = up_frame.scale_x==undefined?1:up_frame.scale_x up_frame.scale_y = up_frame.scale_y==undefined?1:up_frame.scale_y frame.scale_x = frame.scale_x==undefined?1:frame.scale_x frame.scale_y = frame.scale_y==undefined?1:frame.scale_y this.bindTarget.scale = new Vec3(up_frame.scale_x,up_frame.scale_y) this.bindTarget.anchorPointX = up_frame.anchor_point_x==undefined?0.5:up_frame.anchor_point_x this.bindTarget.anchorPointY = up_frame.anchor_point_y==undefined?0.5:up_frame.anchor_point_y let color_opactiy_tw_size = tween(this.bindTarget) .to( tweenDuration, { scale:new Vec3(frame.scale_x,frame.scale_y),pos:n_pos,color: _color,opacity:frame.transparent,size:new Size(frame.size_width,frame.size_height),rotation:frame.rotation, anchorPointX:frame.anchor_point_x, anchorPointY:frame.anchor_point_y}, { onUpdate(tar:BindTarget){ self.icon.getComponent(Sprite).color = tar.color; self.icon.getComponent(UIOpacity).opacity = tar.opacity; self.icon.getComponent(UITransform).setContentSize(tar.size) self.icon.scale = tar.scale; // console.log('tar.anchorPointX_Y=',tar.anchorPointX,'-',tar.anchorPointY) self.icon.getComponent(UITransform).setAnchorPoint(tar.anchorPointX, tar.anchorPointY) if(self.mCurAnimation.isMove){ self.node.position = tar.pos } self.node.angle = tar.rotation; } }).call(()=>{ call() }); color_opactiy_tw_size.start(); } public getIsFinish():boolean{ return this.mIsFinish } public getIsShow():boolean{ if(this.icon.getComponent(UIOpacity).opacity==0||this.mIsFinish){ return false; } return this.mIsShow; } public getScenePage():scene_page { if(this.node.parent.name=="content"){ let parent = this.node.parent.parent.parent.parent let c_scene_page = parent.getComponent(scene_page) return c_scene_page } return null } protected registeredEvent(){ } public getIcon(){ return this.icon } public offEvent(){ this.node.off(Node.EventType.TOUCH_START) this.node.off(Node.EventType.TOUCH_END) this.node.off(Node.EventType.TOUCH_CANCEL) this.node.off(Node.EventType.TOUCH_MOVE) this.mIsFinish = true; } protected onFinishAnimation(){ }; //动画播放完成 protected onFinishEvent(){ this.offEvent() ClientEvent.dispatchEvent(config.EventRun.WIDGET_FINISH,this.mData.att.id) }; //完成自身 protected onFialEvent(){}; // 失败完成 protected init(){}; public initView(data:widget_item_data,is_init:boolean = true){ this.isInit = is_init; this.initWidget(data) }; public showZhaoButongFinishStatus(){} public hideZhaoButongFinishStatus(){} }