क्षैतिज पैनल (GWT)

Question

पर बटन को सही तरीके से संरेखित करने का तरीका मैं एक साधारण संवाद को लागू करने की कोशिश कर रहा हूं। मैं ठीक से संवाद करना चाहता हूं और संवाद के निचले भाग में गठबंधन बटन रद्द करना चाहता हूं। मैं क्षैतिज पैनल में बटन एम्बेड करता हूं और क्षैतिज संरेखण को दाएं सेट करने की कोशिश करता हूं। हालांकि, यह काम नहीं करता है। बटन को सही तरीके से संरेखित कैसे करें? धन्यवाद। बटन पहले जोड़ने के लिए और फिर hp.setHorizontalAlignment("your aligment here") फोन

private Widget createButtonsPanel() { 
    HorizontalPanel hp = new HorizontalPanel(); 
    hp.setCellHorizontalAlignment(saveButton, HasHorizontalAlignment.ALIGN_RIGHT); 
    hp.setCellHorizontalAlignment(cancelButton, HasHorizontalAlignment.ALIGN_RIGHT); 
    hp.add(saveButton); 
    hp.add(cancelButton);  

    return hp; 
} 

Answer 1

बिंदु अपने बटन जोड़ने से पहले setHorizontalAlignmentकॉल करने के लिए है:

final HorizontalPanel hp = new HorizontalPanel(); 
final Button saveButton = new Button("save"); 
final Button cancelButton = new Button("cancel"); 

// just to see the bounds of the HorizontalPanel 
hp.setWidth("600px"); 
hp.setBorderWidth(2); 

// It only applies to widgets added after this property is set. 
hp.setHorizontalAlignment(HasHorizontalAlignment.ALIGN_RIGHT); 

hp.add(saveButton); 
hp.add(cancelButton); 

RootPanel.get().add(hp); 

आप अपने बटन तंग होना चाहते हैं

Answer 2

प्रयास करें: यहाँ टुकड़ा है।

शुभकामनाएं!

Answer 3

हो सकता है कि आप क्षैतिज पैनेल के विस्तार को चेकआउट करने के लिए फ़ायरबग का उपयोग करना चाहें। आप एक

hp.setWidth("100%"); 

HorizontalPanel आम तौर पर सामग्री के लिए ही आकार की जरूरत हो सकती है, इसलिए यदि आप इसे में बटन के एक जोड़े डाल यह मेज खुद का विस्तार नहीं करता है के रूप में गठबंधन छोड़ दिया जाएगा। जैसा कि नीचे दिखाया http://gwt.google.com/samples/Showcase/Showcase.html#CwDialogBox

Answer 4

मैं बटन संरेखित के लिए एक उदाहरण पाया है एक साथ - उन्हें दोनों नए कंटेनर में डाल दें, और इन्हें कंटेनर दाएं-बाघ वाले क्षैतिज पैनेल

Answer 5

के अंदर रख दें आप setCellHorizontalAlignment का भी उपयोग कर सकते हैं उस पैनल पर जिसमें HorizontalPanel शामिल है। यही तो मैं करता हूं।

// doesn't necessarily have to be a vertical panel 
VerticalPanel container = new VerticalPanel(); 
HorizontalPanel buttons = new HorizontalPanel(); 
// add the buttons 
container.add(buttons); 
container.setCellHorizontalAlignment(buttons, HasHorizontalAlignment.ALIGN_RIGHT); 

Answer 6

इस सूत्र के लिए एक और टिप जोड़ना: अगर आप अपने पैनल बाहर रखना UiBinder उपयोग कर रहे हैं, तो आप मुसीबत पता लगाना कैसे पैनल के लिए किसी भी विगेट्स जोड़ने से पहले संरेखण गुण सेट करना होगा। इसके अतिरिक्त, पैनल पर सीधे बीन विशेषता का उपयोग करना, जैसे ...

<g:HorizontalPanel horizontalAlignment="ALIGN_RIGHT"> 
    .... 
