GXT ContentPanel display issue with BorderLayoutContainer (strange blue margin) - gwt

I am facing a little issue when using BorderLayoutContainer in my App.
I just want to have a center panel and south panel but I get a strange blue margin around my south panel (see the image below).
Find my sources below.
private Widget getContainer() {
SimpleContainer sc = new SimpleContainer();
BorderLayoutContainer blc = new BorderLayoutContainer();
ContentPanel validationView = new ContentPanel();
validationView.setHeadingText("Validation");
ContentPanel center = new ContentPanel();
center.add(editorMVP.getDisplay());
center.setHeaderVisible(false);
center.setBorders(false);
blc.setCenterWidget(center);
BorderLayoutData southData = new BorderLayoutData(250);
southData.setCollapsible(true);
southData.setSplit(true);
southData.setCollapsed(true);
blc.setSouthWidget(validationView, southData);
blc.collapse(LayoutRegion.SOUTH);
sc.add(blc);
return sc;
}
Can anybody help me solve this please?
EDIT: I have been able to remove this margin with using a SimpleContainer instead of a ContentPanel. But I have now a blue background I want to get rid off. Any idea?
private Widget getContainer() {
SimpleContainer sc = new SimpleContainer();
BorderLayoutContainer blc = new BorderLayoutContainer();
ContentPanel validationView = new ContentPanel();
validationView.setHeadingText("Validation");
SimpleContainer center = new SimpleContainer();
center.add(editorMVP.getDisplay());
blc.setCenterWidget(center);
BorderLayoutData southData = new BorderLayoutData(250);
southData.setCollapsible(true);
southData.setSplit(false);
southData.setCollapsed(true);
blc.setSouthWidget(validationView, southData);
blc.collapse(LayoutRegion.SOUTH);
sc.add(blc);
return sc.asWidget();
}
Thank you for your help.

The issue solves itself after I rewrote my code. Here is my final code, but I don't think it has really changed... Don't really understand what happened...
private Widget getContainer() {
SimpleContainer sc = new SimpleContainer();
BorderLayoutContainer blc = new BorderLayoutContainer();
ContentPanel validationView = new ContentPanel();
validationView.setHeadingText("Validation");
ContentPanel center = new ContentPanel();
center.setHeaderVisible(false);
center.add(editorMVP.getDisplay());
blc.setCenterWidget(center);
BorderLayoutData southData = new BorderLayoutData(250);
southData.setCollapsible(true);
southData.setSplit(false);
southData.setCollapsed(true);
blc.setSouthWidget(validationView, southData);
blc.collapse(LayoutRegion.SOUTH);
sc.add(blc);
return sc.asWidget();
}

Related

SWT gridlayout align

When put all widgets in one container, the gridlayout could align normally.
But for some reason, I need to put some widgets to a sub-container such as the composite as below. The alignment is different.
So the question is: Is there a container that has no effect on the gridlayout?
Ps: I know that can use white space as a workaround, but...
Code:
public static void main(String[] args) {
Display display = new Display();
Shell shell = new Shell(display);
GridLayoutFactory.fillDefaults().numColumns(2).margins(8, 3).applyTo(shell);
new Label(shell, 0).setText("Label1");
new Text(shell, 0);
new Label(shell, 0).setText("A long Label");
new Text(shell, 0);
Composite composite = new Composite(shell, 0);
GridDataFactory.fillDefaults().span(2, 1).applyTo(composite);
GridLayoutFactory.fillDefaults().numColumns(2).applyTo(composite);
new Label(composite, 0).setText("Label22");
new Text(composite, 0);
new Label(composite, 0).setText("Label223");
new Text(composite, 0);
shell.open();
while (!shell.isDisposed()) {
if (!display.readAndDispatch())
display.sleep();
}
display.dispose();
}
Result:
There is no container that can used like this. Sticking to a single composite is by far the easiest way to aligh the labels.
It is possible to specify the widthHint of the GridData for a label to specify the width. You would have to calculate the width required using something like:
List<Control> labels = ... list of Label controls
final int width = labels.stream()
.mapToInt(label -> label.computeSize(SWT.DEFAULT, SWT.DEFAULT).x)
.max()
.getAsInt();
final var labelData = GridDataFactory.swtDefaults().hint(width, SWT.DEFAULT);
labels.forEach(labelData::applyTo);

Auto-sizing height/width of north/west widgets on BorderLayoutContainer

It seems that NorthSouthContainer can ajust the height of north widget.
Can BorderLayoutContainer do the same one?
(gxt version: 3.1.1)
public void onModuleLoad() {
final BorderLayoutContainer cont = new BorderLayoutContainer();
// final NorthSouthContainer cont = new NorthSouthContainer();
final ToolBar bar = new ToolBar();
bar.add(new TextButton("tool bar"));
cont.setNorthWidget(bar);
final ContentPanel panel = new ContentPanel();
panel.setHeadingText("content panel");
cont.setCenterWidget(panel);
// cont.setSouthWidget(panel);
final Viewport vp = new Viewport();
vp.add(cont);
RootPanel.get().add(vp);
}
NorthSouthContainer:
BorderLayoutContainer:
I know there are display bugs with that view. I'm not sure if it can be dynamically sized, we specifically set the height for it.
final BorderLayoutData northData = new BorderLayoutData(<height>);
cont.setNorthWidget(bar, northData);
You may have to add the toolbar into another container that deals with size better, ours is a HorizontalLayoutContainer inside of a ContentPanel.

