Videata di ricerca

Negli esempi che abbiamo realizzato insieme abbiamo sempre utilizzato videate graficamente uguali tra loro, precisamente videate che occupavano l’intera area desktop applicazione creata nella scheda browser. Esistono videate che possono avere un effetto grafico di videata in primo piano con una dimensione (larghezza altezza) inferiore: tali videate sono definite all’interno di Foundation come Videate Non Parte del Desktop poiché stanno su un livello z-index superiore e possono essere di tipo Popup o di tipo Modal.

La videata di tipo Modal (Modale), se aperta, non consente l’interazione con nessun altro elemento di interfaccia, se non contenuto nella videata stessa (quindi l’utente non può interagire con altre videate o con il menu principale), la videata di tipo Popup non ha queste limitazioni, quindi l’utente può interagire con tutto il resto dell’interfaccia.

Quando si utilizza una videata non parte del desktop? Di solito quando le informazioni da visualizzare non sono tante e quindi non si vuole che la videata a tutto schermo risulti scarna, oppure quando si richiede all’utente di effettuare una scelta: si diciamo che un utilizzo massiccio di tale videate si effettua proprio con le Videate di Ricerca.

Prendiamo spunto dalla videata Prenotazioni e andiamo in layout Dettaglio: riusciamo di certo ad inserire l’appartamento desiderato e il Cliente di prenotazione in quanto grazie alle Query di Lookup viene a crearsi un elenco di scelta; consideriamo questo aspetto ma quando i clienti saranno 1000 o anche solo 500 sarà così agevole una casella a discesa ? Stesso discorso per la parte appartamenti; di certo lasciamo questa interfaccia di selezione ma sarebbe preferibile prevederne una secondaria tramite una videata di ricerca.

Creiamo dunque una videata che elenchi gli appartamenti: nel componente cerchiamo il documento Appartamento e trasciniamo con sul nome dell’applicazione YouBb (come notate la creazione della videata è la solita).

Sistemo la videata all’interno della cartella Videate di Ricerca, e poi la modifico: doppio clic sulla videata e assegniamo il nome Ricerca Appartamento, facendo attenzione al check Parte del Desktop, togliere questo check trasforma la videata in una videata Popup o Modal (l’informazione di come dovrà essere si imposta nel codice quando si apre la videata).

Confermiamo la scheda, e troviamo anche graficamente elementi non presenti prima, un bordo più spesso della videata e dei pulsanti nel lato sinistro superiore della caption: pulsanti per confermare la scelta o annullare la scelta effettuata (quindi entrambi i pulsanti chiuderanno la videata uno confermando l’altro annullando).

Poi diciamo che la costruzione del pannello contenuto è sempre uguale, quindi il pannello contiene la master query, i campi di pannello, i due layout: sistemo velocemente il pannello.

Lascerò solo il layout lista.

Lascerò solo Può Ricercare (non consento inserimenti e aggiornamenti).

Se volete potete fermate il video cosi date una disposizione grafica anche nel vostro progetto, altrimenti vi aspetto qua tra poco.

Siccome i due pulsanti Conferma e Annulla presenti sulla toolbar, parere personale, non sono così chiari per l’utente, ne aggiungo due custom; faccio spazio in fondo alla lista e creo due campi statici di tipo Command Button: il primo lo chiamo Conferma, e il secondo Annulla.

Creo le due procedure che devono rispondere a questi Button: tasto destro su Conferma => Aggiungi Procedura: il codice è semplicissimo perché il pulsante deve chiudere la videata quindi close(true) (il parametro interno a close indica se chiudiamo confermando o annullando); ripeto la stessa cosa con il Button Annulla, dove questa volta scriverò close(false).

La videata di ricerca è pronta, manca l’interazione con l’esterno (quindi dovremo aprire la videata e recuperare nel caso l’utente, abbia confermato, la scelta effettuata.

Vi aspetto al prossimo tutorial dove concluderemo il codice.