Korzystanie ze składnika DataGrid

Użycie lokalnego dostawcy danych ze składnikiem DataGrid:

W tym przykładzie składnik DataGrid tworzony jest w celu wyświetlenia wykazu zawodników drużyny softball. Wykaz zdefiniowany został w obiekcie Array ( aRoster ) i przypisany do właściwości dataProvider składnika DataGrid.

1. W programie Flash wybierz opcje Plik > Nowy, a następnie wybierz plik Flash (ActionScript 3.0).

2. Przeciągnij składnik DataGrid z panelu Składniki na stół montażowy.

3. W Inspektorze właściwości wprowadź dla instancji nazwę aDg .

4. Otwórz panel Operacje, zaznacz klatkę nr 1 na głównej osi czasu i wprowadź następujący kod 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); 
   };

   Funkcja bldRosterGrid() ustawia wielkość składnika DataGrid i ustawia kolejność kolumn oraz ich wielkości.

5. Wybierz polecenie Sterowanie > Testuj film.

Wybierz kolumny i dodaj sortowanie dla składnika DataGrid w aplikacji

Nagłówek każdej kolumny można kliknąć w celu posortowania treści składnika DataGrid w porządku malejącym wg wartości w wybranej kolumnie.

W poniższym przykładzie wykorzystano metodę addColumn() do dodawania instancji klasy DataGridColumn do składnika DataGrid. Kolumny reprezentują nazwy odtwarzaczy oraz wyniki. W tym przykładzie przedstawiono również wybór właściwości sortOptions w celu określenia opcji sortowania dla każdej kolumny: Array.CASEINSENSITIVE dla kolumny Name i Array.NUMERIC dla kolumny Score. W przykładzie wielkość składnika DataGrid jest odpowiednia, ponieważ jego długość została ustawiona jako liczba wierszy, a szerokość na 200.

1. W programie Flash wybierz opcje Plik > Nowy, a następnie wybierz plik Flash (ActionScript 3.0).

2. Przeciągnij składnik DataGrid z panelu Składniki na stół montażowy.

3. W Inspektorze właściwości wprowadź dla instancji nazwę aDg .

4. Otwórz panel Operacje, zaznacz klatkę nr 1 na głównej osi czasu i wprowadź następujący kod 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. Wybierz polecenie Sterowanie > Testuj film.

Tworzenie instancji składnika DataGrid przy użyciu kodu ActionScript

W tym przykładzie przedstawiono tworzenie składnika DataGrid w języku ActionScript oraz wypełnianie go tablicą nazw odtwarzaczy i wartości score.

1. Utwórz nowy dokument Flash (ActionScript 3.0).

2. Przeciągnij składnik DataGrid z panelu Składniki do panelu Biblioteka bieżącego dokumentu.

   Powoduje to dodanie składnika do biblioteki, ale nie jest on wyświetlany w aplikacji.

3. Otwórz panel Operacje, zaznacz klatkę nr 1 na głównej osi czasu i wprowadź następujący kod 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);

   Ten kod tworzy instancję DataGrid, a następnie określa wielkość i położenie siatki.

4. Utwórz tablicę, dodaj do niej dane i określ tablicę jako dostawcę danych dla składnika 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. Wybierz polecenie Sterowanie > Testuj film.

Ładowanie składnika DataGrid za pomocą pliku XML

W poniższym przykładzie przedstawiono korzystanie z klasy DataGridColumn w celu utworzenia kolumn DataGrid. W przykładzie składnik DataGrid jest wypełniany poprzez wprowadzanie obiektu XML jako parametru value konstruktora DataProvider() .

1. Korzystając z edytora tekstu, utwórz plik XML zawierający następujące dane i zapisz go pod nazwą team.xml w tym samym folderze, w którym zapisany zostanie plik 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. Utwórz nowy dokument Flash (ActionScript 3.0).

3. Na panelu Składniki kliknij dwukrotnie składnik DataGrid, aby dodać go do stołu montażowego.

4. W Inspektorze właściwości wprowadź dla instancji nazwę aDg .

5. Otwórz panel Operacje, zaznacz klatkę nr 1 na głównej osi czasu i wprowadź następujący kod 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. Wybierz polecenie Sterowanie > Testuj film.