return "colorpicker";
}
- /** Encode the property value of the field from RGB components. */
+ /** Set the currently selected color. */
public void setColor(String newcolor) {
- setValue(new String(newcolor));
+ // Sets the color name as the property of the component.
+ // Setting the property will automatically cause repainting of
+ // the component with paintContent().
+ setValue(newcolor);
}
- /** Decode the property value of the field to RGB components. */
+ /** Retrieve the currently selected color. */
public String getColor() {
return (String) getValue();
}
- /* Paint (serialize) the component for the client. */
+ /** Paint (serialize) the component for the client. */
public void paintContent(PaintTarget target) throws PaintException {
// Superclass writes any common attributes in the paint target.
super.paintContent(target);
- // Set any values as variables of the paint target.
+ // Add the currently selected color as a variable in the paint target.
target.addVariable(this, "colorname", getColor());
}
+ /** Deserialize changes received from client. */
public void changeVariables(Object source, Map variables) {
// Sets the currently selected color
if (variables.containsKey("colorname") && !isReadOnly()) {
String newValue = (String) variables.get("colorname");
+ // Changing the property of the component will
+ // trigger a ValueChangeEvent
setValue(newValue, true);
}
}
import com.itmill.toolkit.terminal.gwt.client.UIDL;\r
\r
public class WidgetSet extends DefaultWidgetSet {\r
- public Widget createWidget(UIDL uidl) {\r
- String className = resolveWidgetTypeName(uidl);\r
- if ("com.itmill.toolkit.demo.colorpicker.gwt.client.ui.ItkColorPicker"\r
- .equals(className))\r
- return new ItkColorPicker();\r
+ /** Creates a widget according to its class name. */\r
+ public Widget createWidget(UIDL uidl) {\r
+ String className = resolveWidgetTypeName(uidl);\r
+ if ("com.itmill.toolkit.demo.colorpicker.gwt.client.ui.ItkColorPicker"\r
+ .equals(className))\r
+ return new ItkColorPicker();\r
\r
- return super.createWidget(uidl);\r
- }\r
+ // Let the DefaultWidgetSet handle creation of default widgets\r
+ return super.createWidget(uidl);\r
+ }\r
\r
- protected String resolveWidgetTypeName(UIDL uidl) {\r
- String tag = uidl.getTag();\r
- if ("colorpicker".equals(tag))\r
- return "com.itmill.toolkit.demo.colorpicker.gwt.client.ui.ItkColorPicker";\r
+ /** Resolves UIDL tag name to class name. */\r
+ protected String resolveWidgetTypeName(UIDL uidl) {\r
+ String tag = uidl.getTag();\r
+ if ("colorpicker".equals(tag))\r
+ return "com.itmill.toolkit.demo.colorpicker.gwt.client.ui.ItkColorPicker";\r
\r
- return super.resolveWidgetTypeName(uidl);\r
- }\r
+ // Let the DefaultWidgetSet handle resolution of default widgets\r
+ return super.resolveWidgetTypeName(uidl);\r
+ }\r
}\r
public static final String CLASSNAME = "example-colorpicker";
/** Component identifier in UIDL communications. */
- String uidl_id;
+ String uidlId;
/** Reference to the server connection object. */
ApplicationConnection client;
*/
public void updateFromUIDL(UIDL uidl, ApplicationConnection client) {
// This call should be made first. Ensure correct implementation,
- // but don't let container manage caption etc.
- if (client.updateComponent(this, uidl, false))
+ // and let the containing layout manage caption, etc.
+ if (client.updateComponent(this, uidl, true))
return;
// Save reference to server connection object to be able to send
this.client = client;
// Save the UIDL identifier for the component
- uidl_id = uidl.getId();
+ uidlId = uidl.getId();
// Get value received from server and actualize it in the GWT component
setColor(uidl.getStringVariable("colorname"));
// Updating the state to the server can not be done before
// the server connection is known, i.e., before updateFromUIDL()
// has been called.
- if (uidl_id == null || client == null)
+ if (uidlId == null || client == null)
return;
// Communicate the user interaction parameters to server. This call will
// initiate an AJAX request to the server.
- client.updateVariable(uidl_id, "colorname", newcolor, true);
+ client.updateVariable(uidlId, "colorname", newcolor, true);
}
}
-/* Set style for the color picker table. */
+/* Set style for the color picker table.
+ This assumes that the Grid layout is rendered as a HTML <table>.*/
table.example-colorpicker {
border-collapse: collapse;
border: 0px;
}
-/* Set color picker button style. */
-.example-colorpicker button {
+/* Set color picker button style.
+ This does not make assumptions about the HTML element tree as it only uses
+ the logical class names.*/
+.example-colorpicker .gwt-Button {
height: 60px;
width: 60px;
border: none;
padding: 0px;
}
-/* Set style for the right-hand sample box that shows the currently selected color. */
-td.colorpicker-currentcolorbox {
+/* Set style for the right-hand box that shows the currently selected color.
+ While this may work for other implementations of the HorizontalPanel as well,
+ it somewhat assumes that the layout is rendered as a table where cells
+ are <td> elements. */
+.colorpicker-currentcolorbox {
width: 240px;
text-align: center;
vertical-align: middle !important;