egret加载项目外部图片,调用外包JS,我的解决方案

 egret 小游戏设置头像 加载项目外部图片(无后端异步加载图片)处理方式

index.html页面中:

 CSS样式:

    

 Html 标签:

 JS方法:

  
    /**
     * 初始化信息 
     */
    var head = ""; //玩家头像
    var init = function () {
        //初始化头像
        var image = document.getElementById("head_icon");
        if (image) {
            image.src = head;
        }
    }
    /**
     * 设置头像是否显示 
     * @param value true:显示  false:不显示
     * @param alpha 透明度 默认50
     */
    function setHead(value = false, alpha = 50) {
        var headDiv = document.getElementById("head");
        if (headDiv) {
            headDiv.hidden = !value;
            headDiv.style.filter = 'alpha(opacity=' + alpha + ')';
            headDiv.style.opacity = alpha / 100;
            if (alpha == 50) {
                setHeadPos();
            }
        }
    }
      /**
     * 设置头像坐标
     */
    function setHeadPos() {
        var gameDiv = document.getElementById("game");
        var headDiv = document.getElementById("head");
        //game showall模式计算宽高
        var m_width = 0;
        var m_height = 0;
        var marginTop = 6;
        var marginLeft = 20;
        var percent = 720 / 1120;
        var scale = 0.5;
        if (gameDiv.clientWidth / gameDiv.clientHeight > percent) {
            //横向
            m_width = gameDiv.clientHeight * percent;
            m_height = gameDiv.clientHeight;
            scale = m_width/720;
            marginTop = marginTop*scale;
            marginLeft = marginLeft*scale;
            headDiv.style.top = marginTop + "px";
            headDiv.style.left = (gameDiv.clientWidth - m_width) / 2 + marginLeft + "px";
        } else {
            //纵向
            m_width = gameDiv.clientWidth;
            m_height = gameDiv.clientWidth / percent;
            scale = m_height/1120;
            marginTop = marginTop*scale;
            marginLeft = marginLeft*scale;
            headDiv.style.top = (gameDiv.clientHeight - m_height) / 2 + marginTop + "px";
            headDiv.style.left = marginLeft + "px";
        }
        //设置缩放后的坐标
        headDiv.style.transformOrigin="left top 0";
        headDiv.style.webkitTransform = "scale(" + scale + ")";
        headDiv.style.transform = "scale(" + scale + ")";
    }

ts调用js代码:

//设置头像
declare function setHead(value,alpha);

 ts代码:

/* 设置头像 */
	public setHead(params?: any) {
		//调用外包JS,加载项目外部图片
		if (!params) {
			params = [true, 100];
		}
		setHead(params[0], params[1]);
}

 ts调用:

	Global.instance.setHead();

 

你可能感兴趣的:(Egret)