Uso do componente DataGrid

Use um provedor de dados local com um componente DataGrid:

Este exemplo cria a DataGrid para exibir a lista de uma equipe de beisebol. Ele define a lista em uma matriz ( aRoster ) e a atribui à propriedade dataProvider da DataGrid.

1. No Flash, selecione Arquivo > Novo e selecione Arquivo Flash (ActionScript 3.0).

2. Arraste o componente DataGrid do painel Componentes para o Palco.

3. No Inspetor de propriedades, digite o nome de ocorrência aDg .

4. Abra o painel Ações, selecione Quadro 1 na Linha do tempo principal e digite o seguinte código do ActionScript:

   import fl.data.DataProvider; 
    
   bldRosterGrid(aDg); 
   var aRoster:Array = new Array(); 
   aRoster = [ 
           {Name:"Wilma Carter", Bats:"R", Throws:"R", Year:"So", Home: "Redlands, CA"},  
           {Name:"Sue Pennypacker", Bats:"L", Throws:"R", Year:"Fr", Home: "Athens, GA"}, 
           {Name:"Jill Smithfield", Bats:"R", Throws:"L", Year:"Sr", Home: "Spokane, WA"}, 
           {Name:"Shirley Goth", Bats:"R", Throws:"R", Year:"Sr", Home: "Carson, NV"}, 
           {Name:"Jennifer Dunbar", Bats:"R", Throws:"R", Year:"Fr", Home: "Seaside, CA"}, 
           {Name:"Patty Crawford", Bats:"L", Throws:"L", Year:"Jr", Home: "Whittier, CA"}, 
           {Name:"Angelina Davis", Bats:"R", Throws:"R", Year:"So", Home: "Odessa, TX"}, 
           {Name:"Maria Santiago", Bats:"L", Throws:"L", Year:"Sr", Home: "Tacoma, WA"}, 
           {Name:"Debbie Ferguson", Bats:"R", Throws:"R", Year: "Jr", Home: "Bend, OR"}, 
           {Name:"Karen Bronson", Bats:"R", Throws:"R", Year: "Sr", Home: "Billings, MO"}, 
           {Name:"Sylvia Munson", Bats:"R", Throws:"R", Year: "Jr", Home: "Pasadena, CA"}, 
           {Name:"Carla Gomez", Bats:"R", Throws:"L", Year: "Sr", Home: "Corona, CA"}, 
           {Name:"Betty Kay", Bats:"R", Throws:"R", Year: "Fr", Home: "Palo Alto, CA"}, 
   ]; 
   aDg.dataProvider = new DataProvider(aRoster); 
   aDg.rowCount = aDg.length; 
    
   function bldRosterGrid(dg:DataGrid){ 
       dg.setSize(400, 300); 
       dg.columns = ["Name", "Bats", "Throws", "Year", "Home"]; 
       dg.columns[0].width = 120; 
       dg.columns[1].width = 50; 
       dg.columns[2].width = 50; 
       dg.columns[3].width = 40; 
       dg.columns[4].width = 120; 
       dg.move(50,50); 
   };

   A função bldRosterGrid() define o tamanho da DataGrid e define a ordem das colunas e seus respectivos tamanhos.

5. Selecione Controlar > Testar filme.

Especificação de colunas e adição de classificação para um componente DataGrid em um aplicativo

Observe que você pode clicar em qualquer cabeçalho de coluna para classificar o conteúdo da DataGrid em ordem decrescente pelos valores dessa coluna.

O exemplo a seguir usa o método addColumn() para adicionar instâncias de DataGridColumn a DataGrid. As colunas representam nomes de jogador e suas pontuações. O exemplo também define a propriedade sortOptions para especificar as opções de classificação de cada coluna: Array.CASEINSENSITIVE para a coluna Nome e Array.NUMERIC para a coluna Pontuação. Ele dimensiona a DataGrid corretamente definindo o tamanho para o número de linhas e a largura para 200.

1. No Flash, selecione Arquivo > Novo e selecione Arquivo Flash (ActionScript 3.0).

2. Arraste o componente DataGrid do painel Componentes para o Palco.

3. No Inspetor de propriedades, digite o nome de ocorrência aDg .

