Left-aligned tabs in GWT - gwt

I have a project in which I need a way to display essentially a list of tabs, each with their own content pages, down the left side of the page. I'm using TabLayoutPanels elsewhere to good effect, but after looking at how they are constructed it seems like it would be quite a bit of work to undo Google's carefully constructed layout and get it to work in any other orientation than top-aligned.
This doesn't seem like it would be an uncommon layout, so does anyone know of a successful implementation of this kind of container?

Best you can do is use DeckPanel, and make your custom tab controls to switch visible widget in that DeckPanel.

Related

How do I create an App-like header with html/css?

I'm building an app with Phonegap/Cordova and Web standards, such as HTML and CSS. However, somewhere on the part of creating this, my skills aren't sufficient.
Ok, let's get this straight: I'm trying to create a navigation bar at the top of the screen. Very basic, even without buttons, just plain text with links.
Check-out this screenshot. As you might see or not.. The middle one isn't exactly placed in the middle. I've tried with div styles, span classes and tables seem the best option.. Yet still insufficient.
What's the best option to create such header?
p.s. No, of course there won't be a border in the table :D - Just for viewing. ^^
I did an example of something like this for a talk... here's a basic version with just a header and some scrollable content: http://jsbin.com/UWeQeli/1/edit
Hope it helps.

GWT widget: top page popdown message bar - similar to the one here on stackoverflow

Has anyone seen or have an idea on how to go about creating widget that would function like the pop-down message bar here at stackoverflow?
I implemented one with absolute positioning. My entire page is generated by GWT, so it was (relatively) easy to use RootLayoutPanel.get().add(popupWidget), and then use RootLayoutPanel.get().setWidgetTopHeight(), etc, to animate the thing on and off the screen.

How to disable hover effect to highlight menu items in GWT MenuBar?

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.

Is it possible to detect a scrollbar release event in GWT?

I'm building a GWT app where I want to be able to detect when a user releases a scroll bar on one of my ScrollPanels.
My use case is that the horizontal scroll bar represents time. Since it's impossible to represent the full range of scrollable time I want to just represent a small window of time with the scroll bar. When the user moves and releases the scroll bar I want to do a smooth recentering where the new center is the release point.
I can work out how to do this by building a custom scroll bar widget, but I wanted to check if I was missing some way to do it using a "native" scroll bar first.
You might be able to do it with a ScrollPanel and implementing your own ScrollHandler. Just use the addScrollHandler() method and you should be able to override whatever functionality you need.
However, I would suggest that you re-think your approach. What you seem to really want is a slider control for time, that kind of looks like a scroll bar. You should check out the Composite class and the Widget Gallery to see if there is some combination of Widgets that would suit what you need more. Failing that, I'd also look at SmartGWT. They have a very extensive library of GUI Widgets available, and you may find something you can use already there.

Scrolling TabPanel

I Am trying to create a Tab Panel where I can add and delete tabs on demand.
Where I am getting stuck is that if a potential user adds too many tabs the new tabs go off the screen.
Each Tab is to contain a text area widget where a user may enter text.
Is there any way of horizontally scrolling the just the TabBar and not the whole browser window?
I could use a scroll panel but I was hoping to scrol just the Tabs, not the panel contents.
I cannot see any available method in the com.google.gwt.user.client.ui.TabPanel API that will perform this function and no real way to split the panel.
Help!
It's not what you've asked for, but you might consider using a StackPanel instead of a TabPanel, since if the user can enter a long list of items it's generally better to have vertical scrolling instead of horizontal scrolling.
The gwt TabPanel isn't the greatest, and there's not a real easy way to do what you want. You could take a look at the tab widget in Ext-GWT, which scrolls the tabs, but I don't think extjs is generally a good idea.
There's a bunch of new layout-based widgets arriving with GWT 2.0. Look at TabLayoutPanel. It places tabs in a very wide container inside a div with overflow=hidden. You might be able to add some controls to scroll that container and get the effect you want.
Good luck, and report back if you get something working. GWT really needs more widget contributors.