Costruzione di InterfacceCostruzione di Interfacce

Antonio CisterninoAntonio Cisternino

19/9/200519/9/2005

Lez. 1 - 19/9/2005 Costruzione di Interfacce 2

SyllabusSyllabus Introduzione a C++Introduzione a C++ Sistemi graficiSistemi grafici Fondamenti di graficaFondamenti di grafica Modello model-view-controllerModello model-view-controller Programmazione ad eventiProgrammazione ad eventi Sistemi di riferimento e trasformazioni Sistemi di riferimento e trasformazioni

geometrichegeometriche Librerie e framework per la graficaLibrerie e framework per la grafica Programmazione di interfacce graficheProgrammazione di interfacce grafiche Interfacce WebInterfacce Web Cenni alla grafica 3DCenni alla grafica 3D

Lez. 1 - 19/9/2005 Costruzione di Interfacce 3

Introduzione a C++Introduzione a C++

C++ è un linguaggio importante nel C++ è un linguaggio importante nel modo delle interfacce grafichemodo delle interfacce grafiche

Gli oggetti coinvolti sono spesso Gli oggetti coinvolti sono spesso grandi, e richiedono la manipolazione grandi, e richiedono la manipolazione di grandi quantità di memoriadi grandi quantità di memoria

La possibilità di gestire La possibilità di gestire esplicitamente la memoria unita al esplicitamente la memoria unita al supporto OOP rende C++ un supporto OOP rende C++ un linguaggio rilevante in questo ambito linguaggio rilevante in questo ambito

Lez. 1 - 19/9/2005 Costruzione di Interfacce 4

Sistemi graficiSistemi grafici

La conoscenza della struttura di un La conoscenza della struttura di un sistema grafico è importante per capire la sistema grafico è importante per capire la struttura dei fameworkstruttura dei famework

Negli ultimi anni i sistemi grafici sono Negli ultimi anni i sistemi grafici sono divenuti sempre più complessi, e la loro divenuti sempre più complessi, e la loro evoluzione sta condizionando quella del evoluzione sta condizionando quella del softwaresoftware

La GPU ormai affianca la CPULa GPU ormai affianca la CPUI dispositivi di I/O stanno crescendo e I dispositivi di I/O stanno crescendo e

differenziandosidifferenziandosi

Lez. 1 - 19/9/2005 Costruzione di Interfacce 5

Fondamenti di graficaFondamenti di grafica

Ma come funziona un sistema a Ma come funziona un sistema a finestre?finestre?

Quali sono le operazioni primitive che Quali sono le operazioni primitive che servono a realizzarne le funzionalità di servono a realizzarne le funzionalità di base?base?

Come si possono trasformare entità Come si possono trasformare entità geometriche come linee e curve in geometriche come linee e curve in punti?punti?

E come si possono descrivere?E come si possono descrivere?

Lez. 1 - 19/9/2005 Costruzione di Interfacce 6

Sistemi di riferimento e Sistemi di riferimento e trasformazioni geometrichetrasformazioni geometriche

I sistemi grafici fanno ampio uso di I sistemi grafici fanno ampio uso di sistemi di coordinate (schermo, sistemi di coordinate (schermo, stampante, finestra, …)stampante, finestra, …)

Spesso è necessario effettuare Spesso è necessario effettuare conversioni da uno all’altroconversioni da uno all’altro

È anche importante saper È anche importante saper trasformare oggetti o spostarli (es.: trasformare oggetti o spostarli (es.: traslazione, rotazione, scalatura)traslazione, rotazione, scalatura)

Lez. 1 - 19/9/2005 Costruzione di Interfacce 7

Programmazione ad eventiProgrammazione ad eventi

Il modello ad eventi è alla base della Il modello ad eventi è alla base della programmazione delle interfacce programmazione delle interfacce grafichegrafiche

Questo paradigma consente alla GUI Questo paradigma consente alla GUI di coordinare l’accesso ai dispositivi di coordinare l’accesso ai dispositivi di input e outputdi input e output

Il sistema grafico è responsabile per Il sistema grafico è responsabile per notificare eventi alle varie notificare eventi alle varie applicazioniapplicazioni

Lez. 1 - 19/9/2005 Costruzione di Interfacce 8

Modello model-view-Modello model-view-controllercontroller

Le interfacce grafiche sono Le interfacce grafiche sono naturalmente basate su componenti naturalmente basate su componenti grafici (bottoni, liste, alberi, …)grafici (bottoni, liste, alberi, …)

Questi componenti, e le applicazioni Questi componenti, e le applicazioni che le usano seguono un design che le usano seguono un design pattern noto col nome di Model-View-pattern noto col nome di Model-View-ControllerController

