Question

我已经注意到了一段时间但是当使用Lightswitch并将属性设置为“Stretch to Container”时，屏幕有时会显得过度拉伸并将项目向下移动到下一行，例如：

当按下“仅查看我的项目”时，按钮会切换（所以我隐藏了这个按钮并使用以下代码显示另一个选项：

if（screen.ChangeDefaultValue.count＆gt; 0）{ screen.ChangeDefaultValue.selectedItem = screen.ChangeDefaultValue.data [0];

    screen.ChangeDefaultValue.selectedItem.HomepageProjectsDefault = false;

    screen.DefaultOption = null;

    myapp.applyChanges();

    setTimeout(function () {
        screen.Projects.refresh();
    }, 100);

    screen.findContentItem("SeeAllProjects").isVisible = false;
    screen.findContentItem("SeeMyProjectsOnly").isVisible = true;
}
else {

}

这非常有效，但正如您在上面的第二张图片中所看到的那样，按钮在参数搜索框下方向下移动，就像它已经过度拉伸一样。我已经尝试更改.msls内容的边距和填充，但是此错误仍然出现在此处以及我的其他多个页面上。

有没有人找到解决此问题的方法？

更多信息：

我使用的是msls-2.5.3.css，并在default.htm文件中声明
我试过这个https://social.msdn.microsoft.com/Forums/vstudio/en-US/fb1305c5-ac13-474e-8ae0-df74ebf12590/html-client-custom-control-stretch-to-container-sizing-bug-problem?forum=lightswitch

问题

msls-2.5.3.css中的这一小块代码似乎是个问题，但如果我将其注释掉，那么其他屏幕就会中断。高度中的所有填充似乎都消失了，它们在模态屏幕上都相互重叠

.msls-clear {
    clear: both;
}

Answer 1

在LightSwitch HTML中，我们可以使用列布局选项在每列中呈现控件。通过设置“拉伸到容器”属性，列仅拉伸到容器大小，而不是每个列内的控件都用容器拉伸。控件在容器内正确呈现。由于隐藏和显示内容项时列宽度延伸而发生问题，这与页面中使用的组件无关。按照以下解决方法解决方案，同时通过单击按钮动态删除内容项。请在按钮单击时删除“msls-clear”类，或将clear：none应用于“msls-clear”类。 this.element.parents(".msls-column").next(".msls-clear").removeClass("msls-clear")

希望这会对你有所帮助..！

谢谢，弗朗西斯

Answer 2

我不是CSS的专家，但这似乎解决了我的问题：

.msls-clear {
    clear: right;
    max-width: 1850px;
}

我测试的所有机器都具有1920 x 1080的分辨率，因此通过稍微减小宽度，它永远不会过度拉伸物品。

我最初评论了在Internet Explorer中工作的clear: right;，但我在google chrome / firefox中测试了一些Syncfusion控件。我无法点击它们中的任何一个，因此必须添加最大宽度。

如果有人可以提出更好的解决方案，我将不胜感激，但至少目前这是有效的

Lightswitch HTML - 屏幕过度延伸

2 个答案: