Realizzare controlli Antonio Cisternino

L’esperienza del bottone  Il progetto Bottone (vedere bottone.zip) ci ha consentito di analizzare la struttura di un componente  Osserviamo che: Si fa uso del bubbling degli eventi piuttosto che della delegation Si fa uso del bubbling degli eventi piuttosto che della delegation Esistono messaggi come Paint che non sono direttamente correlati all’input dell’utente Esistono messaggi come Paint che non sono direttamente correlati all’input dell’utente Il disegno viene fatto utilizzando il contesto grafico: una struttura dati che consente il disegno Il disegno viene fatto utilizzando il contesto grafico: una struttura dati che consente il disegno

Il punto di vista del controllo  Un controllo: Ha uno stato interno Ha uno stato interno È responsabile per disegnarsi nell’area che gli è stata assegnata È responsabile per disegnarsi nell’area che gli è stata assegnata Viene configurato mediante l’impostazione di proprietà del controllo Viene configurato mediante l’impostazione di proprietà del controllo Del proprio stato disegna solo la porzione visibile Del proprio stato disegna solo la porzione visibile Quando lo stato viene modificato l’area del controllo viene invalidato causando la generazione del metodo paint Quando lo stato viene modificato l’area del controllo viene invalidato causando la generazione del metodo paint

Il controllo Eventi Controllo Stato Paint OnPaint Disegna usando contesto grafico

Model-View-Controller  Un pattern di programmazione molto ricorrente in grafica è il model-view-controller (MVC)  Può essere istanziato a vari livelli nel dominio delle interfacce: a livello dell’applicazione, o dei componenti  Elemento essenziale è il disaccoppiamento tra le azioni compiute da un utente (o un’altra porzione del programma) e la visualizzazione successiva: tutto è mediato dal modello che viene aggiornato e utilizzato per la visualizzazione aggiornata

Il MVC Model ViewController Utente Usa Manipola Aggiorna Vede Dominio Applicativo del Problema

Model  Il modello è costituito dall’insieme di informazioni utilizzate per la visualizzazione  Il suo compito è anche quello di mediare le azioni e le reazioni di un elemento grafico  Questo è necessario poiché non tutti gli eventi sono causati da interazione diretta (ad esempio l’evento paint)

View  La vista è la porzione del modello che può essere rappresentata  Tipicamente la callback associata all’evento paint è responsabile per la sua implementazione  La vista di componenti grafici complessi può richiedere l’individuazione di un sottoinsieme del modello da visualizzare  Le scroll-bar vengono spesso utilizzate per spostare la vista

Controller  Il controllo è la componente responsabile per mediare la manipolazione del modello  Nel caso di controlli grafici è tipicamente costituito da un insieme di proprietà e dalle callback per la gestione degli eventi  In generale si tratta dell’insieme di strumenti messi a disposizione dell’utente del componente grafico per la sua manipolazione

Un esempio: l’albero  Il modello del TreeView è un albero  La sua vista è responsabile per mostrare solo la parte visibile  Accanto ad ogni nodo interno il controllo consente di controllare lo stato di visualizzazione del sottoalbero

Il bottone Eventi Bottone Stato Paint OnPaint Disegna usando contesto grafico Modello Controllo Vista