Tutorial: Realizziamo una chat per il nostro sito (Lesson 1)

Spread the love

Oggi vedremo come realizzare una simpatica chat da inserire in un box del nostro sito web. Uno strumento leggero e utile per chi vuole cominciare ad entrare nel mondo della comunicazione virtuale.

Essendo alle prime armi utilizzeremo come supporto software un programma abbastanza comune e di semplice utilizzo: Adobe Macromedia Flash (il tutorial si basa sulla versione CS4). Questo per realizzare un’applicazione chat di piccole dimensioni e soprattutto semplicistica. Ovviamente riporto a guide più approfondite per la creazione di chat professionali.

Cominciamo preparando la base e quindi avviando il software dal menu Start, Tutti i programmi, Adobe, Macromedia Flash CS4.

Nel nostro scenario creato a piacere dall’utente con colori di sfondo, immagini roteanti o semplicemente testuale avremo bisogno di inserire:

– Testo dinamico con cui appariranno tutti i messaggi degli utenti
– Testi di immissione dati dove si potrà scrivere nome utente e messaggio
– Pulsante di invio per inviare il messaggio

Per chi volesse fare qualcosa di più creativo nelle ultime lezioni, come sempre dedicate ai più esperti vedremo come inserire:

– Pulsanti di cambio colore del testo
– Pulsanti di timeshift per la chat

Per un tipo di applicazione del genere, utilizzeremo come file di input/output un documento di testo che conterrà all’incirca una quindicina di messaggi e non di più, giusto per non appesantire l’applicazione.
Per fare questo abbiamo bisogno di introdurre gli script ASP (permettono di rendere dinamiche le pagine HTML) che serviranno distintamente ad effettuare l’acquisizione del messaggio e l’invio alla chat.

Ma cominciamo con realizzare la nostra interfaccia grafica:

Per prima cosa occorre creare e posizionare sullo scenario un “Campo di testo dinamico” che sarà il nostro contenitore di messaggi. A questo punto occorrerà creare due campi di testo per inserire rispettivamente il testo di Input (che chiameremo “messaggio”) ed un altro che chiameremo “utente” (dove ovviamente sarà inserito il nome utente.

Ora ci manca ancora qualcosa: il pulsante per inviare il messaggio.

Selezioniamo sempre dalla barra posta a destra l’opzione “Pulsante” ed associamo allo stesso delle righe di codice nel linguaggio ActionScript (nativo di Flash):

on (release, keyPress “<Enter>”) {
         stringa = “<font color='”+color+”‘>”+user+” _ “+msg+”</font>”;
         loadVariablesNum (“resp.asp”, 0, “POST”);
         msg = undefined;
         refresher.gotoAndPlay(1);
}

Con questo codice, noi diamo informazioni precise:
il pulsante viene attivato quando ci si preme sopra o quando si batte “Invio” sulla tastiera, Il pulsante immette il messaggio ed il nickname separando con il trattino basso l’user ed il messaggio. Alla fine, dopo l’immissione si ordina un refresh della chat.
Abbiamo visto fino ad ora come creare una mini chat non complessa in Flash, nelle prossime lezioni vedremo come ampliarla e perfezionarla ad hoc per le nostre esigenze.

295 commenti su “Tutorial: Realizziamo una chat per il nostro sito (Lesson 1)”

  1. Hi would you mind stating which blog platform you’re working with? I’m looking to start my own blog in the near future but I’m having a tough time choosing between BlogEngine/Wordpress/B2evolution and Drupal. The reason I ask is because your design and style seems different then most blogs and I’m looking for something completely unique. P.S Apologies for getting off-topic but I had to ask!

    Rispondi
  2. Thank you for any other informative blog. Where else may just I get that type of info written in such a perfect manner? I have a venture that I’m just now working on, and I’ve been on the look out for such information.

    Rispondi
  3. Ощутите волнение от высоких полетов с лаки джет официальный сайт! Присоединяйтесь к тем, кто уже выбрал этот путь к удаче через 1win.

    Rispondi
  4. It is perfect time to make a few plans for the future and it is time to be happy. I have read this post and if I may I wish to suggest you few fascinating things or advice. Perhaps you could write next articles relating to this article. I want to read more things approximately it!

    Rispondi
  5. I’m not positive where you are getting your info, however good topic. I needs to spend a while studying more or working out more. Thank you for magnificent information I used to be in search of this information for my mission.

    Rispondi
  6. I loved as much as you will receive carried out right here. The sketch is tasteful, your authored subject matter stylish. nonetheless, you command get bought an nervousness over that you wish be delivering the following. unwell unquestionably come further formerly again since exactly the same nearly a lot often inside case you shield this increase.

    Rispondi

Lascia un commento