Revision: 6135
Author: [email protected]
Date: Fri Sep 11 17:09:28 2009
Log: Programatic access to styles
http://code.google.com/p/google-web-toolkit/source/detail?r=6135
Modified:
/wiki/UiBinder.wiki
=======================================
--- /wiki/UiBinder.wiki Fri Sep 11 16:58:20 2009
+++ /wiki/UiBinder.wiki Fri Sep 11 17:09:28 2009
@@ -139,11 +139,11 @@
}}}
A CssResource interface is generated for you, along with a ClientBundle.
This means that the compiler
-will warn you if you misspell the class name when you try to use it (e.g.
{style.prettty}).
-
-Also, your css class name will be obfuscated, and so protected from
collision with similar classnames
-in other css blocks. In fact, you can take advantage of this within a
single template:
-
+will warn you if you misspell the class name when you try to use it (e.g.
{style.prettty}). Also,
+your css class name will be obfuscated, and so protected from collision
with like classnames
+in other css blocks--no more global CSS namespace!
+
+In fact, you can take advantage of this within a single template:
{{{
<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder'>
@@ -160,7 +160,7 @@
</ui:UiBinder>
}}}
-Finally, you don't have to have your CSS inside your ui.xml file to take
advantage of this.
+Finally, you don't have to have your CSS inside your ui.xml file.
Most real world projects will probably keep their CSS in a separate file:
{{{
@@ -175,7 +175,36 @@
}}}
-
+= Programatic access to inline Styles =
+
+(*type='' doesn't allow for multiple interfaces. Needs thinking*)
+
+{{{
+ <ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder'>
+ <ui:style type='com.my.app.MyFoo.MyStyle'>
+ .redBox { background-color:pink; border: 1px solid red; }
+ .enabled { color:black; }
+ .disabled { color:gray; }
+ </ui:style>
+
+ <div class='{style.redBox} {style.enabled}'>I'm a box. And I'm
red.</div>
+ </ui:UiBinder>
+}}}
+
+{{{
+ class MyFoo extends Widget {
+ interface MyStyle extends CssResource {
+ String enabled();
+ String disabled();
+ }
+
+ @UiField MyStyle style;
+
+ void setEnabled(boolean enabled) {
+ getElement().addStyle(enabled ? : style.enabled() :
style.disabled());
+ }
+ }
+}}}
=Using an external resource with a UiBinder=
--~--~---------~--~----~------------~-------~--~----~
http://groups.google.com/group/Google-Web-Toolkit-Contributors
-~----------~----~----~----~------~----~------~--~---
