Enterprise Client Community

Hello,

where can I use % for the attributes width and height in ComponentTags?
Has anybody experience?

Joachim Unger

Hi,

do you mean components you created by your own?
(extending BaseComponentTag)

Markus

Hi,

I mean LABELComponentTag, FIELDComponentTag, ...

For PANEComponentTag 100% works, but HEXIMAGEComponentTag doesn't.

Joachim

Hi,

you can use percentage sizes consitently. E.g. the demo worklplace, image demo, also shows HEXIMAGE with percentag size.

You have to pay attention: when specifying a percentage size, the parent components have to "give space", so that the percentages can be applied. Otherwise "100% of 0" is "0".

Code:

 Wrong:
 
 ROWBODYPANE
   ROW
     PANE
       ROW
         IMAGE width=100%
 The PANE does not have a width on its own, so 100% has no refeerence.
 
 Correct:
 ROWBODYPANE
   ROW
     PANE width=100% (or width=300, or width=50%, ...)
       ROW
         IMAGE width=100%
 Now the sizing knows what to do.

Regards, Björn

Hi Björn,

please have a look at this:

Code:

 ...
 <t:row id="g_7" >
 <t:pane id="g_8" componentbinding="#{d.AnalyticClientMBean.parameterPANEComponent}" height="200" rowdistance="5" width="200" />
 </t:row>
 ...

And this is, what I put unter the pane (console output):

Code:

 org.eclnt.jsfserver.elements.impl.ROWComponent
   org.eclnt.jsfserver.elements.impl.TABBEDPANEComponent
   _rendered:
     true
   enabled:
     true
   height:
     400
   width:
     400
     org.eclnt.jsfserver.elements.impl.TABBEDPANETABComponent
     enabled:
       true
     text:
      Tab
       org.eclnt.jsfserver.elements.impl.ROWComponent
         org.eclnt.jsfserver.elements.impl.PAINTAREAComponent
         _rendered:
           true
         height:
           200
         width:
           400
         org.eclnt.jsfserver.elements.impl.LABELComponent
         text:
           Label
         y:
           0
         x:
           0
         width:
           100
         org.eclnt.jsfserver.elements.impl.FIELDComponent
         flush:
           true
         y:
           0
         x:
           100
         width:
           100%
         background:
           #FFFFFF

Any hints?

Joachim

Hi,

why do you set the "x" in the FIELD - this means that the component receives an absolut coordinate (which is not perfect when running in a ROW...)

COuld your remove the "x=100" definition?

Regards, Björn

Hi Björn,

the x coordinate is a position inside org.eclnt.jsfserver.elements.impl.PAINTAREAComponent, not a row.

Joachim

Hi,

oh yes, you are using PAINTAREA-Components... - then it's easy!

%values in paint areas are not supported/reasonable/valid/... - what should be the base for a %-calculation? In a PAINTAREA all components are just dropped somewhere on a canvas without relation to any other component.

Wyh do you you use PAINTAREA component here? It should primarily be used in scenarios, where x,y positions have some semantic meaning. In nearly all other scenarios, the normal table-layout is much more efficient. And the table layout supports % sizing.

Regards, Björn

Hi Björn,

usage of paintarea depends on the solution:
At design time it should be possible for a designer to place widgets like buttons, fields, images, ... anywhere on a pane. It's called an analytic report template. At runtime the output is generated by groovy- and database-scripts and user interactions (like selections from a combobox, entering data into a field) by the end user.

Now I checked a use case inside EC-tool. You are right. Inside a paintarea there is no possibility to use % for widths.

Do You have an idea, how I can solve the demand for that?

Joachim

Hi,

yes, you let the user place the content into x,y coordinates at design time and then translate this into a table layout at runtime.

Björn

Hi Björn,

okay. That's an option. I will ask the customer.
Do You have an out of the box solution?

Joachim

Hi,

do I get your salary? ;-)

Regards, Björn