अंतराल (Gap)

⚠️ Spacer को हटा दिया गया 2026 आधुनिकीकरण में। अब कोई अंतराल विजेट नहीं है। कॉम्पोनेंट को अलग करने के लिए, वरीयता के क्रम में उपयोग करें: लेआउट भिन्न (LAY_AUTO/LAY_FILL/भिन्न), कॉम्पोनेंट के ingap/outgap, या सीधे Gap मान।

Gap अंतराल मानों (बाएं, ऊपर, दाएं, नीचे) को वैकल्पिक स्केल के साथ दर्शाता है। इसका उपयोग पूरी UI में padding (ingap), margin (outgap), और लेआउट के आंतरिक अंतराल के रूप में किया जाता है। एक Gap हो सकता है:

• निश्चित पिक्सेल — Gap.ofPixels(...)
• फ़ॉन्ट के सापेक्ष — Gap.ofFont(...) (font.scaledHeight() के साथ स्केल करता है, रिस्पॉन्सिवनेस के लिए आदर्श)
• स्क्रीन के सापेक्ष — Gap.ofScreen(...) (स्क्रीन आयामों का प्रतिशत)

🟢 · पैकेज: dev.crossfly.ui · विस्तारित करता है: Component · संबंधित: ComponentStyle.ingap/outgap, लेआउट

कब उपयोग करें

• किसी कॉम्पोनेंट का आंतरिक padding (ingap) या बाहरी margin (outgap) परिभाषित करना।
• किसी लेआउट को अंतराल पास करना (जैसे सेल के बीच gaps)।
• पुराने Spacer को आनुपातिक स्थान से बदलना।

कब उपयोग न करें

• किसी कॉम्पोनेंट को “धकेलने” और बची हुई जगह को सोखने के लिए → VerticalLayout/HorizontalLayout में एक LAY_FILL पंक्ति का उपयोग करें (देखें layouts/), निश्चित Gap का नहीं।

पूर्ण उदाहरण (कॉपी, पेस्ट और रन करें)

package com.exemplo;

import dev.crossfly.ui.*;
import dev.crossfly.ui.layout.*;
import dev.crossfly.ui.style.*;   // Styles, ButtonRole, State

/** चलाने योग्य मुख्य स्क्रीन। launcher (classname) की ओर संकेत करें और चलाएँ: gradlew :lwjgl3:run */
public class MainWindow extends Window
{
   @Override
   public void onShow() throws Exception
   {
      super.onShow();
      setLayout(new VerticalLayout());

      // स्वाभाविक ऊँचाई वाला हेडर
      add(LAY_AUTO, new Label("Cabeçalho"));

      // outgap के जरिए पड़ोसियों से दूर बटन (फ़ॉन्ट-सापेक्ष मार्जिन)
      Button b = new Button("Enviar").style(
         Styles.theme().button(ButtonRole.PRIMARY, State.NORMAL)
            .pressable()
            .outgap(Gap.ofFont(0.5f)));   // हर तरफ 0.5 × फ़ॉन्ट की ऊँचाई
      add(LAY_AUTO, b);

      // फुटर नीचे धकेला गया: LAY_FILL वाली लाइन बची हुई ऊर्ध्व जगह सोख लेती है
      add(LAY_FILL, new Label("(espaço que sobra)"));
      add(LAY_AUTO, new Label("Rodapé"));
   }
}

नीचे दिए गए अंश केवल मुख्य भाग दिखाते हैं (जो onShow() के अंदर जाता है)। रन करने के लिए, इन्हें ऊपर दिए MainWindow ढांचे में रखें।

1. लेआउट भिन्न (वरीयता प्राप्त)

VerticalLayout col = new VerticalLayout();
col.add(LAY_AUTO, cabecalho);   // स्वाभाविक ऊँचाई
col.add(LAY_FILL, conteudo);    // बची हुई जगह सोखता है (फुटर को नीचे धकेलता है)
col.add(LAY_AUTO, rodape);

2. स्टाइल में ingap / outgap

// बाहरी मार्जिन (इस कंपोनेंट को पड़ोसियों से दूर करता है) फ़ॉन्ट-सापेक्ष outgap के जरिए
Button b = new Button("Enviar").style(
   Styles.theme().button(ButtonRole.PRIMARY, State.NORMAL)
      .pressable()
      .outgap(Gap.ofFont(0.5f)));   // हर तरफ 0.5 × फ़ॉन्ट की ऊँचाई
container.add(LAY_AUTO, b);

3. आंतरिक padding के रूप में Gap

Label card = new Label("Conteúdo do cartão").style(
   Styles.theme().label(LabelRole.BODY)
      .ingap(Gap.ofFont(1f, 0.5f, 1f, 0.5f)));  // L,T,R,B फ़ॉन्ट इकाइयों में
container.add(LAY_AUTO, card);

फ़ैक्टरियां (Gap)

गुण और मेथड

सर्वोत्तम प्रथाएं

• “बची हुई जगह” के लिए, लेआउट में केवल एक LAY_FILL पंक्ति का उपयोग करें, कई gaps का नहीं।
• ऑब्जेक्ट आवंटित किए बिना padding को शून्य करने के लिए Gap.ZERO का पुनः उपयोग करें।

सामान्य गलतियां

• Spacer क्लास ढूंढना: यह अब मौजूद नहीं है। लेआउट भिन्न / Gap / ingap/outgap का उपयोग करें।
• हर चीज़ के लिए Gap.ofPixels का उपयोग करना: विभिन्न घनत्वों की स्क्रीन पर अंतराल असंगत हो जाता है; ofFont/ofScreen को प्राथमिकता दें।
• दो निश्चित gaps से केंद्रित करने की कोशिश: लेआउट के संरेखण या दोनों ओर LAY_FILL का उपयोग करें।

यह भी देखें

• क्षेत्र गाइड: ui/ · रेसिपीज़: cookbook/
• अवधारणा (constraints, रिस्पॉन्सिवनेस): concepts/
• संबंधित कॉम्पोनेंट: Label · Button