</g:HorizontalPanel> 

... काम नहीं करता है। चाल? है कि आप एक <g:cell> तत्व में पर संरेखण निर्धारित करने की आवश्यकता एक DockPanel, HorizontalPanel, या VerticalPanel के किसी भी बच्चों लपेटें:

<g:HorizontalPanel> 
    <g:cell width="800px" horizontalAlignment="ALIGN_RIGHT"> 
     <g:Button ui:field="closeButton" text="Close" /> 
    </g:cell> 
</g:HorizontalPanel> 

ज्यादातर मामलों में आप की संभावना "चौड़ाई" के साथ ही तैयार करना होगा, ध्यान दें कि संरेखण यदि आप क्षैतिज पैनल पर इसका उपयोग करते हैं, और इसके विपरीत। विवरण के लिए Javadoc for CellPanel देखें।

Answer 7

यहाँ कि काम करना चाहिए एक अन्य उदाहरण UiBinder उपयोग कर रहा है:

<g:VerticalPanel> 
<g:HorizontalPanel width="100%"> 
    <g:cell horizontalAlignment="ALIGN_RIGHT" width="100%"> 
    <g:Button ui:field="cancelButton" text="Cancel"/> 
    </g:cell> 
    <g:cell horizontalAlignment="ALIGN_RIGHT"> 
    <g:Button ui:field="okButton" text="Ok"/> 
    </g:cell> 
</g:HorizontalPanel> 
</g:VerticalPanel> 

Answer 8

काफी जवाब देने के लिए लेकिन सिर्फ इतना है कि चौड़ाई की स्थापना के लिए महत्वपूर्ण है (जैसा कि bikesandcode पहले से ही ऊपर का सुझाव दिया है) रिकॉर्ड के लिए उल्लेख करना चाहते देर अन्यथा यह नहीं हो सकता काम।

मेरे लिए काम किया के बाद,

<g:HorizontalPanel width="100%"> 
    <g:cell horizontalAlignment="ALIGN_RIGHT"> 
     <g:Button ui:field="buttonOK" text="OK"/> 
    </g:cell> 
</g:HorizontalPanel> 

Answer 9

UiBinder उपयोगकर्ताओं के लिए, मैं @Peter Wagener के जवाब में थोड़ा और अधिक विस्तार करने के लिए चाहते हैं।

रूप @Peter Wagener ने कहा, निम्नलिखित काम नहीं करता है। (मेरा मानना ​​है कि यह एक बग है।)

<g:HorizontalPanel horizontalAlignment="ALIGN_RIGHT"> 
    .... 
</g:HorizontalPanel> 

यहाँ मैं (कई बटन) को हल करने के लिए एक उदाहरण प्रदान की है।

<g:HorizontalPanel> 
    <g:cell width="800px" horizontalAlignment="ALIGN_RIGHT"> 
     <g:Button ui:field="saveButton" text="Save" /> 
    </g:cell> 
    <g:cell horizontalAlignment="ALIGN_RIGHT"> 
     <g:Button ui:field="closeButton" text="Close" /> 
    </g:cell> 
</g:HorizontalPanel> 

नोट:

1. प्रथम कक्ष बड़ा पर्याप्त चौड़ाई होना चाहिए।
2. शेष कोशिकाओं को कोई चौड़ाई निर्दिष्ट न करें, ताकि पहले और दूसरे बटन के बीच कोई अंतर न हो।

   .buttonToRight { 
       float: right; 
       right: 100%; 
   } 
   

   और फिर उन्हें नियंत्रित करने के लिए आवंटित इस प्रकार है::

Answer 10

नियंत्रण सही करने के लिए संरेखित या छोड़ दिया करने के लिए सबसे अच्छा तरीका है के रूप में इस सीएसएस की दो पंक्तियाँ लिखने के लिए

HorizontalPanel hpButtons = new HorizontalPanel(); 
hpButtons.addStyleName("buttonToRight");