Skip to main content
A
Anonymous
May 31, 2012
Answered

List width not going to 100% - going crazy

  • May 31, 2012
  • 1 reply
  • 1330 views

I'm using Flex 4.6 and am working in making some simple lists.  Each row is only expanding as far as the data within it - that is, the background and separator bars only go as wide as the data within the individual rows.  I haven't really applied styling to it yet but I have started a component strucutre.  I'm going crazy with this - any advice would be MUCH appreciated.  I know I'm must be missing something obvious but I can no longer see the forest/trees/etc.  Here's what I have.

In my HomeView I call the list (shown in bold below).  I'm showing the parent containers all the way up to just under the main View in case it helps.  I am not showing all closing tags - you get the picture:

<!-- scroller -->

<s:Scroller width="100%" height="100%"      

                    horizontalScrollPolicy="off">

<!-- required b/c the scroller can only handle one component -->

        <s:Group width="100%" height="100%" >

            <s:layout >

                <s:VerticalLayout gap="0" />

            </s:layout>

            <!-- events -->

            <components:BBWHeaderSubComp label="Today's Calendar Events"/>

            <components:BBWListComp width="100%"

                                    labelField="subject"

                                    itemRenderer="views.renderer.CalendarEventRenderer"

                                    dataProvider="{journal}"/>

Which, as you can see, is a component.  Here's the entire component:

<?xml version="1.0" encoding="utf-8"?>

<s:List xmlns:fx="http://ns.adobe.com/mxml/2009"

        xmlns:s="library://ns.adobe.com/flex/spark"

        left="0" right="0"

        top="0" bottom="0"   

        width="100%"

        verticalScrollPolicy="off" horizontalScrollPolicy="off" >

    <s:layout>

        <s:VerticalLayout gap="0" requestedMinRowCount="1" />

    </s:layout>

    <fx:Declarations>

    </fx:Declarations>

</s:List>

Thanks for helping. 

This topic has been closed for replies.
Correct answer Phil Flash

Try:

<s:layout>

    <s:VerticalLayout gap="0" horizontalAlign="justify" requestedMinRowCount="1" />

</s:layout>

Philippe

1 reply

P
Phil Flash
Inspiring
June 1, 2012

Hi,

Try this:

<s:VGroup width="100%" height="100%">

    <components:BBWHeaderSubComp label="Today's Calendar Events"/>

    <s:List id="list"  dataProvider="{journal}"  width="100%" height="100%"

          labelField="subject"

          itemRenderer="views.renderer.CalendarEventRenderer"

         />

</s:VGroup>

IMHO, scroller is not neccessary.

If you want to use  your BBWListComp, try :

<?xml version="1.0" encoding="utf-8"?>

<s:List xmlns:fx="http://ns.adobe.com/mxml/2009"

        xmlns:s="library://ns.adobe.com/flex/spark"

          width="100%" height="100%">

...

</s:List>

If you use a layout in a List (VerticalLayout is by default and is not required), you must add width="100%" in your itemRenderer.

Philippe

A
Anonymous
June 1, 2012

Thanks.  I was using the scroller b/c I have three header/lists on top of each other for the single view.  I was also using the layout b/c I need the minimum row count to be one and I want the gap gone.  But you got me thinking that one of these could be messing things up. 

I've found what's causing the issue (it's the layout),  but don't know how to solve it.  Making my example even more simplistic, I've re-written it as follows:

<s:List width="100%"

            labelField="subject"

            dataProvider="{journal}">

       

        <s:layout>

            <s:VerticalLayout gap="0" requestedMinRowCount="1" />

        </s:layout>

</s:List>

With the layout defined in the list the rows no longer go to 100%.  If I remove the layout tags then everything looks fine, but then I have tha gap and requestedMinRowCount issue not solved.  Can I do the gap and row count another way?  What am I missing here?

Thanks again for any help!

P
Phil FlashCorrect answer
Inspiring
June 1, 2012

Try:

<s:layout>

    <s:VerticalLayout gap="0" horizontalAlign="justify" requestedMinRowCount="1" />

</s:layout>

Philippe

Terms & ConditionsAccessibility statement
Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices