处理GUI元素之间的“双边距”问题

在创建GUI时，我遇到过几次“双边距”问题，其中两个元素具有相同的边距定义，并最终以两倍于意。处理GUI元素之间的“双边距”问题

我使用的一种解决方案是仅在元素的某些边上定义边距（例如，如果我期望元素垂直堆叠，则只在顶部），但是后面我缺少最后一个底部边距元件。

你如何处理这个问题？任何语言或框架的例子都是受欢迎的。

2009-07-28 M. Dudley

有些语言/框架，让你当你设置一个每个小部件基础上边距设置页边距在“布局”本身，这不会有双重利润的问题。例如，在Qt中使用QLayout，你可以简单地使用setSpacing（int size）;在布局对象上设置小部件之间的间距，以及更高级别的布局（如QGridLayout）允许您执行更复杂的事情。在Qt中，如果您还希望在父窗口小部件（可能是顶级窗口）的边缘附近有额外的空间，您可以通过调用setContentsMargins（int left，int top，int right，int bottom） ;在那个小部件上。

我会想象大多数GUI工具包会有类似的结构。

来源

2009-07-28 19:18:21 Kitsune

如果语言/工具包支持它，这是一个很好的解决方案。 – 2009-08-22 17:27:08

尽管标签，它确实取决于语言和它的GUI管理器。有些允许你设置任意间距（就像你在谈论的那样）。

我对这个问题的主要接触是在CSS中，因为这就是我每天都在做的事情。我将事情保持简单：浮动块项目留下，只在这些项目上使用左手边距。

这需要你设置宽度并且不适用于所有事情（相对/％宽度是最明显的）......但它在很多时候都适用于我。 IE6 可以由于其内置的双边距渲染错误而在我的日子里抛出扳手，但它通常只是固定的。

对于那些不确定问题提出的问题：想象您想要在屏幕上显示的框。你想说的是盒子周围应该有30px的边距。现在想象你有两个盒子可以相互显示。如果您设置绝对30像素的边距，那么这些边框的间距将为60px。解决x。

来源

2009-07-28 17:27:24 Oli

Internet Explorer并未始终正确折叠边距，因此，在我们等待IE7使用率缩小时，更安全的方法是在可能的情况下使用填充。

如果仅在元素的某些边上设置边距或填充，则可以在父元素中使用填充以获得到最后元素的正确距离。

来源

2009-07-28 17:28:12 Guffa

我有处理这一两手：

1）给出的元素的片面填充，然后弥补在CSS用于容器的第一/最后一个元素的差异。例如为：

<ul> 
    <li>Cats</li> 
    <li>Dogs</li> 
    <li>Birds</li> 
</ul> 

ul { padding-bottom: 10px; } 
ul li { padding-top: 10px; }

2）添加一个类到第一/最后一个元素在HTML或使用一个jQuery（或其他框架）选择器。例如： -

<ul> 
    <li class="first">Cats</li> 
    <li>Dogs</li> 
    <li class="last">Birds</li> 
</ul> 

ul { padding-bottom: 10px; } 
    ul li { padding-top: 10px; } 

$(document).ready(function(){ 
    $('ul li:last').addClass('last'); 
});

来源

2009-07-28 19:05:17 skybondsor

很明显，这是一个html/css/javascript燃料视角！ – skybondsor 2009-07-28 19:11:10

处理GUI元素之间的“双边距”问题

回答

相关问题