Introduzione alla programmazione di semplici applicazioni grafiche in C utilizzando la libreria grafica WinBGIm.
Lucidi utilizzati in una lezione extra-curricolare on-line nel corso di Informatica del Politecnico di Torino http://bit.ly/informatica-corno
Sujet choisi et présenté par :
François Lecomte, Virginie Rezé, David Rajsavong et Elisabeth Boy.
Support utilisé dans le cadre d'une présentation collégiale de 15 minutes pendant la formation Community Management enseignée à l'IFOCOP Rungis.
Enseignant:
Philippe Usseglio Nanot
Maître de conférence à l'IUT d'Evry (communication on line et marketing)
Sujet choisi et présenté par :
François Lecomte, Virginie Rezé, David Rajsavong et Elisabeth Boy.
Support utilisé dans le cadre d'une présentation collégiale de 15 minutes pendant la formation Community Management enseignée à l'IFOCOP Rungis.
Enseignant:
Philippe Usseglio Nanot
Maître de conférence à l'IUT d'Evry (communication on line et marketing)
Lucidi relativi al DVD di Programmazione in CFulvio Corno
Copia integrale dei lucidi presenti nel DVD di Programmazione in C del Politecnico di Torino. Il DVD è visibile on-line all'indirizzo http://corsiadistanza.polito.it/on-line/Prog_in_C/index2.htm
Creazione di una stazione meteo con prodotti opensource. Linux day 2014 - Lin...Matteo Baccan
Per Linux Day 2014 a Novara abbiamo discusso di come costruire una semplice stazione meteo con raspberry Pi e componenti opensource. Queste sono le slide del mio intervento, che parlava della parte software scritta per leggere e visualizzare i sensori connessi a Raspberry Pi
Alessandro Forte, co-fondatore di DotNetCampania, illustra ai soci dell’associazione la piattaforma Android e come sviluppare applicazioni per tale piattaforma.
Un'immagine, si sa, vale più di mille parole, e a maggior ragione anche più di mille numeri: la rappresentazione visiva di una serie di cifre è la strada più rapida per identificare a colpo d'occhio le situazioni che necessitano di una più approfondita analisi di dettaglio.
Strumenti come Google Chart Tools rendono possibile l'integrazione di grafici funzionali e moderni nelle proprie applicazioni web, e quando queste ultime sono realizzate sfruttando le potenzialità di Domino e la flessibilità delle XPages si può davvero parlare di felice unione tra esperienza produttiva e dinamica per l'utente e sviluppo rapido per il programmatore.
In questa sessione analizzeremo insieme, con demo alla mano, diversi esempi pratici applicabili anche in contesto mobile, senza dimenticare l'importanza fondamentale di una selezione ragionata dei dati da elaborare.
Introduzione all’Iot e alle schede elettronicheEnrico La Sala
Una breve introduzione all'IOT e delle risorse che possono essere utili a cominciare con i primi progetti con schede elettroniche come Arduino, Raspberry, ecc.
Una carrellata sugli strumenti di sviluppo per le principali piattaforme mobile: Android, iPhone, Windows Phone 7, Symbian e Blackberry.
Le principali caratteristiche, IDE, tool crossplatform e application store.
WhyMCA HappyHour
More Related Content
Similar to Rudimenti di programmazione grafica in C con la libreria grafica WinBGIm
Lucidi relativi al DVD di Programmazione in CFulvio Corno
Copia integrale dei lucidi presenti nel DVD di Programmazione in C del Politecnico di Torino. Il DVD è visibile on-line all'indirizzo http://corsiadistanza.polito.it/on-line/Prog_in_C/index2.htm
Creazione di una stazione meteo con prodotti opensource. Linux day 2014 - Lin...Matteo Baccan
Per Linux Day 2014 a Novara abbiamo discusso di come costruire una semplice stazione meteo con raspberry Pi e componenti opensource. Queste sono le slide del mio intervento, che parlava della parte software scritta per leggere e visualizzare i sensori connessi a Raspberry Pi
Alessandro Forte, co-fondatore di DotNetCampania, illustra ai soci dell’associazione la piattaforma Android e come sviluppare applicazioni per tale piattaforma.
Un'immagine, si sa, vale più di mille parole, e a maggior ragione anche più di mille numeri: la rappresentazione visiva di una serie di cifre è la strada più rapida per identificare a colpo d'occhio le situazioni che necessitano di una più approfondita analisi di dettaglio.
Strumenti come Google Chart Tools rendono possibile l'integrazione di grafici funzionali e moderni nelle proprie applicazioni web, e quando queste ultime sono realizzate sfruttando le potenzialità di Domino e la flessibilità delle XPages si può davvero parlare di felice unione tra esperienza produttiva e dinamica per l'utente e sviluppo rapido per il programmatore.
In questa sessione analizzeremo insieme, con demo alla mano, diversi esempi pratici applicabili anche in contesto mobile, senza dimenticare l'importanza fondamentale di una selezione ragionata dei dati da elaborare.
Introduzione all’Iot e alle schede elettronicheEnrico La Sala
Una breve introduzione all'IOT e delle risorse che possono essere utili a cominciare con i primi progetti con schede elettroniche come Arduino, Raspberry, ecc.
Una carrellata sugli strumenti di sviluppo per le principali piattaforme mobile: Android, iPhone, Windows Phone 7, Symbian e Blackberry.
Le principali caratteristiche, IDE, tool crossplatform e application store.
WhyMCA HappyHour
Similar to Rudimenti di programmazione grafica in C con la libreria grafica WinBGIm (20)
Rudimenti di programmazione grafica in C con la libreria grafica WinBGIm
1. 12BHD Informatica
Rudimenti di programmazione
grafica in C con la libreria WinBGIm
Informatica (DELS-FEQ) – F. Corno – A.A. 2010/2011
2. Argomenti
Librerie grafiche
La libreria WinBGIm
Software necessario
Modello di funzionamento
Principali funzioni
Esempi
2 12BHD - Informatica A.A. 2010/2011
3. 12BHD Informatica
Librerie grafiche
Programmazione grafica con libreria WinBGIm
4. Computer graphics, oggi
Sistemi operativi basati su interfacce grafiche
Alte risoluzioni, full color
Applicazioni a più finestre
“Widget” standard (menu, toolbar, bottoni, campi testo, …)
Campi applicativi
Applicazioni “office”
Applicazioni grafiche (immagini, filmati, …)
Video giochi
Programmi scientifici (matematica, fisica, ingegneria, …)
Però… elevata complessità di programmazione
4 12BHD - Informatica A.A. 2010/2011
5. Complessità di programmazione
Necessità di interagire con il sistema operativo attraverso
opportune API
Solitamente le API sono pensate per linguaggi object-
oriented (C++, Java, C#,VB.Net, python, …)
Programmazione di tipo asincrono ed event-driven
L’ordine di esecuzione delle operazioni dipende dalle azioni
dell’utente e non è sotto il diretto controllo del programma
Portabilità: API specifiche per un sistema operativo, o API
“generiche” disponibili per più sistemi operativi
Funzionalità della GPU: accelerazione, trasparenza, 3D,
buffering, …
5 12BHD - Informatica A.A. 2010/2011
6. Librerie grafiche (API)
A livello di Sistema operativo
Windows GDI, Unix X-11, MacOs Aqua
Soluzioni accelerate non portabili
DirectX, Direct3D su Windows
Librerie 2D/3D accelerate portabili
OpenGL e decine di toolkit basati su OpenGl
OpenCV
Librerie per “applicazioni windowing”
Portabili: GTK, Qt, wxWindows, …
Windows: WPF (XAML+.NET)
Librerie di più alto livello
6 12BHD - Informatica A.A. 2010/2011
7. …ma si può fare in C?
Molte librerie espongono anche API per programmi scritti
in C. Però:
Forte uso di puntatori e memoria dinamica
Funzioni spesso complesse e basate su strutture dati (struct,
matrici, …) che richiedono un certo studio
Paradigma di programmazione event-driven, da studiare e
capire
Hello world → 100-200 righe di programma
…nulla che si possa imparare in ~un’ora
…a meno di tornare indietro di 20 anni!
7 12BHD - Informatica A.A. 2010/2011
8. 12BHD Informatica
La libreria WinBGIm
Programmazione grafica con libreria WinBGIm
9. DOS e Borland
Ai tempi di MS-DOS (prima di Windows 3.0)
Non esistevano interfacce a finestre
Console
Grafica bitmapped
La software house Borland vendeva favolosi compilatori
TurboPascal, TurboC/TurboC++
Nei compilatori Borland era inclusa una libreria grafica
BGI: Borland Graphics Interface
Semplice da usare, anche se poco potente (per gli standard
odierni)
Programmazione procedurale in C
9 12BHD - Informatica A.A. 2010/2011
10. BGI oggi
La libreria BGI originale funziona:
Con compilatori a 16 bit
Con schede grafiche solo EGA/VGA/SVGA
Nel sistema operativo DOS (non Windows)
Esiste un “porting” su windows
WinBGIm: Windows BGI con mouse
Compatibile con il compilatore mingw
Estende la “vecchia” BGI con funzioni più utili in ambiente
windows (es. controllo del mouse)
Mantiene la stessa modalità di programmazione
Purtroppo non molto documentata e/o aggiornata
Non funziona su Linux o Mac OS-X
10 12BHD - Informatica A.A. 2010/2011
13. 12BHD Informatica
Software necessario
Programmazione grafica con libreria WinBGIm
14. Installazione WinBGIm
Composta da 2 file
Libreria compilata: libbgi.a
File da includere: graphics.h
Necessario:
Copiare tali file nelle directory di installazione di mingw
(all’interno di codeblocks)
Impostare opzioni di compilazione particolari nel progetto
-x c++ -lbgi
Oppure:
Scaricare una versione “modificata” di Code::Blocks che
include già tali modifiche
14 12BHD - Informatica A.A. 2010/2011
16. 12BHD Informatica
Modello di funzionamento
Programmazione grafica con libreria WinBGIm
17. Modello di funzionamento
Il programma può aprire una (o più) finestre grafiche
Ogni finestra ha un sistema di coordinate in cui lavorare,
corrispondente ai pixel dell’immagine
All’interno delle finestre, è possibile disegnare con delle
primitive grafiche (linee, punti, cerchi, scritte, …) in diversi
colori
È possibile leggere i caratteri della tastiera in modalità
non bloccante
17 12BHD - Informatica A.A. 2010/2011
18. Finestra grafica
Dimensione X
Dimensione Y
18 12BHD - Informatica A.A. 2010/2011
19. Finestra grafica
Dimensione X
(0, 0)
A
X
( 250, 100 )
B
Dimensione Y
( getmaxx(), getmaxy() )
C
Y
19 12BHD - Informatica A.A. 2010/2011
20. Creare una finestra
La funzione int initwindow(int width,
initwindow(…) crea una int height, const char*
nuova finestra grafica title="...", int left=0, int
Width, height: dimensioni top=0);
della finestra in pixel void closegraph(void);
Title: titolo (opzionale)
Left, top: posizione iniziale
(opzionale)
Per chiudere la finestra
usare closegraph()
20 12BHD - Informatica A.A. 2010/2011
21. Colori
16 colori predefiniti void setcolor(int color);
Costanti da 0 a 15: setcolor(BLUE); // Change
BLACK, BLUE, GREEN, CYAN, drawing color to BLUE.
RED, MAGENTA, BROWN,
LIGHTGRAY, DARKGRAY,
setcolor(COLOR(255,100,
LIGHTBLUE, LIGHTGREEN, 0)); // Change drawing color
LIGHTCYAN, LIGHTRED, to reddish-green.
LIGHTMAGENTA, YELLOW
WHITE void setbkcolor(int color);
Un qualsiasi colore RGB
COLOR(r, g, b) con r, g, b,
compresi tra 0 e 255
COLOR(255,100,0)
21 12BHD - Informatica A.A. 2010/2011
22. 12BHD Informatica
Principali funzioni
Programmazione grafica con libreria WinBGIm
23. Disegnare
Punti
void putpixel(int x, int y, int color);
Linee
void line(int x1, int y1, int x2, int y2);
Segmento da (x1, y1) a (x2, y2) con il colore corrente
void lineto(int x, int y);
Segmento dall’ultimo punto tracciato a (x, y)
void linerel(int dx, int dy);
Segmento dall’ultimo punto, spostandosi di un vettore (±dx, ±dy)
23 12BHD - Informatica A.A. 2010/2011
24. Disegnare
Curve
void circle(int x, int y, int radius);
void arc(int x, int y, int stangle, int endangle, int radius);
/* angoli da 0 a 360 */
void pieslice(int x, int y, int stangle, int endangle, int radius);
/* arco ripieno */
void ellipse(int x, int y, int stangle, int endangle, int xradius, int
yradius);
void fillellipse(int x, int y, int xradius, int yradius); /* pieno */
void sector(int x, int y, int stangle, int endangle, int xradius, int
yradius);
/* arco di ellisse ripieno */
24 12BHD - Informatica A.A. 2010/2011
25. Disegnare
Rettangoli
void rectangle(int left, int top, int right, int bottom);
void bar(int left, int top, int right, int bottom); /* riempita */
Poligoni
void drawpoly(int numpoints, int *polypoints);
Polypoints è un vettore di 2N interi, in cui per ciascuno degli N punti
sono riportare le coordinate X e Y
void fillpoly(int numpoints, int *polypoints); /* riempito */
Riempimento
void floodfill(int x, int y, int border);
Riempie del colore corrente l’area intorno al punto (x,y), fermandosi
ai bordi di colore border
25 12BHD - Informatica A.A. 2010/2011
26. Scrivere
“Disegnano” il testo specificato
void outtextxy(int x, int y, char *textstring);
void outtext(char *textstring);
Il carattere si può speficicare con:
void settextstyle(int font, int direction, int charsize);
font = 0…10 (font predefiniti dalla BGI)
direction = HORIZ_DIR
charsize = 1 o 2
26 12BHD - Informatica A.A. 2010/2011
27. Tastiera
Leggi un carattere senza aspettare l’invio
int getch(void);
L’utente ha premuto un tasto?
int kbhit(void);
Funzione non bloccante!
if(kbhit()) { ch = getch() ; move_user(ch) ;} else { move_monsters(); }
27 12BHD - Informatica A.A. 2010/2011
28. Mouse
Coordinate correnti del Parametro kind: tipo di
mouse evento che vogliamo
int mousex(void); interrogare
int mousey(void); WM_MOUSEMOVE
C’è stato un click? WM_LBUTTONDOWN
WM_LBUTTONUP
bool ismouseclick(int kind); WM_RBUTTONDOWN
Dove è stato il click? WM_RBUTTONUP …
voud getmouseclick(int kind,
int& x, int& y);
Pulisci il buffer dei click
precedenti
void clearmouseclick(int kind);
28 12BHD - Informatica A.A. 2010/2011
29. Controllo del programma
Piccolo ritardo di elaborazione
void delay(int millisec);
29 12BHD - Informatica A.A. 2010/2011
30. 12BHD Informatica
Esempi
Programmazione grafica con libreria WinBGIm
31. Esercizio
Creare una finestra grafica 400x300 e disegnare una
“griglia” di linee a distanza regolare di 20 pixel
Opzionalmente, le linee dovranno avere diversi colori
Opzionalmente, i singoli quadretti dovranno essere
riempiti con un motivo a scacchiera
31 12BHD - Informatica A.A. 2010/2011
32. Esercizio
Disegnare il grafico della funzione y=x^2 (con x ∈ [-2,2])
in una finestra di dimensione 400x400
Opzionalmente, disegnare anche gli assi cartesiani
Nota: occorre rimappare il sistema di coordinate della
finestra nel sistema di coordinate del grafico
(0,0) (x2, y2)
Cosa
P (r, c) lega P (x, y)
(r,c) a
(x,y)?
(dimx, dimy) (x1, y1)
32 12BHD - Informatica A.A. 2010/2011
33. Esercizio
Realizzare un gioco scemo nel quale l’utente può spostare
un quadrato, spostandolo con i tasti freccia.
I movimenti del quadrato dovranno essere vincolati
all’interno della finestra
Se l’utente preme H (hyperspace), il quadrato scompare e
ricompare in un punto casuale.
33 12BHD - Informatica A.A. 2010/2011
34. Riferimenti e link
Code::Blocks EDU-Portable
http://codeblocks.codecutter.org/
Documentazione funzioni WinBGIm
Introduzione: http://www.cs.colorado.edu/~main/cs1300-
old/cs1300/doc/bgi/bgi.html
Consultazione on-line:
http://www.cs.colorado.edu/~main/cs1300/doc/bgi/index.html
In formato PDF:
http://www.stefansundin.se/programmering/proga/WINBGIM-
%20MANUAL.pdf
Dispensa sull’uso delle funzioni BGI
http://web.tiscali.it/cervelli/dispense/Programmazione%20Grafic
a%20V%200.3.pdf
34 12BHD - Informatica A.A. 2010/2011
35. Licenza d’uso
Queste diapositive sono distribuite con licenza Creative
Commons “Attribuzione - Non commerciale - Condividi allo
stesso modo 2.5 Italia (CC BY-NC-SA 2.5)”
Sei libero:
di riprodurre, distribuire, comunicare al pubblico, esporre in pubblico,
rappresentare, eseguire e recitare quest'opera
di modificare quest'opera
Alle seguenti condizioni:
Attribuzione — Devi attribuire la paternità dell'opera agli autori
originali e in modo tale da non suggerire che essi avallino te o il modo
in cui tu usi l'opera.
Non commerciale — Non puoi usare quest'opera per fini
commerciali.
Condividi allo stesso modo — Se alteri o trasformi quest'opera, o se
la usi per crearne un'altra, puoi distribuire l'opera risultante solo con
una licenza identica o equivalente a questa.
http://creativecommons.org/licenses/by-nc-sa/2.5/it/
35 12BHD - Informatica A.A. 2010/2011