2

GUIを作成しているときに、「ダブルマージン」の問題に何度か遭遇しました。この問題では、2つの要素に同じマージンが定義されており、意図した2倍の間隔で配置されています。

私が使用する解決策の1つは、要素の一部の側面のみにマージンを定義することです（たとえば、要素が垂直に積み重ねられると予想される場合は上部のみ）が、最後の要素の下部マージンがありません。

この問題にどのように対処しますか？任意の言語またはフレームワークでの例を歓迎します。

4

4 に答える 4

1

タグにもかかわらず、実際には言語とその GUI マネージャーに依存します。任意の間隔を設定できるものもあります（あなたが話しているように）。

私がこの問題に直面する主な原因は CSS にあります。私は物事をシンプルに保ちます: ブロック項目を左にフロートさせ、それらの項目の左側のマージンのみを使用します。

これには幅を設定する必要があり、すべてで機能するわけではありません（相対/％幅が最も明白です）...しかし、私にとっては多くの場合機能します。IE6には組み込みのダブル マージン レンダリング バグがあるため、私の日常ではスパナをスローすることがありますが、通常は単純に修正されています。

質問の内容がよくわからない場合は、画面に表示したいボックスをイメージしてください。ボックスの周囲に 30px のマージンが必要であると言いたいです。ここで、隣り合わせに表示する 2 つのボックスがあるとします。絶対 30 ピクセルのマージンを設定すると、これらのボックスは 60 ピクセル離れます。x について解きます。

于 2009-07-28T17:27:24.133 に答える
1

一部の言語/フレームワークでは、「レイアウト」自体にマージンを設定できます。これにより、ウィジェットごとにマージンを設定した場合に二重マージンの問題は発生しません。

たとえば、Qt の QLayout では、単純に setSpacing(int size); を使用できます。レイアウト オブジェクトでウィジェット間の間隔を設定し、より高いレベルのレイアウト (QGridLayout など) では、より複雑なことを行うことができます。Qt では、親ウィジェット (トップ レベル ウィンドウである可能性があります) の端に余分なスペースが必要な場合は、setContentsMargins(int left, int top, int right, int bottom); を呼び出して設定できます。そのウィジェットで。

ほとんどの GUI ツールキットは同様の構造を持っていると思います。

于 2009-07-28T19:18:21.650 に答える
0

Internet Explorer は常にマージンを正しく折りたたむわけではないため、IE7 の使用が縮小するまでの間、より安全な方法は、可能な場合は代わりにパディングを使用することです。

要素の一部の辺のみにマージンまたはパディングを設定する場合、親要素でパディングを使用して、最後の要素までの適切な距離を取得できます。

于 2009-07-28T17:28:12.400 に答える
0

これに対処するための 2 つの戦術があります。

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-28T19:05:17.337 に答える