La sua comprensione è La sua comprensione è fondamentale per essere in grado di fondamentale per essere in grado di estendere framework graficiestendere framework grafici

Lez. 1 - 19/9/2005 Costruzione di Interfacce 9

Librerie e framework per la Librerie e framework per la graficagrafica

La conoscenza di librerie e framework La conoscenza di librerie e framework per la programmazione di interfacce per la programmazione di interfacce grafiche è importantegrafiche è importante

La loro struttura è simileLa loro struttura è simileSi vogliono isolare i concetti base che Si vogliono isolare i concetti base che

stanno dietro ai framework disponibilistanno dietro ai framework disponibiliEvoluzione dalla grafica raster a quella Evoluzione dalla grafica raster a quella

vettorialevettoriale

Lez. 1 - 19/9/2005 Costruzione di Interfacce 10

Interfacce WebInterfacce Web

Il browser viene usato sempre più Il browser viene usato sempre più spesso per realizzare interfacce spesso per realizzare interfacce grafichegrafiche

La sua capacità di mischiare testo, La sua capacità di mischiare testo, grafica, e interattività lo rende ideale grafica, e interattività lo rende ideale in numerose applicazioniin numerose applicazioni

Un’applicazione si basa su tre Un’applicazione si basa su tre elementi: CSS, DHTML, e JavaScriptelementi: CSS, DHTML, e JavaScript

Altre tecnologie coinvolte: XML, XSLTAltre tecnologie coinvolte: XML, XSLT

Lez. 1 - 19/9/2005 Costruzione di Interfacce 11

Cenni alla grafica 3DCenni alla grafica 3D

Come funzionano i sistemi grafici 3D?Come funzionano i sistemi grafici 3D?Elementi fondamentali: estensione Elementi fondamentali: estensione

della geometria 2D al 3Ddella geometria 2D al 3DIl modello Pinhole CameraIl modello Pinhole CameraLo scenegraphLo scenegraphPrincipali problematiche: Principali problematiche:

illuminazione, geometria, shadingilluminazione, geometria, shadingVRML e JavaScriptVRML e JavaScript

Lez. 1 - 19/9/2005 Costruzione di Interfacce 12

What’s next?What’s next?

I sistemi grafici sono sempre in I sistemi grafici sono sempre in profonda evoluzioneprofonda evoluzione

Anche le metafore stanno cambiando Anche le metafore stanno cambiando per adeguarsi ad interfacce di per adeguarsi ad interfacce di crescente complessitàcrescente complessità

I principali sistemi grafici stanno I principali sistemi grafici stanno evolvendo verso:evolvendo verso:Grafica vettorialeGrafica vettorialeUnione tra grafica 2D e grafica 3DUnione tra grafica 2D e grafica 3D

Lez. 1 - 19/9/2005 Costruzione di Interfacce 13

Windows Vista (WPF - Windows Vista (WPF - Avalon)Avalon)

Lez. 1 - 19/9/2005 Costruzione di Interfacce 14

Gnome (Cairo)Gnome (Cairo)

Lez. 1 - 19/9/2005 Costruzione di Interfacce 15

MacOS X (Quartz)MacOS X (Quartz)

Lez. 1 - 19/9/2005 Costruzione di Interfacce 16

BibliografiaBibliografia

Testi:Testi:R. Scateni, P. Cignoni, C. Montani, R. Scopigno R. Scateni, P. Cignoni, C. Montani, R. Scopigno

- - Fondamenti di grafica tridimensionale Fondamenti di grafica tridimensionale interattivainterattiva, McGraw-Hill, 2005, ISBN: 88 386 , McGraw-Hill, 2005, ISBN: 88 386 6215-0 6215-0

Fondamenti di Computer graphics G. Attardi, Fondamenti di Computer graphics G. Attardi, Università di Pisa, SEU, 1998. Università di Pisa, SEU, 1998.

ConsultazioneConsultazioneC. Petzold, C. Petzold, Programmare Windows con C#Programmare Windows con C#, ,

Microsoft Press, 2001, ISBN: 0-7356-1370-2Microsoft Press, 2001, ISBN: 0-7356-1370-2More to come…More to come…

Lez. 1 - 19/9/2005 Costruzione di Interfacce 17

Modalità di esameModalità di esame

Durante il corso saranno realizzati Durante il corso saranno realizzati due progetti:due progetti:MidTerm: realizzazione di un controllo MidTerm: realizzazione di un controllo

grafico in C++grafico in C++FinalTerm: realizzazione di FinalTerm: realizzazione di

un’applicazione graficaun’applicazione graficaChi ha già seguito l’anno scorso? Può Chi ha già seguito l’anno scorso? Può

fare l’esame di Paolo fino alla fare l’esame di Paolo fino alla sessione invernalesessione invernale