4 Replies Latest reply on Aug 8, 2006 1:03 PM by <tfe:Joost>

    Custom item renderer and view states

    <tfe:Joost>
      I'm having this custom itemrender (which is an AS-class, not a MXML). When a user clicks on an item the view state should switch to 'selected'. The selectedstate adds an Text tag. But for some reason the text box does not show up. When I add an effect to the selected state, the effect shows up after clicking. So the state change works, but why is the text box not visible?

      The code:
      <albums:AlbumBrowser
      id="albumBrowser"
      width="600"
      dataProvider="{Model.instance.album.aPhotoAlbumsOnPage}" >

      <albums:itemRenderer>
      <mx:Component id="albumRenderer">
      <albums:AlbumRenderer
      buttonMode="true"> (which is an AS-class that extends UIComponent and implements IDataRenderer)

      <albums:states>
      <mx:State name="selectedState">
      <mx:AddChild>
      <mx:Text text="This a test"/>
      </mx:AddChild>
      </mx:State>
      </albums:states>

      </albums:AlbumRenderer>
      </mx:Component>
      </albums:itemRenderer>

      </albums:AlbumBrowser>

      Anyone? Thanks.
        • 1. Re: Custom item renderer and view states
          peterent Level 2
          I took the essence of your code and tried a few things. I actually did not get this work (yet). I have created an itemRenderer that uses states, but I based mine on Canvas, not UIComponent. What I'm thinking is that UIComponent doesn't know how to handle the AddChild directive. Even though UIComponent has states it doesn't mean that it actually can implement the code; it may be there just so all components have the potential for states and that all it does is hold the state definitions but cannot actually execute them. I hope that makes sense.

          Try doing the following:

          1. Make your itemRenderer have a width and height of 100% each. It may be that the component has the default size of 0x0.
          2. Base your component on Canvas, not UIComponent, just to see if that makes any difference.
          • 2. Re: Custom item renderer and view states
            <tfe:Joost> Level 1
            Just before your post I discovered the problem: the lack of a width and height property. I expected that the component would adjust its size and height to the width and height of the provided text.

            I can't find the location again, but somewhere in the documention a textbox is added to a state without a width and height property. So that sample should not work I guess.
            • 3. Re: Custom item renderer and view states
              peterent Level 2
              The Text control has a default size (100x21 I think) and it grows vertically automatically as it needs to hold all of the text. Label, on the other hand will grow horizontally.

              UIComponent's default size if 0x0, but its children do not affect its size. The measure function in UIComponent does not ask its children how big they are whereas a Container component will do that. Containers such as HBox and VBox will grow to fit their children; Canvas just clips them.

              For your example you do need to specify the size.
              • 4. Re: Custom item renderer and view states
                <tfe:Joost> Level 1
                True, the surrounding AlbumBrowser extends UIComponent.