2 Replies Latest reply on Oct 14, 2008 5:02 PM by Newsgroup_User

    table-like behavior in flash

    gigasaurus
      I have an app I've built for a client that displays a bunch of dynamic data in a table-like grid. This is currently a "top 10" that shows details of the top-10 winners of a contest. The client has now said that under certain circumstances this "top 10" display grid will now need to display a table of dynamic data of undetermined height (That is it could be a "top 30" or a "top 100"). So firstly I imagine the data will need to be embedded in a scrollable movie-clip that adjusts its height based on the amount of data there is. I was disappointed to learn flash html does not support tables. I've seen reference to some components available, but they all seem sort of like a big jump for something the client sees as a minor change to the application. Could someone please help me determine what is the easiest route for me to take?
        • 1. Re: table-like behavior in flash
          kglad Adobe Community Professional & MVP
          tell your client flash cannot display a html table. so, it's no small change to display a table.

          that said, you may be able to use the list component to display the data and if no grid is needed, you can use a dynamic textfield with tabs to display the data.
          • 2. Re: table-like behavior in flash
            Level 7
            Why not just use a DataGrid component? They're pretty easy to use actually.

            Try this: start a new AS2 project and drag a DataGrid from the components
            panel onto the stage. Use the properties panel to size it to 500 x 300. When
            you add data to a grid it will just show a scroll bar if necessary, it
            doesn't resize... Give it an instance name of "theGrid".

            Now, add the following script to the frame:

            import mx.controls.gridclasses.DataGridColumn;

            function doGrid(gridRef, gArray:Array)
            {
            for (var i = 0; i < gArray.length; i++) {
            var cat:DataGridColumn = new DataGridColumn(gArray [0]);
            cat.width = gArray
            [2];
            cat.headerText = gArray [1];
            cat.editable = false;
            gridRef.addColumn(cat);
            }
            }

            var gFormat = new Array(["fname", "First Name:", 120], ["lname", "Last
            Name:", 200], ["date", "Win Date:", 80]);

            doGrid(theGrid, gFormat);

            If you compile now, you'll see the grid with the field titles... I use the
            doGrid function, and an array like this to make formatting the grid easy.
            The first item in the array matches the dataProvider property, as you will
            see in a moment - the second is the title, and the third the width of the
            column... change these as you need.

            To add data, you just create an array of objects, with the object properties
            matching the first item in the format array - like so - add the following
            and test again:

            var gridData = new Array({fname:"Dave", lname:"Mennenoh", date:"09/14/08"},
            {fname:"giga", lname:"saurus", date:"10/14/08"});

            theGrid.dataProvider = gridData;


            That's all there is to it... If you add more data than can be shown, you'll
            get a scroll bar. You can add en event listener to know when someone selects
            an item, etc...

            good luck



            --
            Dave -
            www.offroadfire.com
            Head Developer
            http://www.blurredistinction.com
            Adobe Community Expert
            http://www.adobe.com/communities/experts/