Personalizzare il Menu Contestuale con AS3

Avete presente quando viene qualcuno a trovarvi a casa e voi non avete nulla da offrirgli? Che so io… un caffé, un aperitivo… qualcosa!

Bene, è così che mi sento io quando vedo che diverse persone hanno trovato questo Blog partendo da una ricerca su Google, ma non hanno trovato quello che cercavano.

Oggi ho scelto di accontentare tutti i visitatori che giungono qui cercando informazioni sul Menu Contestuale in ActionScript 3.

Il Menu Contestuale è quello che compare quando si clicka il tasto destro del Mouse su un oggetto qualunque sullo schermo. Per quanto riguarda i filmati Flash il Menu Contestuale è gestibile tramite la Classe flash.ui.ContextMenu.

Se scriviamo il codice all’interno di un fotogramma dentro Adobe Flash non è necessario importare nulla: Flash importa automaticamente tutte le Classi disponibili per il Player in uso.

Se il nostro codice si trova all’interno di una Classe esterna (un file con estensione .as) è necessario importare tutto quello che ci serve prima di poterlo utilizzare, in questo modo:

import flash.ui.ContextMenu;

A questo punto siamo pronti per instanziare un nostro Menu ed utilizzarlo, ecco come:

var myMenu:ContextMenu = new ContextMenu();
this.contextMenu = myMenu;

Se proviamo il filmato con queste impostazioni ci accorgeremo che non è cambiato nulla rispetto a prima: premendo il tasto destro su un punto qualsiasi del Filmato compare il solito Menu Contestuale:

Menu Contestuale di Flash Player

Menu Contestuale di Flash Player

Anche se abbiamo inizializzato un nostro Menu non abbiamo ancora modificato nulla rispetto alle impostazioni predefinite.

Eliminare le Opzioni Predefinite

Proviamo adesso a rimuovere tutte le voci:

import flash.ui.ContextMenu;

var myMenu:ContextMenu = new ContextMenu();
myMenu.hideBuiltInItems();
this.contextMenu = myMenu;

Il Menu comparirà in modo differente:

Menu Contestuale di Flash Player senza nessuna Voce visualizzata.

Menu Contestuale di Flash Player senza nessuna Voce visualizzata.

Come vedete ci sono alcune Voci che non possono essere rimosse, tutte le altre invece possono essere disattivate utilizzando il Metodo hideBuiltInItems (come abbiamo appena visto), oppure possono essere disattivate singolarmente impostando a false la Proprietà corrispondente:

import flash.ui.ContextMenu;

var myMenu:ContextMenu = new ContextMenu();
myMenu.builtInItems.forwardAndBack = false
myMenu.builtInItems.loop = false;
myMenu.builtInItems.play = false;
myMenu.builtInItems.print = false;
myMenu.builtInItems.quality = true;
myMenu.builtInItems.rewind = false;
myMenu.builtInItems.save = false;
myMenu.builtInItems.zoom = false;
this.contextMenu = myMenu;

Il risultato del codice appena scritto è il seguente:

Menu Contestuale di Flash Player con la sola opzione Print.

Menu Contestuale di Flash Player con la sola opzione Print.

Abbiamo mantenuto l’Opzione Quality (Qualità) eliminando tutte le altre.

Aggiungere Opzioni Personalizzate

Possiamo aggiungere al Menu Contestuale tutte le Opzioni personalizzate che vogliamo, queste compariranno in cima alla lista.

Ecco come aggiungere un’Opzione Personalizzata al Menu:

import flash.ui.ContextMenu;
import flash.ui.ContextMenuItem;

var myMenu:ContextMenu = new ContextMenu();
myMenu.hideBuiltInItems();
var myLink = new ContextMenuItem(".: Daniele Alessandra Dot Com :.");
myMenu.customItems.push(myLink);
this.contextMenu = myMenu;

Per poter utilizzare la Classe ContextMenuItem è necessario importarla (ma non se ci troviamo nell’Ambiente di Authoring di Flash).

