-
FEATURED COMPONENTS
First time here? Check out the FAQ!
Hello,
I´ve got 30 fields in my listbox - always with headers. In the first view, the header is directly above the column. But when I set the width to every header field, the headers are not directly above the columns any more. There is a gap. With every field more, the difference between header and column will be bigger. And it depends not on the content of the column. I got the problem with FF and IE. Whats the problem? The column should be always even with the header and the listbox should be scrollable to the right.
Example:
<window id="dataWindow" title="Suchergebnisse">
<listbox id="dataListbox" mold="paging">
<listhead>
<listheader label="abc1" width="100px" />
<listheader label="aasdfbc2" width="100px"/>
<listheader label="abyxcvyc3" width="100px"/>
<listheader label="abwerc4" width="100px" />
<listheader label="ayxcvybc5" width="100px"/>
<listheader label="abxycv ewadfc6" width="100px" />
<listheader label="abc7" width="100px" />
<listheader label="abc8" width="100px" />
<listheader label="abyxcvcvc9" width="100px" />
<listheader label="abc10" width="100px"/>
<listheader label="abccc11" width="100px"/>
<listheader label="abccc12" width="100px"/>
<listheader label="abbbbbc13" width="100px"/>
<listheader label="abccc14" width="100px"/>
<listheader label="abcccc15" width="100px"/>
<listheader label="abc16" width="100px"/>
<listheader label="abcccccc17" width="100px"/>
<listheader label="abccccc18" width="100px"/>
<listheader label="abc19" width="100px"/>
<listheader label="abcccc20" width="100px"/>
<listheader label="abc21" width="100px"/>
<listheader label="abc22" width="100px"/>
<listheader label="abccc23" width="100px"/>
<listheader label="abccc24" width="100px"/>
<listheader label="abcc ccccc25" width="100px"/>
<listheader label="abcc ccc26" width="100px"/>
<listheader label="abc27" width="100px"/>
<listheader label="accbc28" width="100px"/>
<listheader label="abcccccc cc29" width="100px"/>
<listheader label="abc30" width="100px"/>
</listhead>
<listitem >
<listcell label="sdfxycvvrd1"/>
<listcell label="sdfxycvfnrd2" />
<listcell label="sdfxycvvpd3" />
<listcell label="sdfxycveinrched4" />
<listcell label="sdfxycvsued5" />
<listcell label="sdfxycvsuengutachtend6" />
<listcell label="sdfxycvvaed7" />
<listcell label="sdfxycvvpvamed8" />
<listcell label="sdfxycveinbdatumd9" />
<listcell label="sdfxycvbeletumd10" />
<listcell label="sdfxycvbelertd11" />
<listcell label="sdfxycvsaarbd12" />
<listcell label="sdfxycvanlrnmed13" />
<listcell label="sdfxycvaervormed14" />
<listcell label="sdfxycehlerplzd15" />
<listcell label="sdfxycvchtungd16" />
<listcell label="sdfxycvatramed17" />
<listcell label="sdfxycvbeaterornaed18" />
<listcell label="sdfxycvktchtend19" />
<listcell label="sdfxycvrecbrstelled20" />
<listcell label="sdfxycvrechbetrd21" />
<listcell label="sdfxycvrechnunrngd22" />
<listcell label="sdfxycvrechnzgrundd23" />
<listcell label="sdfxycvrechnngizzgd24" />
<listcell label="sdfxycntrgrudd25" />
<listcell label="sdfxycgfud26" />
<listcell label="sdfxycvnraostend27" />
<listcell label="sdfxycagteietragd28" />
<listcell label="sdfxycvarusaged29" />
<listcell label="sdfxycvaagehnunggrdd30" />
</listitem>
</listbox>
<paging id="paging" detailed="true" autohide="true"></paging>
</window>
help, please!
The Answer is to set the width in % (not fix in px) and the listbox above fix in px.
<window id="dataWindow" title="Suchergebnisse" contentstyle="overflow:auto"> <listbox id="dataListbox" mold="paging" width="2000px"> <listhead> <listheader label="abc1" **width="2%" **=""/> <listheader label="aasdfbc2" width="3%"/> <listheader label="abyxcvyc3" width="5%"/> <listheader label="abwerc4" width="2%"/> <listheader label="ayxcvybc5" width="1%"/> <listheader label="abxycv ewadfc6" width="3%"/> <listheader label="abc7" width="4%"/> <listheader label="abc8" width="3%"/> .....
Hello,
Instead of width
properity Try giving hflex="min"
for listheader
. So that it takes the minimum width required as per the label of that Header.
Also try hflex="1" or 2..."
based on the content under that header.
If you think the content will be big, give bigger number like hflex="2" or 3
and hflex="1"
for other.
Refer this Document.. to have an idea how hflex and vflex works.
Greetings..
M Varun.
Asked: 2014-02-27 20:23:01 +0800
Seen: 41 times
Last updated: Mar 06 '14