Interfacce utente
Interfaccia utente Æ parte del sistema operativo che consente all’uomo di
interagire con il computer
interfaccia utente è nata come interfaccia di tipo testuale (DOS e UNIX)
Fondamenti di Informatica II
27. Laboratorio 8 – Windows Forms
Corso di Laurea in Ingegneria Informatica
A.A. 2008-2009
2° Semestre – Corso (A-M)
Prof. Giovanni Pascoschi
2
Tipi di interfacce utente
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
L’evoluzione delle interfacce utente (1)
Interfaccia a caratteri DOS
‰ Due sono i tipi di interfaccia più diffusi per interagire con un computer:
¾ Interfacce a caratteri, anche dette a riga di comando (CLI, command
line interfaces)
¾ Interfacce grafiche (GUI, graphical user interfaces), in particolare di
tipo WIMP (Windows, Icons, Menus, Pointing device)
3
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
4
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
Tipi di interfacce grafiche
Tipi di interfacce grafiche
‰ Cosa distingue una interfaccia grafica dall’altra?
‰ La metafora più utilizzata nei personal computer, oggi, è quella della
“scrivania” (in inglese, desktop)
¾ il tipo di metafora usata;
¾ gli elementi costitutivi che l’utente può manipolare.
‰ Dalla sua introduzione ad oggi sono state introdotte diverse
interfacce alternative, ma nessuna ha avuto sinora successo
5
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
6
L’evoluzione delle interfacce utente (2)
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
L’evoluzione delle interfacce utente (3)
Interfaccia grafica Windows 1.0
Interfaccia grafica Apple
7
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
8
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
L’evoluzione delle interfacce utente (4)
L’evoluzione delle interfacce utente (5)
Interfaccia grafica Windows 3.0
9
Fondamenti di Informatica II – A.A. 2008-2009
Interfaccia grafica Windows 95
a cura di Pascoschi Giovanni
10
L’evoluzione delle interfacce utente (6)
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
L’evoluzione delle interfacce utente (7)
Interfaccia grafica SUN tridimensionale
11
Fondamenti di Informatica II – A.A. 2008-2009
Interfaccia grafica Windows VISTA
a cura di Pascoschi Giovanni
12
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
L’evoluzione delle interfacce utente (8)
Programmazione delle interfacce grafiche
Interfaccia grafica Windows 7
‰ programmare una GUI (Graphical User Interface) è molto complesso
‰ e’ necessaria molta programmazione a livello grafico
‰ sono necessari molti elementi grafici (pulsanti, menu’, icone, ecc)
‰ non è praticabile costruire
completamente da zero
un’applicazione
GUI
partendo
‰ e’ necessario usare una libreria GUI pre-esistente
‰ ogni piattaforma ha una propria libreria GUI
13
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
14
Programmazione delle interfacce grafiche
a cura di Pascoschi Giovanni
Programmazione delle interfacce grafiche
‰ Le interfacce attuali, basate sulla metafora della scrivania, sono di
tipo WIMP (Windows, Icons, Menus, Pointing device)
‰ esempi di widget sono le icone, i menu, i pulsanti, le finestre, le barre
di scorrimento, le caselle di testo, ecc
‰ Gli elementi che le compongono vengono detti widget
‰ di solito è il sistema operativo a mettere a disposizione un insieme di
widget.
‰ Una “widget” è un elemento che fornisce informazioni all’utente o
gli permette di interagire con il sistema operativo o con
un’applicazione.
15
Fondamenti di Informatica II – A.A. 2008-2009
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
16
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
Esempio di widgets in Windows
Com’è fatta un’interfaccia grafica
icona
barra degli
strumenti
radiobox
icone di
riduzione,
ripristino e
chiusura
La finestra è anche un contenitore, ossia un elemento grafico che ne
contiene degli altri
la barra del menu è un altro esempio di contenitore
la finestra puo’ contenere altri contenitori, come una matrioska o le scatole
cinesi
gli elementi grafici piu’ complessi sono costituiti dall’unione di elementi
grafici basilari
finestra
i vari elementi che sono presenti nel contenitore vengono chiamati
componenti visuali
pulsante
17
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
18
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
Le interfacce grafiche in C++ (1)
Le interfacce grafiche in C++ (2)
all’epoca di Windows 2.0 era necessario utilizzare una decina di istruzioni
per creare una singola finestra grafica (vuota.....)
Windows Forms è una parte della libreria WPF che si occupa della gestione
delle finestre
occorreva utilizzare un set di funzioni (API – Application Programming
Interface) basate sul C
Tramite un’estensione del C++ (chiamato CLI/CRL) è possibile utilizzare il
codice destinato all’ambiente .NET anche con VC++
furono poi introdotte le MFC - Microsoft Foundation Class che costituivano
una libreria di 200 classi con un modello ad oggetti stile C++ per le API di
Win32 (Windows 95)
l’ambiente .NET (introdotto con Windows Vista) ha creato la WPF - Windows
Presentation Foundation accessibile interamente in .NET (anche Windows
XP SP1 ha nativamente il framework .NET)
19
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
20
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
Le interfacce grafiche in C++ (3)
Le interfacce grafiche in C++ (4)
La differenza principale tra C++ e .NET è la gestione completamente
automatica dell’allocazione e deallocazione della memoria impiegata per
contenere le istanze degli oggetti
Esempio di crezione di una finestra dal titolo “finestra”:
Il CLR mantiene un Heap separato da quello tradizionale chiamato
Managed Heap Æ differenza tra variabili managed e unmanaged
// gcnew è l’operatore di allocazione .NET
// Form^ è il reference (come un puntatore) ad un oggetto di tipo
managed
Form^ finestra = gcnew Form();
Tutti i controlli Windows Forms sono contenuti nel namespace
System::Windows::Forms
21
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
la finestra cosi’ creata ha una serie di attributi e metodi
esempio :
finestra->Text = “Prova”;
finestra->Width = 300; //larghezza in pixel
finestra->Height = 200; //altezza in pixel
22
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
Le interfacce grafiche in C++ (5)
Le interfacce grafiche in C++ (6)
Per creare una etichetta di testo (label):
Label^ etichetta = gcnew Label( );
etichetta->Text=“Testo di prova”;
Un evento è una qualsiasi interazione dell’utente con l’interfaccia utente
per esempio “premere il pulsante OK” in una finestra, la “selezione di un
radiobox”, ecc.
una volta creato il componente visuale, bisogna inserirlo in un contenitore
per gestire un qualsiasi evento bisogna utilizzare un “gestore di evento”
(blocco di codice) che permette di catturare l’evento eseguendo la relativa
azione.
finestra->Controls->Add(etichetta);
23
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
24
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
Documentazione MSDN sulle Windows Form
Esempi di progetti con Windows Form
per reperire maggiori informazioni sulle Windows Forms riferirsi alla MSDN
Library Æ http://msdn.microsoft.com/en-us/library/dd30h2yb(VS.80).aspx
25
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
26
Somma di due numeri con Forms (1° step)
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
Programma di somma di due numeri (progetto somma_numeri)
2.
Programma di somma di due numeri complessi (progetto primo_CLR)
3.
Programma di immissione dati da memorizzare in un file (progetto azienda)
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
Somma di due numeri con Forms (2° step)
Aggiunta elementoÆ UI Æ Windows Form con nome finestra1
Creazione progetto CLR (Common Resources Language) vuoto con nome
somma_numeri
27
1.
28
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
Somma di due numeri con Forms (3° step)
Somma di due numeri con Forms
Creazione interfaccia grafica (utilizzando Casella degli Strumenti)
29
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
30
Somma di due numeri con Forms (3° & 4° step)
3° step Æ creazione finestra (form) con gli oggetti grafici, utilizzando il
menu degli strumenti sulla destra Æ creazione di tre TextBox, tre Label e
un button di comando
4° step Æ agendo sulle proprietà
¾associazione dei nomi (Name) alle Textform : PRIMO, SECONDO,
SOMMA;
¾associazione alle tre label dei testi (Text) : primo numero, secondo
numero, somma;
¾associazione al bottone di comando del testo (Text) : OK
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
Somma di due numeri con Forms (5° step)
5° stepÆ doppio click sul bottone di comando Æ inserimento nel corpo
del metodo button1_Click delle seguenti istruzioni:
acquisisci_dati( );
// funzione per acquisire i dati
PRIMO->Clear( );
// metodo per ripulire la Textform
SECONDO->Clear( ); // metodo per ripulire la Textform
e inserimento del prototipo della funzione nella sezione public:
void acquisisci_dati( );
31
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
32
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
Somma di due numeri con Forms (5° step)
Somma di due numeri con Forms (6° step)
6° stepÆ selezionare il file finestra1.cpp e aggiungere le seguenti istruzioni
#include “finestra1.h"
#include <iostream>
using namespace std;
using namespace System::Runtime::InteropServices; // per gestire le conversioni di formato
void somma_numeri::finestra1::acquisisci_dati( )
{
double num1, num2, tot;
num1 = Convert::ToDouble(PRIMO->Text); // convertire da stringa “managed” a double
num2 = Convert::ToDouble(SECONDO->Text); // convertire da stringa “managed” a double
tot=num1+num2;
SOMMA->Text=Convert::ToString(tot); // convertire da double a stringa “managed”
}
33
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
34
Somma di due numeri con Forms (6° step)
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
Somma di due numeri con Forms (7° step)
7° stepÆcreare il file main.cpp e aggiungere le seguenti istruzioni
#include <iostream>
#include <string>
#include “finestra1.h"
using namespace std;
int main( ){
somma_numeri::finestra1 Inizia; /*crea istanza Inizia della classe
finestra1 del namespace somma_numeri*/
Inizia.ShowDialog();
// richiama il metodo ShowDialog
}
35
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
36
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
Somma di due numeri con Forms (7° step)
37
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
Somma di due numeri con Forms (output)
38
Prodotto di due numeri complessi con Forms (step 1)
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
a cura di Pascoschi Giovanni
Prodotto di due numeri complessi con Forms (step 2)
nome progetto primo_CLR
Creazione della finestra display cosi’ come qui evidenziato (reale1,
immaginario1, reale2, immaginario2, reale3, immaginario3)
39
Fondamenti di Informatica II – A.A. 2008-2009
gestione dell’evento click sul bottone OK
40
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
Prodotto di due numeri complessi con Forms (step 3)
Prodotto di due numeri complessi con Forms
file display.cpp
41
Fondamenti di Informatica II – A.A. 2008-2009
inclusione della dichiarazione della classe complesso : complessi1.h
a cura di Pascoschi Giovanni
42
Prodotto di due numeri complessi con Forms
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
a cura di Pascoschi Giovanni
Prodotto di due numeri complessi con Forms (step 4)
alcuni metodi della classe complesso : complessi1.cpp
43
Fondamenti di Informatica II – A.A. 2008-2009
creazione main per partenza Form
44
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
Prodotto di due numeri complessi con Forms (output)
Inserimento di dati da memorizzare in un file con Forms
inserimento dipendenti in un archivio aziendale
1 Label, 4 Textbox + 1 radiobutton + 3 buttons (inserimento altro dipendente,
annulla dati, fine programma) + Menu File con exit
45
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
46
Inserimento di dati da memorizzare in un file con Forms (1° step)
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
a cura di Pascoschi Giovanni
Inserimento di dati da memorizzare in un file con Forms (2° step)
creazione GroupBox Ædrag nella FormÆtasto destro mouse “Porta in secondo piano”
selezione radiobutton Æclick nell’area del GroupBox
proprietà radiobutton “impiegato”Æ checked = true
proprietà radiobutton “dirigente”
creazione Form di nome finestra1 (con textform, label e button)
nomi textbox Æ IDC_matricola, IDC_cognome, IDC_nome, IDC-stipendio
47
Fondamenti di Informatica II – A.A. 2008-2009
48
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
49
Inserimento di dati da memorizzare in un file con Forms (3° step)
Inserimento di dati da memorizzare in un file con Forms (4° step)
selezione Menustrip Æ
click nella finestra1Ædigitare FileÆdigitare nel submenu Esci
aggiungere un’altra Form di nome finestra2
inserire la label “Dati salvati correttamente”
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
50
Inserimento di dati da memorizzare in un file con Forms (5° step)
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
Inserimento di dati da memorizzare in un file con Forms (6° step)
Nel file finestra1.cpp inserire le istruzioni riportate nell’immagine
occorre
convertire
le
stringhe
“managed”
in
stringhe
“unmanaged”
tramite
il
casting con la funzione di conversione StringToHGlobalAnsi
IDC_impiegato->Checked controlla se è stato selezionato il radiobutton
al termine viene richiamata l’istanza della Form finestra2 e viene eseguito il metodo
ShowDialog
facendo doppio click su Altro dip. e AnnullaÆaggiungere le seguenti istruzioni
OK
Annulla
51
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
52
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
Inserimento di dati da memorizzare in un file con Forms (7° step)
Inserimento di dati da memorizzare in un file con Forms (8° step)
creazione main per partenza Form
facendo doppio click su Fine e EsciÆaggiungere le seguenti istruzioni
Fine
Esci
53
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
54
Inserimento di dati da memorizzare in un file con Forms (output)
55
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
Inserimento di dati da memorizzare in un file con Forms (output)
56
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
Esercizio n.1
Esercizio n.2
Implementare tramite Windows Forms la seguente applicazione che
permette di usare una calcolatrice tascabile
57
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
Analisi degli esercizi risolti dagli studenti
Analisi degli esercizi risolti dagli studenti
¾pila con vector
¾pila con list
59
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni
Implementare l’esercizio sui file C++ relativo alla segreteria di una scuola
(accesso diretto) inserendo i dati nel file tramite una Windows Form,
lasciando inalterate le altre funzionalità richieste
58
Fondamenti di Informatica II – A.A. 2008-2009
a cura di Pascoschi Giovanni