how to position a decorator panel in gwt - gwt

i was wondering on how to position a decorator panel that wraps around a table. i made a flextable and used the function 'setStyleName' that links to another css file. in the css file, i used absolute positioning with .position as the selector
.position
{
position:absolute;
right:0px;
}
however, every time i used the command position:absolute, the flextable will move but the decorator panel (the blue line) doesn't. it just becomes a blue dot. its probably wrapping around something that is 1px by 1px or something. help would be greatly appreciated as ive been super stuck. thanks!

Set position:absolute for the decorator panel instead of the table.
I don't know what are you to achieve, but maybe you should use "float: right" instead (if you want the panel to stick to the right side of the parent element)

Related

How to add a scrollbar to an absolutepanel in GWT

my problem is that I have a lot of AbsolutePanels in GWT an they are drawn as if they were a TabLayoutPanel ( the GUI looks like a TabLayoutPanel, however, it is not one, it is made of a lot of AbsolutePanels ).
So, now I have the problem that as soon as a lot of tabs are opened they exceed the max. width of the AbsolutePanel and so they cannot be seen anymore nor can they be clicked or anything else.
So, is it somehow possible to add a ScrollBar to this AbsolutePanel in order to scroll back and forth?
I do not think it is a good idea to post any code because everything is being done programmatically. The only thing that I would need is an example of how to accomplish a scrollbar within an AbsolutePanel. This AbsolutePanel is of a fixed width!
Thank you very much for your help in advance.
Use CSS Overflow property.
You just need to set overflow: auto;.
It can be done programmatically:
panel.getElement().getStyle().setOverflow(Overflow.AUTO);
or with CSS style sheet:
.overflowAuto {
overflow: auto;
}
and
panel.addStyleName("overflowAuto");

In Gwt, how to make the little hand pop up when using ClickHandler for Label

Say, I don't like to use Anchor or Hyperlink, but prefer to use Clickable Label.
But After add ClickHandler for Label, & when I mouse over, there no little hand popup as we often see when using HyperLink or Anchor. So,
how to make the little hand pop up when using ClickHandler for Label?
you can acheive that in two ways:
With Gwt alone
lable.getElement().getStyle().setCursor(Cursor.POINTER);
and by adding css style to the lable(preffered)
lable.addStyleName(mylableStyle);
.mylableStyle {
cursor: pointer;
}

GWT ToolTip -Requirement

I am looking for tooltip/widget/popup panel like this one
Any idea for such tooltip in GWT ?? I tried ballon widget in gwt,but that does not help me,i need a tooltip like the one above that should also be selectable!
PopupPanel is certainly your best start. PopupPanel will get you an undecorated square box like your example, with user interaction.
Depending on your design requirements you can setup the content with straight HTML (embed an HTMLPanel, with the HTML as contents, inside a PopupPanel), or lay it out using the GWT layout tool.
Also look over: DecoratedPopupPanel for some ideas about decorating the border of your panel with css rules. This may help with the little triangle pointer at the top.
One more hint: you might end up embedding a FocusPanel in your PopupPanel if you need to track events outside specific GUI elements.

static positioning of the GWT popuppanel

I'm using a GWT popup panel for displaying some information stacked up vertically in my jsp page. The problem I'm facing is that, once the popup panel is displayed, it doesn't hold on to its set position. I'm setting the position of the popup panel using setPopupPosition().
However, whenever the user scrolls the browser, the popup panel displayed moves up and down accordingly. It doesn't maintain its original position, where it was displayed.
I've tried setting the css property to (position: fixed;) applied on the popup panel, but it doesn't work. I read someplace, that in order for an html element to be displayed statically, we can use the position: fixed, and width: 100% to achieve that. But in my case, I can't set the width to 100%, since I need the popup panel to be displayed for a specific size.
Is there a way to achieve the fixed position of the popup panel in GWT? Would I have to listen to browser's scrollbar events in order to fix the position or can it be handled differently.
This is my piece of code, which I use to set the popup panel's position in GWT.
final PopupPanel simplePopup = new PopupPanel(false);
_beamMenu = simplePopup;
rendererDisplay(response, simplePopup,true);
int left =_beamIcon.getAbsoluteLeft() + _beamIcon.getOffsetWidth() - simplePopup.getOffsetWidth();
int top = _beamIcon.getAbsoluteTop() - simplePopup.getOffsetHeight();
simplePopup.setPopupPosition(left, top);
Any help in this regard will be highly appreciated.
Many thanks,
Asheesh
add a css with: position: fixed !important;
The default behavior of the PopupPanel should be enough. You actually want position: absolute and not fixed. (See http://www.quirksmode.org/css/position.html for an explanation of position types, but fixed is when it appears to float as you scroll).
The issue you are likely running into, is that when you show the PopupPanel, it gets removed from wherever it was in the DOM, and added to the RootPanel:
(This is from GWT 2.4 so your exact code may very)
public void show() {
if (showing) {
return;
} else if (isAttached()) {
// The popup is attached directly to another panel, so we need to remove
// it from its parent before showing it. This is a weird use case, but
// since PopupPanel is a Widget, its legal.
this.removeFromParent();
}
resizeAnimation.setState(true, false);
}
...
public void setState(boolean showing, boolean isUnloading) {
...
RootPanel.get().add(curPanel);
...
}
As a result, though the position: absolute should be enough, likely your other top level Widgets are also absolutely positioned. Therefore, when you scroll the page you are likely actually scrolling the contents of one of your other widgets, and the PopupPanel is stuck to the outer element, which does not have a large offset-height and is not being scrolled. This is why it appears to have the same behavior as if it were using fixed positioning (i.e. always XX pixels from the top and side of the browser window).
Go back and look at your page construction and fix the other Widgets and you should be fine. From my observations, the new LayoutPanels use position: absolute all over the place, so you may have to manually set it to relative.

Change content of a Label depending on panel size

once again I've got a question. Since I am using Google Web Toolkit (GWT) at work (along with Java Servlets), I am currently building some user interface with GWT (in Java).
I've got some trouble though. I am using a SplitLayoutPanel which contains a ScrollPanel on the left and another one on the right.
In the left ScrollPanel there's a VerticalPanel with several Labels, which differ in their width. What I want to accomplish, is: if the Label's text doesn't fit in one line, it should display as many characters as possible and have a "..." in the end, if it's not fully displayed.
I am about to add a CustomEvent EventHandler for the Label, which can be fired whenever the Label needs to change its content. Now the problem however is, that I'd need to fire the event whenever the ScrollPanel or its inner VerticalPanel is resized (by dragging the SplitLayoutPanel-Splitter).
Now the question: is it possible to override some sort of "onResize"-Event or at least "onMouseMove"-Event inside the VerticalPanel, so that I could fire the "changeLabelSize()"-method for each Label inside of this VerticalPanel?
How would I go about it? Thank you all for your time in advance! Please ask for anything unclear, so I can clarify it.
Best regards,
Igor.
This can be done easily with the CSS property text-overflow: ellipsis;.
Supported by IE7-, Safari and Konqueror.
And it can be emulated in Firefox.