2 Replies Latest reply on Apr 8, 2010 10:49 AM by ben_marker

    Panel styling missing in TileList itemRenderer

    ben_marker

      I have created tile list with an inline  ItemRendered component with a Panel component inside to display results.   The panel styling disappears for some reason in a TileList, but not in  a DataGrid.  How do I force the panel styling to stick, or remove  whatever parent style that's forcing the Panel component to lose its  borders, drop shadows etc.  I looked at the styling, but can't figure  out where the conflict is... Code below if you want to test (both  DataGrid and TileList, XML just beneath):

       

      <?xml version="1.0" encoding="utf-8"?>
      <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" xmlns:net="flash.net.*" creationComplete="getPortData.send()">
      <mx:HTTPService id="getPortData" url="port.xml" />
           <mx:DataGrid dataProvider="{getPortData.lastResult.portfolio.project}" width="100%" height="250" variableRowHeight="true" >
                <mx:columns>
                     <mx:DataGridColumn>
                          <mx:itemRenderer>
                               <mx:Component>
                                    <mx:Panel title="{data.title}">
                                         <mx:VBox>
                                              <mx:Image source="images/port_thumbnails/{data.thumbimage}" height="100"/>
                                              <mx:Label text="{data.title}" />               
                                         </mx:VBox>
                                    </mx:Panel>
                               </mx:Component>
                          </mx:itemRenderer>
                     </mx:DataGridColumn>
                     <mx:DataGridColumn dataField="thumbimage" />
                     <mx:DataGridColumn headerText="Column 1" dataField="title"/>
                </mx:columns>
           </mx:DataGrid>     
           <mx:TileList dataProvider="{getPortData.lastResult.portfolio.project}" width="100%" variableRowHeight="true" columnWidth="300" >
                <mx:itemRenderer>
                               <mx:Component>
                                    <mx:Panel title="{data.title}">
                                         <mx:VBox>
                                              <mx:Image source="images/port_thumbnails/{data.thumbimage}" height="100"/>
                                              <mx:Label text="{data.title}" />               
                                         </mx:VBox>
                                    </mx:Panel>
                               </mx:Component>
                </mx:itemRenderer>
           </mx:TileList>
      </mx:Application>


      XML:

      <?xml version="1.0" ?>
      - <portfolio>
      - <project>
        <thumbimage>bigsky_thumb.jpg</thumbimage>
        <bigimage>big_sky.jpg</bigimage>
        <title>Project 1 title</title>
        </project>
      - <project>
        <thumbimage>conrad_thumb.jpg</thumbimage>
        <bigimage>conrad_klein.jpg</bigimage>
        <title>Project 2 title</title>
        </project>
      - <project>
        <thumbimage>fire_thumb.jpg</thumbimage>
        <bigimage>fire_central.jpg</bigimage>
        <title>Project 3 title</title>
        </project>
      - <project>
        <thumbimage>learncen_thumb.jpg</thumbimage>
        <bigimage>learn_central.jpg</bigimage>
        <title>Project 4 title</title>
        </project>
      - <project>
        <thumbimage>molton_thumb.jpg</thumbimage>
        <bigimage>molton_flooring.jpg</bigimage>
        <title>Project 5 title</title>
        </project>
      - <project>
        <thumbimage>nusash_thumb.jpg</thumbimage>
        <bigimage>nusash.jpg</bigimage>
        <title>Project 6 title</title>
        </project>
      - <project>
        <thumbimage>pleasure_thumb.jpg</thumbimage>
        <bigimage>pleasure_dishes.jpg</bigimage>
        <title>Project 7 title</title>
        </project>
      - <project>
        <thumbimage>tarheel_thumb.jpg</thumbimage>
        <bigimage>tarheel_form.jpg</bigimage>
        <title>Project 8 title</title>
        </project>
      - <project>
        <thumbimage>ward_thumb.jpg</thumbimage>
        <bigimage>ward_andrews.jpg</bigimage>
        <title>Project 9 title</title>
        </project>
        </portfolio>