package com.demosten.client; import com.google.gwt.user.client.DOM; import com.google.gwt.user.client.Element; import com.google.gwt.user.client.ui.ComplexPanel; import com.google.gwt.user.client.ui.InsertPanel; import com.google.gwt.user.client.ui.Widget; public class GroupBoxPanel extends ComplexPanel implements InsertPanel { private Element legend; public GroupBoxPanel() { Element fieldset = DOM.createFieldSet(); this.legend = DOM.createLegend(); DOM.appendChild(fieldset, legend); setElement(fieldset); } @Override public void add(Widget w) { add(w, getElement()); } public void insert(Widget w, int beforeIndex) { insert(w, getElement(), beforeIndex, true); } public String getText() { return DOM.getInnerText(this.legend); } public void setText(String text) { DOM.setInnerText(this.legend, text); } }
it can be used in UiBinder Templates:
<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent"> <ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder' xmlns:g='urn:import:com.google.gwt.user.client.ui' xmlns:d='urn:import:com.demosten.client'> <g:VerticalPanel> <d:GroupBoxPanel text="Account data"> <g:HorizontalPanel> <g:Label>e-mail:</g:Label> <g:TextBox /> </g:HorizontalPanel> <g:HorizontalPanel> <g:Label>password:</g:Label> <g:PasswordTextBox /> </g:HorizontalPanel> </d:GroupBoxPanel> <g:HorizontalPanel> <g:Button text='Sign in' /> <g:Button text='Register' /> </g:HorizontalPanel> </g:VerticalPanel> </ui:UiBinder>
Use it as you like :)
4 comments:
What was the problem with CaptionPanel?
Since GWT 1.5 there is a standard widget named CaptionPanel that is rendering fieldset elements.
The main problem with CaptionPanel is the name. I didn't found it with my searches. In all UI frameworks I'm using the name includes Groupsomething. My bad! Anyway it's good to know it's there :)
Thanks for the experiment for caption panel its really useful.
Post a Comment