I am currently working with GWT and the SuggestBox.
The Suggestboxpopup is appearing behind the panel the Suggestbox is placed on. I am aware that there is an issue with the Suggestbox popup's z-index but I am looking to see if anyone has another solution other than hard-wiring the the z-index in the CSS.
The reason for this is the panel the suggest box is on has a Z-index helper which moves the panel to the front anytime it is clicked. While a super high z-index will resolve the issue i am wondering has anyone found a better solution which will allow the popup to move with the other widgets.
Yep, this is an known problem in SuggestBox which is in the issues list of GWT. It has been closed recently because of a lack of activity in the issue, you can put a comment to reopen it though.
I think it is not very important because no much apps need a suggest box on a popup.
I had the same issue in a project and I solved it with css as you suggest.
Related
Buttons under the NoResultsOverlay or NoRowsOverlay component are not clickable due to absolute positioning and no z-index.
Also if the data grid is set to autoHeight, the overlay components are cut-off.
Code Sandbox link below to reproduce the issue.
https://codesandbox.io/s/customemptyoverlaygrid-demo-mui-x-forked-6hu6f6?file=/demo.js
The custom component gets wrapped by an absolutely positioned DIV with no z-index. Adding that fixes the issue.
But how to add it through componentProps or css is the question.
Please help.
Seems fixing this issue is a work in progress. Here is pull request resuming the different issues about overlays
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");
Some of the stakeholders on my project expressed doubt in easily recognizing hidden vertical content to scroll to in an MGWT ScrollPanel (without taking a swipe at it). As an attempt to address the concern I'd like to always show the pretty semi-transparent vertical scrollbar as both a hint of more content to scroll to and an indication of the ratio between the amount of displayed vs. all content in the panel.
Is it possible to keep the panel's scrollbars permanently displayed? At first I thought the setShowScrollBarY(boolean) would do the trick but quickly proved myself wrong.
P.S.: Shouldn't there be an m-gwt StackOverflow tag by now? AFAIKT MGWT has gained sufficient traction to have an MGWT-specific stream of questions.
I have had the same issues with clients that suggested that showing scrollbars would be a good idea. If you cut your content right its easy to see for the user that there is more content..
Anyhow I just added a setHideScrollBar(boolean) to the trunk. Download it from ( https://oss.sonatype.org/service/local/artifact/maven/redirect?r=snapshots&g=com.googlecode.mgwt&a=mgwt&e=jar&v=LATEST) and give it a try. Maybe we should also think of an option to flash the scrollbars once to indicate that there is more content.
By the way I would be supporting an mgwt specific tags as I do with the mailing list: https://groups.google.com/group/mgwt
I am making a vertical Menu using GWT MenuBar and selection of particular MenuItem shows content on the right, I am trying to make something similar to TabPanel, but with Tabs on left instead of being on top. Now, since I've got the Menu items and actions in place, I want to remove the effect of hovering over and changing color, and keep that menu item selected which was clicked last and whose content is loaded on the right.
I am open to any comments, if you have a better solution to implement this, using some other components(with-in) GWT, please drop in a comment with your suggestions, I'll really appreciate that.
Or if you can just tell me how can I disable this effect, of hovering and sticking to only that selection, That would be awesome too..
Thanks to everyone, taking time to read this and suggesting a solution.
It's all defined in the CSS of your GWT's theme (probably the default one), so it's a matter of overriding those styles - make sure it's not the other way around :) Inspect the code with a tool like Firebug to see what's exactly being set and change that.
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.