Table Layout - partea 1

Obiective

Scopul acestui tutorial este de a exemplifica modul de functionare si utilitatea layout managerului TableLayout. Acest tutorial presupune cunostinte medii despre limbajul Java si despre modul de construire a interfetelor grafice folosind Swing. In cadrul sau vor fi abordate doar elementele necesare explicarii modului de utilizare a TableLyout.

1. Ce este TableLayout?

TableLayout este un layout manager care partitioneaza un container intr-o serie de randuri si de coloane. Intersesctia dintre un rand si o coloana formeaza o celula. Componentele adaugate containerului sunt plasate in celule. In cazul in care containerul este redimensionat atunci si celulele din acel container vor fi redimensionate, prin urmare si componetele continute de aceste celule fiind redimensionate. 

Luam spre exemplificare un simplu element de tip JFrame impartit in patru coloane si cinci randuri. Acesta este vizibil in figura alaturata. Observati ca nu toate randurile au aceeasi inaltime. Fiecare rand poate avea propria sa inaltime. De asemenea fiecare coloana poate avea aceeasi lungime. Pe masura ce containerul este redimensionat, fiecare rand si coloana este de asemenea redimensionata corespunzator specificatiilor date. 

Pe parcursul acestui tutorial orice lucru care este precizat pentru randuri este aplicabil si pentru coloane si vice versa. De exemplu, orice spunem despre inaltimea unui rand, este valabil si despre lungimea unei coloane. TableLayout este simetric ca proprietati atat pentru axa OX cat si pentru axa OY.

Randurile si coloanele sunt numerotate in cadrul ilustratiei. Observati ca indexarea coloanelor incepe de la 0. Notarea celulelor se face conform modelului (coloana, rand). Celula din stanga sus are coordonatele (0,0) si cea din dreapta jos are coordonatele (3,4). Liniile care despart randurile si celulele sunt doar la nivel logic, acestea neaparand efectiv in interfata grafica.

2. Crearea unui TableLayout

Figura de mai sus prezinta impartirea containerului la o dimensiunea data. Ce se intampla cu acest container atunci cand se face resize asupra lui. Asta depinde de tipul pe care l-am precizat pentru randuri si pentru coloane. Poate fi posibil ca toate coloanele sa aiba aceeasi lungime tot timpul sau de asemenea este posibil ca primele trei coloane sa fie de o lungime fixa iar cea de patra sa ocupe restul spatiului.

Sunt cinci moduri in care se poate specifica lungimea unei coloane. Aceasta poate avea o valoare fixa in pixeli, un procent din spatiul total, o portiune egala cu spatiul care ramane disponibil, o lungime determinata de atributul „preferred size” al componentelor care se afla in cadrul coloanei, sau o lungime determinata de atributul „minimum size” al componentelor care se alfa in cadrul coloanei. 

Pentru exemplul din figura de mai sus, sa presupunem ca vrem ca toate coloanele sa aiba o lungime egala. De asemenea toate randurile vor avea o inaltime fixa mai putin randul cu indexul 1 care va ocupa spatiul care va ramane disponibil. Urmatorul cod va realiza acest acest lucru:

public static void createFrame ()

    {

        Frame frame = new Frame();

        frame.setBounds (100, 100, 300, 300);

        frame.show();

        double size[][] =

            {{0.25, 0.25, 0.25, 0.25},

             {50, TableLayout.FILL, 40, 40, 40}};

        frame.setLayout (new TableLayout(size));

    }

Pentru crearea unui TableLayout sunt necesari doi pasi:

- primul pas : se creaza un array bidimensional de primitive de tip double, care va fi utilizat pentru a specifica lungimea coloanelor si inaltimea randurilor. 

- pasul doi: un nou obiect de tip TableLayout este creat utilizand array-ul creat la primul pas.

Lungimile coloanelor sunt specificate la 25% sau 0.25. Toate numerele reale, aflate in intervalul [0.0 si 1.0) sunt tratate ca fiind procente. Observati ca acest interval nu cuprinde si valoarea 1. Aceasta valoare nu inseamna 100% ci 1 pixel. 

Primului rand, cel cu indexul 0, ii sunt alocati exact 50 pixeli. Toate numerele intregi, mai mari decat zero sunt interpretate ca fiind valori in pixeli. Randului 1 ii este asociata constanta FILL, ceea ce inseamna ca acesta va ocupa restul spatiului disponibil. Am precizat mai sus ca procentual nu putem asocia unui element valoarea 100%, deoarece daca vom introduce valoarea 1 aceasta va fi interpretata drept 1 pixel. Folosind aceasta constanta FILL putem asocia unui element proportia de 100%.

3. Adaugarea Componetelor

Din momentul in care s-a construit layoutul pentru un anumit container componetele pot fi adaugate fie unei singure celule fie unui set rectangular de celule. Clasa Container contine o metoda de adaugare, semnatura acesteia fiind fiind urmatoare : 

public void add(Component comp, Object constraints) 

Atunci cand se utilizeaza un TableLayout parametrul constraints este un obiect de tip String care specifica celula, sau celule pe care respectiva componenta le va adauga. 

Pastrand exemplu creat anterior, pentru a aduga o componeta in celula (2,1) vom folosi urmatoare sintaxa: 

frame.add (component, "2, 1");

O componenta definita in acel mod, va ocupa intreaga celula. Pe masura ce aceasta celula isi va mari sau micsora dimensiunile, si componenta va face acelasi lucru, cele doua avand tot timpul exact aceeasi dimensiune.