In acest tutorial este prezentat un script ActionScript 3 prin care sunt afisate intr-o prezentare Flash data si ora. Pe scurt, un ceas facut in Flash.
Prezentarea si explicatiile sunt indreptate mai mult spre partea de cod din script, grafica ceasului avand un design cat mai simplu, putand fi creata de fiecare dupa preferinte, cu instrumentele din Scena documentului Flash. Important este scriptul, care o data inteles, poate fi aplicat oricarui desen grafic ce reprezinta forma ceasului.

1. Deschideti un document Flash nou, ActionScript 3.0 si creati in scena un desen pentru ceas. Sa aibe 2 zone distincte, una in care va fi afisata data zilei si alta pentru ora, dupa cum se vede in imaginea urmatoare.
Design ceas
  - In zona alba, de sus, va fi afisata data zilei, iar in ovalul galben e adaugata ora.
2. Cu istrumentul "Text Tool" trasati un camp text peste dreptunghiul alb, cu dimensiunile apropiate de acesta (dupa cum se observa in imaginea de jos. Dati acestui camp-text numele de instanta dat_v (in panoul Properties al campului, in caseta de sus unde e scris <Instance Name>) si lasati-l gol.
- Acest camp va fi folosit in ActionScript ca obiect in care se scrie textul cu data.
Ceas - camp text
Trasati si peste ovalul galben un alt camp de text, ca dimensiuni incadrate in oval, si dati-i numele de instanta ora_v. Lasati-l si pe acesta gol. Acest camp va fi folosit in ActionScript ca obiect in care se scrie textul cu ora.
- In imaginea urmatoare se vad cele doua campuri text, cu linie punctata.
Ceas - campuri data si ora
3. Click-dreapta pe primul Cadru din Timeline si alegeti optiunea Actions, iar in panoul care se deschide, pentru scriere cod ActionScript, adaugati urmatorul cod:
// Creaza Array cu zilele saptamanii si lunile anului in romana
var ar_zile:Array = new Array("Duminica", "Luni", "Marti", "Miercuri", "Joi", "Vineri", "Sambata");
var ar_luni:Array = new Array("Ianuarie", "Februarie", "Martie", "Aprilie", "Mai", "Iunie", "Iulie", "August", "Septembrie", "Octombrie", "Noiembrie", "Decemberie");

// Functia care defineste si afiseaza datele
function ceas():void {
  // Creare instanta obiect Date (unde sunt stocate data si ora)
  var acum:Date = new Date();

  // Definire variabile pt. preluarea datelor necesare din "acum"
  var anul:int = acum.getFullYear();            // Obtine Anul
  var luna:int = acum.getMonth();               // Nr. luna din an
  var zi_luna:* =acum.getDate();                // Nr. zi din luna
  var zi_sap:int = acum.getDay();               // Nr. zi din saptamana
  var ora:int = acum.getHours();                // Preia ora
  var minute:* = acum.getMinutes();             // Minutele
  var secunde:* = acum.getSeconds();            // Secundele

  // Ajustare format pt. valori mai mici decat 10 (sa fie afisate cu 2 caractere
  if(zi_luna<10) zi_luna = '0'+ zi_luna;       // Adauga 0 pt. nr. zi_luna<10
  if(minute<10) minute = '0'+ minute;          // Adauga 0 pt. minute<10
  if(secunde<10) secunde = '0'+ secunde;       // Adauga 0 pt. secunde<10

  // Definire text care va fi afisat in campul-text "dat_v" (cu data zilei)
  dat_v.text = ar_zile[zi_sap]+ ', '+ zi_luna+ ' '+ ar_luni[luna]+ ' '+ anul;

  // Definire text care va fi afisat in campul-text "ora_v" (cu ora curenta)
  ora_v.text = 'Ora: '+ ora+ ':'+ minute+ ':'+ secunde;
}

ceas();           // Apeleaza functia pt. afisare date in ceas

// Apeleaza functia "ceas()" la fiecare secunda (1000 milisecunde)
setInterval(ceas, 1000);
4. Apasati Ctrl+Enter ca sa vedeti rezultatul. Va apare o prezentare Flash precum aceasta:
- In Scena, cele 2 campuri text "dat_v" si "ora_v" sunt esentiale pentru afisarea datei si orei in ceas.
- Pe partea de ActionScript sunt doua elemente importante: obiectul Date, prin care sunt obtinute datele pentru ora si data curenta (despre lucrul cu obiectul Date, proprietatile si functiile lui, vedeti lectia Data si Timp - Obiect Date) si functia "setInterval()", care apeleaza continuu, la interval de 1 secunda (1000 milisecunde), functia "ceas()", prin care sunt definite si adaugate in campurile text din Scena data si ora. Explicatii mai detaliate sunt in codul scriptului
• Fisierul FLA cu acest exemplu poate fi descarcat de la: Tutorial creare ceas.

Pentru a adauga acest ceas intr-o pagina web, trebuie sa creati fisierul SWF, care poate fi inclus in documente HTML. Fisierul SWF se obtine prin Export, din meniul File -> Export -> Export Movie.


Un Test simplu in fiecare zi

HTML
CSS
JavaScript
PHP-MySQL
Engleza
Spaniola
Ce atribut e folosit in tag-ul <img> pentru adresa imaginii?
href src rel
<img src="http://coursesweb.net/imgs/webcourses.gif" width="191" height="63" alt="Courses-Web" />
Care din aceste coduri CSS ascunde elementul in pagina?
display: none; display: inline; position: relative;
#id {
  display: none;
}
Ce instructiune opreste executia lui while() sau for() ?
continue prompt() break
for(var i = 0; i< 8; i++) {
  if(i > 1) break;
  alert(i);
}
Indicati functia utilizata pentru a crea constante.
define() include() defined()
define("CONSTANT_NAME", "value");
echo CONSTANT_NAME;
Care este forma de plural a substativului "class" (clasa)?
classes clases clasis
This school has three classes.
- Scoala asta are trei clase.
Care este pluralul substativului "voz" (voce)?
vose voze voces
Escuché dos voces.
- Am auzit doua voci.
Creare ceas cu data si ora

Last accessed pages

  1. Creare tabele HTML (8881)
  2. Curs si Tutoriale Ajax (30210)
  3. Curs HTML gratuit Tutoriale HTML5 (73710)
  4. Elemente principale HTML (13862)
  5. Trecut perfect si Trecutul perfect continuu - Past perfect and Continuous (33629)

Popular pages this month

  1. Cursuri si Tutoriale: Engleza, Spaniola, HTML, CSS, Php-Mysql, JavaScript, Ajax (6164)
  2. Curs HTML gratuit Tutoriale HTML5 (5441)
  3. Curs si Tutoriale JavaScript (4173)
  4. Curs PHP MySQL, Tutoriale si Scripturi PHP (4047)
  5. Curs CSS Online Tutoriale CSS3 (3859)