124 lines
4.3 KiB
TypeScript
124 lines
4.3 KiB
TypeScript
import { _decorator, Component, Enum, sys, director, UITransform, Widget, view, Vec3 } from 'cc';
|
|
const {ccclass, property} = _decorator;
|
|
|
|
export enum BGScaleType {
|
|
FULL_SCREEN,
|
|
SCALE_BY_WIDTH,
|
|
SCALE_BY_HEIGHT,
|
|
SCALE_ONLY_WIDTH,
|
|
SCALE_ONLY_HEIGHT,
|
|
}
|
|
|
|
export enum BGAlignmentType {
|
|
TOP,
|
|
BOTTOM,
|
|
CENTER,
|
|
LEFT,
|
|
RIGHT,
|
|
}
|
|
|
|
@ccclass
|
|
export default class BgScale extends Component {
|
|
@property({type: Enum(BGAlignmentType)})
|
|
alignmentType:BGAlignmentType = BGAlignmentType.CENTER;
|
|
@property({type: Enum(BGScaleType)})
|
|
scaleType:BGScaleType = BGScaleType.FULL_SCREEN;
|
|
|
|
private realW:number = 0;
|
|
private realH:number = 0;
|
|
private _resizeCallback:any = null;
|
|
|
|
protected onLoad ():void {
|
|
this.realW = this.node.getComponent(UITransform).width;
|
|
this.realH = this.node.getComponent(UITransform).height;
|
|
this.setMyFrameSize();
|
|
if (sys.isBrowser) {
|
|
this._resizeCallback = this.setMyFrameSizeAgain.bind(this);
|
|
window.addEventListener('resize', this._resizeCallback);
|
|
window.addEventListener('orientationchange', this._resizeCallback);
|
|
document.addEventListener('rotateScreen', this._resizeCallback);
|
|
document.addEventListener('resetScreen', this._resizeCallback);
|
|
}
|
|
}
|
|
|
|
protected onDestroy():void {
|
|
if (sys.isBrowser) {
|
|
window.removeEventListener('resize', this._resizeCallback);
|
|
window.removeEventListener('orientationchange', this._resizeCallback);
|
|
document.removeEventListener('rotateScreen', this._resizeCallback);
|
|
document.removeEventListener('resetScreen', this._resizeCallback);
|
|
this._resizeCallback = null;
|
|
}
|
|
}
|
|
|
|
protected setMyFrameSize():void {
|
|
|
|
if (!this.node) {
|
|
return;
|
|
}
|
|
var wsize = null;
|
|
wsize = view.getVisibleSize();
|
|
|
|
var scale1 = wsize.width / this.realW;
|
|
var scale2 = wsize.height / this.realH;
|
|
var max_scale = Math.max(scale1, scale2);
|
|
var scaleX, scaleY;
|
|
if (this.scaleType == BGScaleType.SCALE_BY_WIDTH) {
|
|
scaleX = scaleY = scale1;
|
|
} else if (this.scaleType == BGScaleType.SCALE_BY_HEIGHT) {
|
|
scaleX = scaleY = scale2;
|
|
} else if (this.scaleType == BGScaleType.SCALE_ONLY_WIDTH) {
|
|
scaleX = scale1;
|
|
scaleY = 1;
|
|
} else if (this.scaleType == BGScaleType.SCALE_ONLY_HEIGHT) {
|
|
scaleX = 1;
|
|
scaleY = scale2;
|
|
} else if (sys.isBrowser) {
|
|
//横向浏览器 只缩放宽度
|
|
scaleX = scaleY = max_scale;
|
|
// scaleY = 1;
|
|
} else {
|
|
scaleX = scaleY = max_scale;
|
|
}
|
|
|
|
this.node.getComponent(UITransform).width = this.realW * scaleX;
|
|
this.node.getComponent(UITransform).height = this.realH * scaleY;
|
|
|
|
var widget = this.node.getComponent(Widget);
|
|
if (widget == null) {
|
|
widget = this.node.addComponent(Widget);
|
|
}
|
|
|
|
if (this.alignmentType == BGAlignmentType.BOTTOM) {
|
|
widget.isAlignHorizontalCenter = true;
|
|
widget.isAlignBottom = true;
|
|
widget.bottom = 0;
|
|
} else if (this.alignmentType == BGAlignmentType.TOP) {
|
|
widget.isAlignHorizontalCenter = true;
|
|
widget.isAlignTop = true;
|
|
widget.top = 0;
|
|
} else if (this.alignmentType == BGAlignmentType.LEFT) {
|
|
widget.isAlignVerticalCenter = true;
|
|
widget.isAlignLeft = true;
|
|
widget.left = 0;
|
|
} else if (this.alignmentType == BGAlignmentType.RIGHT) {
|
|
widget.isAlignVerticalCenter = true;
|
|
widget.isAlignRight = true;
|
|
widget.right = 0;
|
|
} else if (this.alignmentType == BGAlignmentType.CENTER) {
|
|
widget.isAlignHorizontalCenter = true;
|
|
widget.isAlignVerticalCenter = true;
|
|
}
|
|
}
|
|
|
|
protected setMyFrameSizeAgain():void {
|
|
this.scheduleOnce(function () {
|
|
this.setMyFrameSize();
|
|
}.bind(this), 0.05);
|
|
}
|
|
|
|
protected changeOrientation(flag:boolean):void {
|
|
this.setMyFrameSize();
|
|
}
|
|
}
|