PDA

View Full Version : Problem with setVisible



Theocritus
2 Oct 2014, 11:45 PM
I current use GXT 3.1

When place a button and 2 FieldLabel in HorizontalLayoutContainer.

If I set both FieldLabel visible="false" in ui.xml,
and then use button to setVisible="true",
the second FieldLabel will show up in wrong place.
It will become correct after browser resize.

If I set width in FieldLabel's layout data,
it show up in right place, but child's width become strange.
50545
How to make it work?

ui.xml


<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
xmlns:b="urn:import:com.sencha.gxt.widget.core.client.button"
xmlns:c="urn:import:com.sencha.gxt.widget.core.client.container"
xmlns:f="urn:import:com.sencha.gxt.widget.core.client.form">


<ui:with field="fieldRow" type="com.sencha.gxt.widget.core.client.container.VerticalLayoutContainer.VerticalLayoutData">
<ui:attributes width="1" height="30" />
</ui:with>
<ui:with field="fieldWithWidth" type="com.sencha.gxt.widget.core.client.container.HorizontalLayoutContainer.HorizontalLayoutData">
<ui:attributes width="200" margins="{fieldMargins}" />
</ui:with>
<ui:with field="field" type="com.sencha.gxt.widget.core.client.container.HorizontalLayoutContainer.HorizontalLayoutData">
<ui:attributes margins="{fieldMargins2}" />
</ui:with>
<ui:with field="fieldMargins" type="com.sencha.gxt.core.client.util.Margins">
<ui:attributes top="5" right="35" bottom="5" left="5" />
</ui:with>
<ui:with field="fieldMargins2" type="com.sencha.gxt.core.client.util.Margins">
<ui:attributes top="5" right="35" bottom="5" left="5" />
</ui:with>


<c:VerticalLayoutContainer>
<c:HorizontalLayoutContainer layoutData="{fieldRow}">
<b:TextButton ui:field="visibleBtn" text="Visible" />
</c:HorizontalLayoutContainer>
<c:HorizontalLayoutContainer layoutData="{fieldRow}">
<f:FieldLabel text="Normal 1" layoutData="{field}">
<f:widget>
<f:TextField />
</f:widget>
</f:FieldLabel>
<f:FieldLabel text="Normal 2" layoutData="{field}">
<f:widget>
<f:TextField />
</f:widget>
</f:FieldLabel>
</c:HorizontalLayoutContainer>
<c:HorizontalLayoutContainer layoutData="{fieldRow}">
<f:FieldLabel ui:field="fooTest1" text="Visible False 1" layoutData="{field}" visible="false">
<f:widget>
<f:TextField />
</f:widget>
</f:FieldLabel>
<f:FieldLabel ui:field="fooTest2" text="Visible False 2" layoutData="{field}" visible="false">
<f:widget>
<f:TextField />
</f:widget>
</f:FieldLabel>
</c:HorizontalLayoutContainer>
<c:HorizontalLayoutContainer layoutData="{fieldRow}">
<f:FieldLabel text="Normal 1 with width 200" layoutData="{fieldWithWidth}">
<f:widget>
<f:TextField />
</f:widget>
</f:FieldLabel>
<f:FieldLabel text="Normal 2 with width 200" layoutData="{fieldWithWidth}">
<f:widget>
<f:TextField />
</f:widget>
</f:FieldLabel>
</c:HorizontalLayoutContainer>
<c:HorizontalLayoutContainer layoutData="{fieldRow}">
<f:FieldLabel ui:field="fooTest3" text="Visible False 1 with width 200" layoutData="{fieldWithWidth}" visible="false">
<f:widget>
<f:TextField />
</f:widget>
</f:FieldLabel>
<f:FieldLabel ui:field="fooTest4" text="Visible False 2 with width 200" layoutData="{fieldWithWidth}" visible="false">
<f:widget>
<f:TextField />
</f:widget>
</f:FieldLabel>
</c:HorizontalLayoutContainer>
</c:VerticalLayoutContainer>
</ui:UiBinder>


VisibleTest.java


public class VisibleTest extends Composite{
private static VisibleTestUiBinder uiBinder = GWT.create(VisibleTestUiBinder.class);
interface VisibleTestUiBinder extends UiBinder<Widget, VisibleTest>{}


@UiField FieldLabel fooTest1;
@UiField FieldLabel fooTest2;
@UiField FieldLabel fooTest3;
@UiField FieldLabel fooTest4;


public VisibleTest(){
initWidget(uiBinder.createAndBindUi(this));
}


@UiHandler("visibleBtn")
void onVisibleBtnSelect(SelectEvent se){
fooTest1.setVisible(true);
fooTest2.setVisible(true);
fooTest3.setVisible(true);
fooTest4.setVisible(true);
}
}

Andreas Samjeske
6 Oct 2014, 5:12 AM
You may try a forceLayout() call on the FieldLabel(s) or their parent, just after toggling their visibility.