添加图片使用本地属性和文件位置的LightSwitch(Add image to lightswit

2019-11-03 06:44发布

只是一个快速的问题,是有可能上LightSwitch的一个屏幕内显示静态图像?

我要点击“添加数据项” - >选择“本地属性”,然后键入“形象”。 现在不像以前的版本,所以我需要通过后期渲染部分写一些JS,我怎么在这里键入我无法选择一个文件路径?

感谢您的帮助,你的给我,试过没有成功的一些方法。

Answer 1:

最近刚刚解决,我们已经实现了下面的帮助承诺操作功能类似的情况: -

function GetImageProperty (operation) {
    var image = new Image();
    var canvas = document.createElement("canvas");
    var ctx = canvas.getContext("2d");
    // XMLHttpRequest used to allow external cross-domain resources to be processed using the canvas.  
    // unlike crossOrigin = "Anonymous", XMLHttpRequest works in IE10 (important for LightSwitch) 
    // still requires the appropriate server-side ACAO header (see https://developer.mozilla.org/en-US/docs/Web/HTML/CORS_enabled_image)
    var xhr = new XMLHttpRequest();
    xhr.onload = function () {
        var url = URL.createObjectURL(this.response);
        image.onload = function () {
            URL.revokeObjectURL(url);
            canvas.width = image.width;
            canvas.height = image.height;
            ctx.drawImage(image, 0, 0);
            var dataURL = canvas.toDataURL("image/png");
            operation.complete(dataURL.substring(dataURL.indexOf(",") + 1));
        };
        image.src = url;
    };
    xhr.open('GET', this.imageSource, true);
    xhr.responseType = 'blob';
    xhr.send();
};

已经增加了本地地产(添加数据项 - >本地地产 - >类型:图像 - >名称:ImageProperty)并放置到内容项中的树的承诺操作可在_postRender程序中的以下方式来执行: -

msls.promiseOperation
(
    $.proxy(
        GetImageProperty,
        { imageSource: "content/images/user-splash-screen.png" }
    )
).then(
    function (result) { 
        contentItem.screen.ImageProperty = result; 
    }
);

另外,也可称为屏幕的创建功能如下: -

msls.promiseOperation
(
    $.proxy(
        GetImageProperty,
        { imageSource: "https://s3-us-west-2.amazonaws.com/s.cdpn.io/3/pie.png" }
    )
).then(
    function (result) { 
        screen.ImageProperty = result; 
    }
);

以上调用也表明,除了显示当地的的LightSwitch项目图像,ImageSource的可设置为外部URL(提供的外部网站使用适当的服务器端ACAO头允许跨域访问)。

编辑:我已经更新了这个辅助函数来回答稍微改进这个帖子添加静态图像的LightSwitch HTML浏览2013屏幕 。



文章来源: Add image to lightswitch using local property and file location