4. Abra o painel Ações, selecione Quadro 1 na Linha do tempo principal e digite o seguinte código do ActionScript:

   import fl.controls.dataGridClasses.DataGridColumn; 
   import fl.events.DataGridEvent; 
   import fl.data.DataProvider; 
   // Create columns to enable sorting of data. 
   var nameDGC:DataGridColumn = new DataGridColumn("name"); 
   nameDGC.sortOptions = Array.CASEINSENSITIVE; 
   var scoreDGC:DataGridColumn = new DataGridColumn("score"); 
   scoreDGC.sortOptions = Array.NUMERIC; 
   aDg.addColumn(nameDGC); 
   aDg.addColumn(scoreDGC); 
   var aDP_array:Array = new Array({name:"clark", score:3135}, {name:"Bruce", score:403}, {name:"Peter", score:25}) 
   aDg.dataProvider = new DataProvider(aDP_array); 
   aDg.rowCount = aDg.length; 
   aDg.width = 200;

5. Selecione Controlar > Testar filme.

Criar uma ocorrência de componente DataGrid usando o ActionScript

Este exemplo cria uma DataGrid usando o ActionScript e a preenche com uma matriz de nomes de jogador e pontuações.

1. Crie um novo documento Flash (ActionScript 3.0).

2. Arraste o componente DataGrid do painel Componentes para o painel Biblioteca do documento atual.

   Esse procedimento adicionará o componente à biblioteca, mas ele não ficará visível no aplicativo.

3. Abra o painel Ações, selecione Quadro 1 na Linha do tempo principal e digite o seguinte código do ActionScript:

   import fl.controls.DataGrid; 
   import fl.data.DataProvider; 
    
   var aDg:DataGrid = new DataGrid(); 
   addChild(aDg); 
   aDg.columns = [ "Name", "Score" ]; 
   aDg.setSize(140, 100); 
   aDg.move(10, 40);

   Esse código cria a ocorrência de DataGrid e, em seguida, dimensiona e posiciona a grade.

4. Crie uma matriz, adicione dados a ela e identifique a matriz como provedor de dados da DataGrid:

   var aDP_array:Array = new Array(); 
   aDP_array.push({Name:"Clark", Score:3135}); 
   aDP_array.push({Name:"Bruce", Score:403}); 
   aDP_array.push({Name:"Peter", Score:25}); 
   aDg.dataProvider = new DataProvider(aDP_array); 
   aDg.rowCount = aDg.length;

5. Selecione Controlar > Testar filme.

Carregar uma DataGrid com um arquivo XML

O exemplo a seguir usa a classe DataGridColumn para criar as colunas da DataGrid. Ele preenche a DataGrid passando um objeto XML como parâmetro value do construtor DataProvider() .

1. Utilize um editor de texto para criar um arquivo XML com os dados a seguir e salve-o com o nome e team.xml na mesma pasta onde você salvou o arquivo FLA.

   <team> 
       <player name="Player A" avg="0.293" /> 
       <player name="Player B" avg="0.214" /> 
       <player name="Player C" avg="0.317" /> 
   </team>

2. Crie um novo documento Flash (ActionScript 3.0).

3. No painel Componentes, clique duas vezes no componente DataGrid para adicioná-lo ao Palco.

4. No Inspetor de propriedades, digite o nome de ocorrência aDg .

5. Abra o painel Ações, selecione Quadro 1 na Linha do tempo principal e digite o seguinte código do ActionScript:

   import fl.controls.dataGridClasses.DataGridColumn; 
   import fl.data.DataProvider; 
   import flash.net.*; 
   import flash.events.*; 
    
   var request:URLRequest = new URLRequest("team.xml"); 
   var loader:URLLoader = new URLLoader; 
    
    
   loader.load(request); 
   loader.addEventListener(Event.COMPLETE, loaderCompleteHandler); 
    
   function loaderCompleteHandler(event:Event):void { 
    
       var teamXML:XML = new XML(loader.data); 
    
       var nameCol:DataGridColumn = new DataGridColumn("name"); 
       nameCol.headerText = "Name"; 
       nameCol.width = 120; 
       var avgCol:DataGridColumn = new DataGridColumn("avg"); 
       avgCol.headerText = "Average"; 
       avgCol.width = 60; 
        
       var myDP:DataProvider = new DataProvider(teamXML); 
        
       aDg.columns = [nameCol, avgCol]; 
       aDg.width = 200; 
       aDg.dataProvider = myDP; 
       aDg.rowCount = aDg.length; 
   }

6. Selecione Controlar > Testar filme.