Ogni Opzione del Menu deve essere prima inizializzata, passando anche la Stringa da visualizzare, dopo di che può essere aggiunta al Menu utilizzando il Metodo push.

Il risultato del precedente Codice è questo:

Menu Contestuale con un'Opzione Personalizzata.

Menu Contestuale con un’Opzione Personalizzata.

Ogni Opzione Personalizzata può essere collegata ad una Funzione da eseguire quando l’utente clicka su di essa.

Per collegare una Funzione ad una Voce di Menu si utilizza un EventListener, in questo modo:

myLink.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT, vaiAlSito);

Naturalmente bisogna definire la Funzione vaiAlSito, altrimenti avremo un errore, la Funzione potrebbe essere questa:

function vaiAlSito(e:ContextMenuEvent):void{
    navigateToURL(new URLRequest("http://www.danielealessandra.com"));
}

Questa è una semplice Funzione che porta il navigatore a questo sito.

Personalizzare il Menu in base agli Oggetti

Una cosa che mi piace molto riguardo alla gestione dei Menu Contestuali di Flash Player è che possiamo creare tanti Menu diversi e collegarli a singoli oggetti, in questo modo avremo un Menu diverso per ogni elemento.

Per fare questo esperimento:

  1. ho creato un MovieClip quadrato.
  2. ho posizionato un’Istanza del quadrato sullo Stage, l’ho colorata di blu e l’ho chiamata Blue.
  3. ho posizionato una seconda Istanza del quadrato sullo Stage, l’ho colorata di rosa e l’ho chiamata Pink.
  4. ho scritto il seguente codice sul Fotogramma 1:
import flash.ui.ContextMenu;
import flash.ui.ContextMenuItem;
import flash.events.ContextMenuEvent;
import flash.net.navigateToURL;
import flash.net.URLRequest;
import flash.display.Sprite;

var myLink = new ContextMenuItem(".: Daniele Alessandra Dot Com :.");

var menuForBlue:ContextMenu = new ContextMenu();
menuForBlue.customItems.push(myLink);
Blue.contextMenu = menuForBlue;

var menuForPink:ContextMenu = new ContextMenu();
menuForPink.hideBuiltInItems();
Pink.contextMenu = menuForPink;

myLink.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT, vaiAlSito);

function vaiAlSito(e:ContextMenuEvent):void {
    navigateToURL(new URLRequest("http://www.danielealessandra.com"));
}
  • Il Menu Contestuale del quadrato blu contiene il link per questo sito.
  • Il Menu Contestuale del quadrato rosa contiene soltanto le Opzioni obbligatorie.
  • Su tutto il resto dello Stage il Menu Contestuale è quello predefinito.

Ecco il filmato per provare il menu:

No flash, please!

Purtroppo Adobe Flash Player non è più benvoluto come una volta, per questo motivo ho disabilitato tutte le applicazioni Flash presenti sul sito. Se vuoi puoi comunque scaricare il file SWF che si trovava qui, clicca qui per far partire il download

Inserisci nome e indirizzo email per iscriverti alla mia newsletter e ricevere il file immediatamente.
In breve: i dati inseriti in questo modulo saranno utilizzati per inviarti il link per scaricare il file che desideri, saranno conservati da un servizio esterno che si chiama MailChimp e in qualsiasi momento potrai cancellare la tua iscrizione al seguente link: https://danielealessandra.us7.list-manage.com/unsubscribe?u=546bebc381e525372d2120083&id=326af7d230.

Puoi leggere l'informativa completa cliccando sul link Privacy Policy che trovi dovunque su questa pagina, e comunque visitando in qualsiasi momento l'indirizzo https://www.danielealessandra.com/privacy-policy/
Ho letto e accetto l’informativa sulla privacy.

Potrebbero interessarti anche...

5 Risposte

  1. Nino ha detto:

    utilissimo tutorial, avreui una domanda, come posso aggiungere un menù contestuale usando action script 2

  1. 11 maggio 2012

    […] […]

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Questo sito usa Akismet per ridurre lo spam. Scopri come i tuoi dati vengono elaborati.