I am using ui binder to place elements on a GWT page but I am not able to place them correctly.As per my knowledge element in flow panel should appear in a horizontal line but they are appearing in a vertical line.
<g:FlowPanel>
<g:Label ui:field="searchLabel" text="{labels.searchFor}"> </g:Label>
<g:ListBox ui:field="searchListBox"></g:ListBox>
</g:FlowPanel>
<g:SimplePanel addStyleNames="{cres.style.textAlignCenter}">
<g:Button ui:field="searchButton" text="{clabels.search}"/>
</g:SimplePanel>
FlowPanel is just a (widget) wrapper around a simple div element. All the child widget will naturally flow as per the standard HTML behavior (i.e., block and inline elements are displayed as such).
On the contrary the Label widget is not a wrapper of an HTML label element. Again, is a div, so everything stacks up in your FlowPanel.
You can:
use an InlineLabel instead of a Label (will render as a span element);
use a float style on the Label or any other CSS trick to make two divs aligned horizontally;
use an HTMLPanel instead of a FlowPanel (they will behave the same), and lay out elements using also HTML for simple things like labels (i.e., mix and match HTML and Widgets inside it);
use an HorizontalPanel instead of a FlowPanel (but this will render as a table element, be warned).
Flow Panel working is some what strange. will not arrange all the Elements in the flow.Only for some Elements it will work as you expected.For example Buttons.
In case of block level elements will be same as Vertical Panel.For example if you are inserting two Horizontal Panels in a Flow Panel it is same as insering in Vertical Panel.
To achieve side by side arrangement you have to use CSS Float style.
The label is surrounded by a <div>-tag. Without a css style, every <div>-tag has a line break.
Use:
searchLabel.getElement().getStyle().setFloat(Style.Float.LEFT);
to avoid the line break.
Related
I'm new to gwt and I want a page like this...
***********Header panel*************
Tab1 *** Root panel 1
Tab2 ***
I managed to create everything but I don't know how to make my tabs vertical like that...
My code is,
public void onModuleLoad() {
headerRightPanel.add(portalLabel);
//Tabs which I want it vertical
headerRightPanel.add(orderMenu);
headerRightPanel.add(homeMenu);
headerRightPanel.add(logout);
logout.addClickListener(this);
homeMenu.addClickListener(this);
orderMenu.addClickListener(this);
headerPanel.setVisible(false);
homeMenu.setStyleName("menuEnabled");
orderMenu.setStyleName("menuEnabled");
logout.setStyleName("menuEnabled");
headerRightPanel.setStyleName("menuPanel");
portalLabel.addStyleName("portalLabel");
Image img = new Image("images/logo1.PNG");
headerLeftPanel.add(img);
headerLeftPanel.setStyleName("menuLeftPanel");
headerPanel.add(headerLeftPanel);
headerPanel.add(headerRightPanel);
RootPanel.get("imageContainer").add(img1);
RootPanel.get("sendButtonContainer").add(login);
RootPanel.get("headerContainer").add(headerPanel);
}
If you want to keep elements in a vertical position, use VerticalPanel:
http://www.gwtproject.org/javadoc/latest/com/google/gwt/user/client/ui/VerticalPanel.html
GWT has many components, unfortunatelly those ones are using tables, not css.
But in this example I would propably go with a css solution. And stay with divs only (FlowPanel with css class). GWT Vertical and Hirozontal Panels are using tables underneeth, that is a ... rough solution for creating layout.
I would mostly adise using UIBinder:
http://www.gwtproject.org/doc/latest/DevGuideUiBinder.html
If that is not too hard for you. But it would help you create a HTML fil next to java, and is more flexible when building complex structures.
Example: FlowPanel will produce a DIV in DOM, so you can add classes to it, set styles, css, hide it, show it, etc.
FlowPanel flowpanel = new FlowPanel();
flowpanel.addStyleName("css-name"); // yuo can add many css classes
flowpanel.hide().show()// you can hide and show it.
flowPanel.add(new FlowPanel())// you can add other elements to it.
Your whole structure is wrong. Rootpanel is the parent layout to which you add other things such as panels and widgets. Are you looking for something like disclosure panel?
Here is the demo of all the panels and widgets in gwt
http://samples.gwtproject.org/samples/Showcase/Showcase.html#!CwDisclosurePanel
I have a TabLayoutPanel and i don't want to give it a fixed height like in the following code example (tabPanel.setHeight("100px");). I want to give it the height of the tab content e.g. the HTML-Widget in the first tab). If i don't set the hight manually, the tab content is not shown at all. Is there any way to get this working with a height adapted to the content?
public class GWTTest implements EntryPoint {
public void onModuleLoad() {
TabLayoutPanel tabPanel = new TabLayoutPanel(3, Unit.EM);
tabPanel.setAnimationDuration(400);
tabPanel.add(new HTML("Tab1 Content"), "Tab 1");
tabPanel.add(new HTML("Tab2 Content"), "Tab 2");
tabPanel.setHeight("100px");
RootPanel.get().add(tabPanel);
}
}
I also tried to mess around directly in the css with the "overflow" and "postition"-attributes, but this then breaks always the animation or something else.
Edit: It seems the easiest way would be to implement my own tab panel - or use an existing javascript library.
Layout panels are a special kind of container in GWT that required sizes from their parents and can size themselves. The basis is the two interfaces ProvidesResize and RequiresResize - indicates that the object will size its children, the other that it must be sized when the parent's size changes. Most layout panels (like TabLayoutPanel) implements both - it needs a size change from its parent, and when it gets it, it will size its children, each tab.
To kick it off though, you need to add the root widget to a RootLayoutPanel, not a RootPanel. There are several chief differences - there is only one RootLayoutPanel (no get(String) method), and the RootLayoutPanel will size its children, while RootPanel will not.
Use RootLayoutPanel.get().add(tabPanel) instead of RootPanel.get().add(tabPanel).
I have also ran up with this issue, but sadly it requires height to be set. All the workaround s where a failure. But some of them suggest the following.
You can try to replace the TabLayoutPanel with a HeaderPanel:
A panel that includes a header (top), footer (bottom), and content
(middle) area. The header and footer areas resize naturally. The
content area is allocated all of the remaining space between the
header and footer area.
Alternatively you can override the onResize() method your ResizeLayoutPanel calculate the height of your embedded content and set the appropriate height.
If you want scrolling functionality you have to embed your VerticalPanel in a ScrollPanel or use CSS to set the oferflow property.
I have JTextPane inside JScrollPane. When I highlight some word in text pane I want to have their position highlighted on JScrollBar (Similar to highlighting errors in source code in Eclipse).
Is this possible with Swing?
The "immediate" problem you have is the fact that the scroll pane does not support the concept of "row footers", which would provide you an area on the right hand side of the scroll pane you could render you highlight points
Choice #1
What you need is an implementation that does. You could take a look at JideScrollPane which provides not only support for row footers, but column footers as well.
From there it's a simple case of using the same concept as decorating a normal scroll pane (row and column header).
Check out Providing Custom Decorations for some hints.
Choice #2
The other choice (I can think of) would be to place a normal JScrollPane onto a JPanel using a BorderLayout so that the scroll pane occupied the center position. This would then allow you to place a custom component to the EAST position that would act as you "marker" pane.
This is slightly simpler, as it doesn't require a lot of additional changes to be made. You would then need to calculate the position of the text in the view port as a percentage of the it's height, which would allow you to translate it back to the "marker" pane
I'm fairly new to Java and I'm trying to create a GUI application with some labels, buttons, and textfields. The program is pretty simple and I just wanted to use a default layout, which is FlowLayout. I managed to place and size everything fine, but the only thing seem to be not working is the alignment. I want to place buttons and textfields with certain alignments, but whenever I set an alignment, it moves the text inside of whatever the object rather than the object itself. For example, I wrote:
button.setHorizontalAlignment(JButton.RIGHT);
but it seems like it aligns the text inside the button instead of the button itself.
Is there any way to align the button itself rather than the text inside of it?
I know the alignment stuff could be easier with some other type of layout (e.g. BoxLayout), but I just want to use the FlowLayout for this one, unless it is impossible to align them using the FlowLayout (which I don't think so).
Thanks in advance.
See the constructor FlowLayout(int align).
Constructs a new FlowLayout with the specified alignment and a default 5-unit horizontal and vertical gap. The value of the alignment argument must be one of FlowLayout.LEFT, FlowLayout.RIGHT, FlowLayout.CENTER, FlowLayout.LEADING, or FlowLayout.TRAILING.
It seems you are after a FlowLayout.RIGHT as seen in this answer (the combo and check box at the top).
I don't think you can do this with a FlowLayout alone.
My suggestions would be:
Consider switching to MigLayout which is a much more powerful layout mechanism. MigLayout basically lets you position you components within a flexible grid, and you can set the specific alignment of a component within each grid cell.
When you want alignment of subcomponents, it also often makes sense to put them inside a nested JPanel. You can then use a separate layout for this JPanel (BorderLayout perhaps?) which will enable you to get the exact alignment that you want.
setHorizontalAlignment of AbstractButton sets the horizontal alignment of the icon and text not the position of the button. AbstractButton's default is SwingConstants.CENTER.
If you want to align the button..set the position while adding it to the panel or frame..something like this....
p.add(button, BorderLayout.SOUTH);//using `BorderLayout`
Flow layouts are typically used to arrange buttons in a panel. It will arrange buttons left to right until no more buttons fit on the same line.
This write up on JPanel seems to focus on this container as a means of setting a background color. Oracle on how to use JPanel Should I infer that if I am happy with the default grey background in ubuntu/gnome/Java programs, there is no need to use this object? Is there an object-oriented programming reason to use this object?
JPanels are a way to create a logical "division" of space if that makes any sense. For example, if you think about HTML, you could just put elements one after another on the page (how some old HTML pages look in fact) but it's much more aesthetically pleasing to use a container like a table, or some CSS styled DIV tags to create divisions on the page, and place elements relative to one another in a much more defined manner.
JPanels fill this function in Swing, where each JPanel has a Layout Manager that defines how it's inner elements are laid out. It's not unusual to nest JPanels, for example, using a JPanel with a border layout for the menus/status bar, etc, a JPanel at the center of that with further elements, and then additional JPanels inside of that central "content panel" area that further divides the space, for example, creating an input form on one part of the central panel.
In this sense, JPanels are quite comparable to how Tables and Divs are used in HTML, and you should think of them in a similar manner when creating your layout. The most important thing about JPanels is their ability to dynamically resize, pushing the contained components around. If you just used, say, one JPanel and absolutely positioned everything, then you'd lose the main appeal of Swing, and this container methodology.
It's quite possible you perceived the authors angle to be one slanted towards color and drawing, but I think if you give the blog a second read you will find that he was indeed trying to be more expansive than that. JPanel's can and are used as content panes for a variety of other widgets in a typical Swing application.
Also I'm not sure why you reference Ubuntu/Gnome, as the L&F of a platform is quite divorced from the utility of JPanel.