On 8/8/05, Frank W. Zammetti <[EMAIL PROTECTED]> wrote:
> That is a good article, thanks for pointing it out Geeta!
> 
> Ironically, I remember very well, that calculator example is the exact
> same one I saw more than two years ago at a Java user's group meeting...
> it must get the point across well :)  I remember they showed all sorts
> of state diagrams and expanded on it a bit, which made JSF seem very
> overwhelming... this article does the exact opposite, which is a
> pleasent change as far as I'm concerned.
> 
> I hope this isn't seen as thread-jacking, but I think it's a relevant
> question and I'm hoping Craig or someone very much in-tune with JSF can
> answer this...
> 

And you were so ***good*** about the Maven thread!  :-) :-) :-)

> I know you can apply styles to the various JSF controls... my question
> is, to what extent can you do so?
> 

There's no global answer that applies to all components ... see below
for some sceanrios.

> Taking something like the panelGrid from this example... what if I
> wanted to have the messages directly below the textboxes in a small red
> font and the buttons to the right?  What if I wanted to apply a
> background image to the textbox to give it an inner bevel appearance?
> Would this all be possible within the confines of JSP, and more
> importantly, would it be a very difficult exercise?

Regarding stylability, the JSF standard components basically adopted a
common convention from the Struts tags, in that they all sport a
"styleClass" and a "style" attribute.  The former is essentially a
passthrough to the HTML "class" attribute (you can't use that directly
in JSP because of the way JavaBeans property names work ... getClass()
is inherited from java.lang.Object so you can't have a JSP attribute
named "class").  In a similar way, the "style" attribute value, if
specified, is passed through directly.

As a result, the standard JSF components have a minimum level of
styleability equivalent to corresponding Struts tags.  Some of them go
a little further, however:

* The "footerClass" attribute lets you specify the overall style class to add
  to a panel footer (HtmlDataTable, HtmlGridPanel)

* The "headerClass" attribute lets you specify the overall style class to add
  to a panel header (HtmlDataTable, HtmlGridPanel)

* The "columnClasses" attribute lets you specify the overall style class to
  use on each individual column (HtmlDataTable)

* The "rowClasses" attribute lets you specify the overall style class to
  use on each individual row (HtmlDataTable).  In particular, this lets you
  do things like even/odd row striping very easily.

In all of the above cases, you have to explicitly specify style
classes on all the components you want them to apply to.  An
additional (and/or alternative ... it is not mutually exclusive)
strategy is for a component library to render explicit stye class
names by default -- the new components in Sun Java Studio Creator 2 EA
do this, for example.  This allows you to abstract the actual
appearance stuff related to, say, a Data Table component into a
stylesheet ... and then provide a separate mechanism to select which
stylesheet to use at runtime.  In Creator, this notion is called
"theming".

To your specific example, it's definitely possible to do all of this,
even if you are using only the standard JSF components.  However,
you'll find it easier to use components that do the grunt work for
you.  Just as an example of what's possible, the Label component (in
Creator 2 EA) is used to create a component label associated with an
input field.  Out of the box, this component:

* Includes a "level" property that takes a 1/2/3 value to determine
  how "important" this label is.  This translates into different style
  class names being emitted at runtime, without the page author having to
  know things like style class names.

* Has a "for" attribute that contains the id of the input component this
  field is associated with.  This supports three interesting features:

  - Emits the appropriate HTML for creating accessible applications,
    so that a screen reader can understand what prompts go with
    what fields.

  - If the field corresponding to this label has its "required"
property set to true,
    emit a theme specific icon (by default an "*" character) next to the label.

  - If the field corresponding to this label has its "valid" property
set to false
    (because a validation rule failed), display the label text in
(say) red instead
    of the default color (typically black).

All of this is possible with CSS support at the level of Struts tags
(or the JSF standard components), but it is definitely tedious.  Much
nicer is knowing I can simply drag a label component onto the design
surface and click-drag the corresponding input field to establish the
linkage (err, for those of you not using Creator, that means "type in
a couple of JSP custom tags and remember to set the 'for' attribute
correctly" :-), and know that all the dynamic stuff just works.

> 
> Frank
> 

Craig

PS:  It's pretty straightforward to build turbo versions of the Struts
HTML tags that have many of the same features described above.  But
that doesn't begin to touch the behavior at input time, where the
component itself deals with details like converters, and completely
eliminates the need for a form bean.

---------------------------------------------------------------------
To unsubscribe, e-mail: [EMAIL PROTECTED]
For additional commands, e-mail: [EMAIL PROTECTED]

Reply via email to