Office.js对话框API和具有高DPI的多个显示 [英] Office.js dialog API and multiple displays with high DPI

问题描述

我注意到Office.js的行为有问题 dialogAPI .

I noticed a problematic behavior of the Office.js dialogAPI.

实际上，我使用两台显示器，其中一台是具有250％缩放比例的高DPI(3840 * 2160).第二个是1920 * 1080(缩放100％).

Indeed, I use two monitors one being an high DPI (3840*2160) with 250% zoom. The second one is 1920*1080 (zoom 100%).

如果在监视器1中设置了Office，并且如果我打开dialogAPI(让我们说80％的默认值)，那么将使用两个监视器的扩展名来计算对话框的大小.因此，对话框窗口变得巨大，跨越了两个显示，并且如果不调整大小就无法使用.

If Office is set in monitor 1 and if I open the dialogAPI (let us say with 80% default values), then the size of the dialog is computed using the extension of the two monitors. Therefore, the dialog windows becomes gigantic, span the two displays and cannot be used without resizing.

推荐答案

您可以尝试在OfficeHelpers.js中使用对话框"帮助器吗?它包含在此处的v0.5.0中( https://unpkg.com/@microsoft/office-js-helpers@0.5.0/dist/office.helpers.js ).

Could you try using the Dialog helper in OfficeHelpers.js. It's included in v0.5.0 located here (https://unpkg.com/@microsoft/office-js-helpers@0.5.0/dist/office.helpers.js).

对话框助手允许以像素为单位指定宽度和高度，而不是百分比，我们在内部计算百分比并进行DialogAPI调用.

The dialog helper allows specifying width and height in pixels as opposed to percentages and we internally calculate the percentage and make the DialogAPI call.

目前，它应该检测到可用空间并以您指定的大小创建对话框.就是说，对话框采用生成对话框的大小.因此，如果您有两台显示器，一台4k，一台是1280x720，并且显示了1920x1080对话框，则该对话框看起来很大并且无法缩小以适合显示.目前这是一个限制.

At the moment, it should detect the available space and should create your dialog with the size that you specify. That said, the Dialog takes the size of the window where it was spawned. Hence if you had two monitors one 4k and one being 1280x720 and you spawed a 1920x1080 dialog, it would look massive and wouldn't shrink to fit. That is a limitation currently.

让我知道您是否遇到任何问题.这是示例代码:

Let me know if you face any issues. Here's the sample code:

(function () {
    $(document).ready(function () {
        Office.initialize = function () {
            // specify the HTTPS url and width and height in pixels.
            // the fourth parameter is to switch to using Microsoft Teams Dialog.

            var dialog = new OfficeHelpers.Dialog('<dialog url>', 1024, 768);
            dialog.result.then(function (value) {
                console.log(value);
            }).catch(function (error) {
                OfficeHelpers.Utilities.log(error);
            });            
        }
    });
})();

// Some where in the Dialog
OfficeHelpers.Dialog.close({
    a: 1,
    alpha: 2,
    'meao': 'cat',
    b: {
        a: 1,
        alpha: 2,
        'meao': 'cat',
    }
});

这篇关于Office.js对话框API和具有高DPI的多个显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！