GWT SplitLayoutPanel dragging splitter is way too jumpy

Like Need GWT SplitLayoutPanel to have max size, dragging is very jumpy I am wondering why the right and the southern splitters jump (tested in IE9; both, web and hosted mode) when trying to drag the splitters in the following example:
public class SplitLayoutPanelTest implements EntryPoint {
public void onModuleLoad() {
final SplitLayoutPanel p = new SplitLayoutPanel(5);
p.setSize(Window.getClientWidth()+"px", Window.getClientHeight()+"px");
final Frame fWest = new Frame("http://bsd.org");
fWest.setSize("400px", "200px");
p.insertWest(fWest, 400, null);
final Frame fEast = new Frame("http://www.linux.org");
fEast.setSize("90px", "90px");
p.insertEast(fEast, 100, null);
final Frame fNorth = new Frame("http://www.w3c.org");
fNorth.setSize("80px", "80px");
p.insertNorth(fNorth, 100, null);
final Frame fSouth = new Frame("http://www.sqlite.org");
fSouth.setSize("85px", "85px");
p.insertSouth(fSouth, 100, null);
final Frame fCenter = new Frame("http://www.gnu.org");
fCenter.setSize("75px", "75px");
p.insert(fCenter, Direction.CENTER, 200, null);
RootPanel.get().add(p);
}
}
Any ideas?
Take a look at this answer in
Need GWT SplitLayoutPanel to have max size, dragging is very jumpy
I hope this solves your issue as well, good luck
So here is one possible solution:
public class SplitLayoutPanelTest implements EntryPoint {
public void onModuleLoad() {
final SplitLayoutPanel p = new SplitLayoutPanel(5);
p.setSize(Window.getClientWidth()+"px", Window.getClientHeight()+"px");
final Frame fWest = new Frame("http://bsd.org");
final VerticalPanel pWest = new VerticalPanel();
pWest.setSize("100%", "100%");
pWest.add(fWest);
p.insertWest(pWest, 400, null);
fWest.setSize("400px", "200px");
final Frame fEast = new Frame("http://www.linux.org");
final VerticalPanel pEast = new VerticalPanel();
pEast.setSize("100%", "100%");
pEast.add(fEast);
p.insertEast(pEast, 100, null);
fEast.setSize("90px", "90px");
final Frame fNorth = new Frame("http://www.w3c.org");
final VerticalPanel pNorth = new VerticalPanel();
pNorth.setSize("100%", "100%");
pNorth.add(fNorth);
p.insertNorth(pNorth, 100, null);
fNorth.setSize("80px", "80px");
final Frame fSouth = new Frame("http://www.sqlite.org");
final VerticalPanel pSouth = new VerticalPanel();
pSouth.setSize("100%", "100%");
pSouth.add(fSouth);
p.insertSouth(pSouth, 100, null);
fSouth.setSize("85px", "85px");
final Frame fCenter = new Frame("http://www.gnu.org");
final VerticalPanel pCenter = new VerticalPanel();
pCenter.setSize("100%", "100%");
pCenter.add(fCenter);
p.insert(pCenter, Direction.CENTER, 200, null);
fCenter.setSize("75px", "75px");
RootPanel.get().add(p);
}
}

GWT maps v3 click handler does not work in InfoWindow

GWT maps v2 InfoWindow had InfoWindowContent. GWT maps v3 InfoWindow doesn't have InfoWindowContent. I have found this code, but the click handler is not working:
InfoWindow info = new InfoWindow();
VerticalPanel verticalPanel = new VerticalPanel();
Label addressLabel = new Label("Address: " + address);
Label coordinatesLabel = new Label("Position: " + gLatLng.toUrlValue());
verticalPanel.add(addressLabel);
verticalPanel.add(coordinatesLabel);
HorizontalPanel horizontalPanel = new HorizontalPanel();
Button newAsociation = new Button("Add house");
Button deleteMarker = new Button("Delete");
newAsociation.addClickHandler(new ClickHandler() {
#Override
public void onClick(ClickEvent event) {
System.out.println("Add house");
}
});
horizontalPanel.add(newAsociation);
horizontalPanel.add(deleteMarker);
verticalPanel.add(horizontalPanel);
info.setContent(verticalPanel.getElement().toString());
info.open(mapWidget.getMap(), marker);
How do I fix that?
If you are using maps v3 from gwt-google-apis you can find a solution here.

Adding Border Layout In Accordion Layout

Can we add a content panel having border layout to a panle that is having an Accordion Layout. we are trying to put our central panle as well as west panel on a panle which displays this in accordion view. But not able to do this as the data is not displaying kinldy request to suggest.
Regards
Satish
You mean this?
public class test extends Composite {
private ContentPanel accordionPanel;
private ContentPanel borderPanel;
private ContentPanel westPanel;
private ContentPanel centerPanel;
public test() {
accordionPanel = new ContentPanel();
accordionPanel.setLayout(new AccordionLayout());
borderPanel = new ContentPanel();
borderPanel.setLayout(new BorderLayout());
westPanel = new ContentPanel();
borderPanel.add(westPanel, new BorderLayoutData(LayoutRegion.WEST));
centerPanel = new ContentPanel();
borderPanel.add(centerPanel, new BorderLayoutData(LayoutRegion.CENTER));
accordionPanel.add(borderPanel);
initComponent(accordionPanel);
}
}