I need anyone to tell me how to center Grid inside the contentpanel.
I created content panel width 100% and the grid width is 50% and I need to center the grid inside the contentpanel.
thank you in advance,
You can use CenterLayoutContainer widget.
Sample code:
#Override
public Widget asWidget() {
//Your panel
ContentPanel panel = new ContentPanel();
//Сontainer with your content
CenterLayoutContainer container = new CenterLayoutContainer();
container.add(yourGrid);
//Put container into panel
panel.setWidget(container);
return panel;
}
Have a look at CenterLayoutContainer: http://www.sencha.com/examples/#ExamplePlace:centerlayout
This is for the new version, 3.0. The older 2.2.5 also has an analogous layout type.
Related
Inside our (GXT)HorizontalPanel are two components.
I want to set the width for the first component to 100%. In GWT there is a method like HorizontalPanel#setCellWidth (see Sizing a HorizontalPanel cell). But in GXT there is not method like that.
We use GXT 2.3.1 and I DON'T want to use a GWT HorizontalPanel. It has to be a GXT HorizontalPanel (please don't ask why ;-))
I found a solution for my problem. Here is some code that works for me.
public class HPanel extends HorizontalPanel {
public HPanel(){
Widget widget1 = new Widget();
Widget widget2 = new Widget()
TableData tableData = new TableData();
tableData.setWidth("100%");
setLayoutData(widget1, tableData);
}
}
You can apply CSS style.
Java
widget.setStyleName("myStyle");
css:
.myStyle{
width:100%;
}
I was wondering is there any possibility to get the inner size of a
com.google.gwt.user.client.ui.ScrollPanel
object in GWT? I would like to create a children of the ScrollPanel that fits exactly into the empty space, without activating the scroll bars.
The ScrollPanel is initialized as follows:
[begin update after answer of #Abhijith Nagaraja]
public void onModuleLoad() {
Window.setMargin("0px");
TabLayoutPanel tabs = new TabLayoutPanel(30, Unit.PX);
//attach the tab panel to the body element
RootPanel.get(null).add(tabs);
//set the TabLayoutPanel to full size of the window.
String width = (Window.getClientWidth()) + "px";
String height = (Window.getClientHeight()) + "px";
tabs.setSize(width, height);
//create the scroll panel and activate the scroll bars
ScrollPanel scrollPanel = new ScrollPanel(new Button("a second button"));
scrollPanel.getElement().getStyle().setOverflowX(Overflow.SCROLL);
scrollPanel.getElement().getStyle().setOverflowY(Overflow.SCROLL);
//attach the scroll panel to the DOM
tabs.add(scrollPanel, "tab1");
System.out.println(scrollPanel.getOffsetWidth()); // --> 0
System.out.println(scrollPanel.getOffsetHeight()); // --> 0
}
[end update]
Reason: I want to initialize a dynamic visualization (which requires scrollbars at a later point in time) in such a way that, it looks nice and avoiding to add the ScrollPanel later.
ScrollPanel sp = new ScrollPanel();
...
int innerWidth = sp.getOffsetWidth()- sp.getElement().getScrollWidth();
...
NOTE: You can use the above code only if your scrollPanell is attached to the screen. In other words it should be rendered.
DOM.setStyleAttribute(scrollpanel.getElement(), "maxHeight", mMainHeight + "px");;
I have a loading popup that I need to display on the top of the page, even if the user scroll down.
What I tried so far is to set the popup position as follows
setPopupPosition(Window.getClientWidth()/2 , 0);
The popup shows up on the absolut top.
The situation can be resolved easily if you view it from a different angle: Not the popup position should adjust to the page - instead, the page should scroll behind the centering popup, e.g.:
final ScrollPanel scrollPanel = new ScrollPanel();
RootLayoutPanel.get().add(scrollPanel);
pagePanel = new FlowPanel();
scrollPanel.setWidget(pagePanel);
pagePanel.add(...);
Now add the entire page contents to pagePanel (instead of adding them directly to rootPanel).
Then you can create popups like this:
final PopupPanel popupPanel = new PopupPanel();
popupPanel.add(...);
popupPanel.center();
You'll still have to re-center the popup when the window resizes, but apart from that, the popup will always be at the center in front of the scrolling page.
To achieve this you can implement Window.addWindowScrollHandler. It will always be on top whatever you do.
DialogBox dialog = new DialogBox();
dialog.setWidget(...);
Window.addWindowScrollHandler(new ScrollHandler() {
#Override
public void onWindowScroll(ScrollEvent event) {
dialog.setPopupPosition((Window.getClientWidth() - widthOfDialog) / 2, event.getScrollTop());
}
});
Hope this helps.. Thanks..
The solution that worked for me is this
setPopupPosition(Window.getClientWidth()/2 , Window.getScrollTop());
Given the code below, how is it possible to use a percentage to get width and hight
(when I do tabs.setWidth("80%") - it doesn't work).
any idea?
final TabSet tabs = new TabSet();
tabs.setWidth("80%"); //this doesn't work I use tabs.setHeight(600);
tabs.setHeight(600);
Add your TabSet to a Layoutmanager and do the sizing there (do not use size on the TabSet directly):
final TabSet tabs = new TabSet();
//TODO create some tabs
VLayout vLayout = new VLayout();
vLayout.addMember(tabs);
vLayout.setWidth("100%");
vLayout.setHeight("100%");
See examples how to use VLayout in the smartgwt showcase - layout . There are also other Layoutmanagers HLayout, VStack, HStack,...
Does anybody know how to resize a GWT DockLayoutPanel's child panels? When I add a directional panel I have to give it a size ie:
panel.addSouth(new HTML("south"), 2);
How can I then resize this south panel after the fact?
You can use the setWidgetSize method like this:
DockLayoutPanel panel = new DockLayoutPanel(Style.Unit.EM);
HTML html = new HTML("south");
panel.addSouth(html, 2);
// change the size of the html widget to 4em
panel.setWidgetSize(html, 4);