pr4 PDF

Platformă de e‐learning și curriculă
gș e‐content
pentru învățământul superior tehnic
 Instrumente pentru Dezvoltarea Programelor
p g
3 Instrumente pentru modelare

3. Instrumente pentru modelare.
Platformă de e‐learning și curriculă e‐content pentru
învățământul superior tehnic
Toate modelele sunt greșite; unele

dintre ele sunt însă folositoare.
(George Box)
IDP – Instrumente pentru Dezvoltarea Programelor 2
Ce înseamnă
C î ă
modelarea?
D
De ce modelăm?
d lă ?
 Aplicaţiile software pot fi complexe; cum le putem gestiona
eficient?
fi i t?
Posibilă soluţie: folosim o bună reprezentare a sistemului
 Model: reprezintă anumite proprietăţi ale unui obiect într‐un
p p p ţ
anumit context
Reducerea complexităţii prin ascunderea detaliilor ce nu sunt
necesare (abstractizare)
( )
Anumite proprietăţi ale sistemului pot deveni mai vizibile
(claritate)
F ilit ă li
Facilitează aplicarea unei metodologii
i t d l ii
În general; modelele oferă o mai bună utilizabilitate
 De
De obicei se folosesc mai multe modele în paralel; modele
obicei se folosesc mai multe modele în paralel; modele
diferite pentru diverse scopuri
M d l
Modele
• Modele de date
Tipuri de date şi relaţiile între
acestea
E.g. Diagrame ER, diagrame
de clase
• Modele arhitecturale
Componente ale unui sistem şi
relaţiile între acestea
• Modele pentru interfeţe

utilizator
Structura UI
(navigare, interacţiune, …)
E.g. formcharts, diagrame
ecran
5
M i
Mai multe modele
l d l
• Modele stare tranziţie
Stări ale sistemului şi tranziţii
între acestea
E.g. Maşini cu stare pentru
modelarea jocurilor
• Modele ale codului sursă

Structura codului programului
E.g. Arbori de sintaxă abstracţi
(AST)
Grafuri de apeluri, grafuri de

dependinţe, diagrame de
fluxuri de date
& multe altele… …
M d l
Modelare orientată obiect
i ă bi
 Punct de pornire: descrierea informală a cerinţelor
 Analiza OO:
Modelează invarianţi specifici domeniului unui sistem
Părţi stabile ce descriu concepte stabile
Ex: într‐o universitate sunt întotdeauna studenţi, cursuri,
profesori…
f i
 Proiectarea OO:
Rafinează modelul de analiză cu părţi dependente de
R fi ă d l ld li ă ă id d d
implementare
Ex: persistenţă, distribuţie, folosirea anumitor tehnologii sau
p ţ ţ g
componente
M d l d D t
Modele de Date
M d l
Modelarea datelor
d l
 Presupune crearea unui model al entităţilor unui sistem pornind de la cerinţele
utilizator
 Adesea cel mai important pas în construcţia software
Modelul de analiză
 Conceptele aşa cum sunt ele înţelese de către utilizatori
C t l t l î ţ l d ăt tili t i
Cu ce concepte lucrează sistemul? → clase, atribute, asocieri
Ce ar trebui să facă sistemul? → operaţii
 Facilitează comunicarea cu clientul & verificarea specificaţiei
Facilitează comunicarea cu clientul & verificarea specificaţiei
 Nu există detalii de implementare
 Evoluează cu timpul (prea multe detalii prea devreme produc neclaritate)
Modelul de proiectare
 Extinde/adaptează modelul de analiză a.î. să devină mai clar cum va fi
implementat sistemul
 Rafinarea modelului de analiză cu detalii de implementare
f d l l d l ă d l d l
Clase
Cl
 Numele clasei, variabile ale instanţei (atribute) şi semnăturile
metodelor (operaţii)
 Obser
Observaţie: multe atribute ale unui Student şi ale unui Lecturer
aţie m lte atrib te ale n i St dent şi ale n i Lect rer
concid
Reutilizabilitatea Claselor:
Moştenire / Generalizare
Clasă abstractă
Relaţie “Is-a”
M
Moştenire
i & Clase Abstracte
& Cl Ab
 Moştenirea singurală:
O superclasă generică
O superclasă generică
Mai multe subclase specializate
 Avantaje:
Refolosirea elementelor comune claselor
Mentenanţă mai bună
Invocarea dinamică a metodelor
(“Don’t ask what kind”)
 Superclasa abstractă se foloseşte atunci
p ş
când superclasa este atât de generală
încât nu are sens să fie instanţiată;
subclase non‐abstracte
subclase non abstracte
 Mai multe exemple:
Superclasa Mammal, subclasele Cat, Dog, Human
Superclasa Car, subclasele SportsCar, Van, 4WD
Superclasa
S l N t
NetworkProtocol, subclasele HTTP, SMTP, POP3
kP t l b l l HTTP SMTP POP3
Conectarea claselor: Asocieri

Conectarea claselor: Asocieri
1. Conectarea claselor cu o linie
2. Specificarea multiplicităţii fiecărui capăt al asocierii: min..max
(min şi max ale instanţelor conectate la fiecare capăt)
1..* 0..* 0..* 1
Un curs este Un student Un pprofesor Un curs este

urmat de unul poate avea un predă un număr predat de un
sau mai mulţi număr arbitrar arbitrar de singur profesor
studenţi de cursuri cursuri (în realitate
( sibil nici
(posibil i i (
(posibil
ibil nici
i i l
lucrurile
il pott fi
unul) unul) diferite)
A i iR
Asocieri Recursive
i
 Asocieri ce conectează o clasă cu aceaşi clasă
 Pentru a distinge capetele asocierii le putem eticheta (etichetele sunt
numite roluri)
 Exemplu: cursurile pre
Exemplu: cursurile pre‐necesare
necesare pentru un curs
pentru un curs
Un curs poate necesita ca un student să fi absolvit în prealabil 0..* alte cursuri
Fiecare curs poate fi cerut a fi completat anterior de către 0..* alte cursuri
0..* requiredCourses
0..**
0
requiredByCourses
Analysis vs Design Model

Analysis vs. Design Model
Modelul de proiectare
Modelul de analiză  Asocieri orientate
 Asocieri neorientate (referinţe de obiecte Java)
 Modelează doar acele aspecte ce ţin  Controlul accesului
de cerinţe  Metode getter&setter
 Doar acele metode ce reprezintă  Metode pentru stocarea datelor, gestiunea
funcţii cerute de către client erorilor, GUI, …
Crearea Modelelor de Date
folosind Dia
ş
şi Green (Eclipse)
( p )
green
g
Crearea Modelului de Analiză cu Dia

Crearea Modelului de Analiză cu Dia
Adăugarea de operaţii
cu parametrii,
analog pentru
atribute
Proprietăţi
Se alege “UML”
Clasă nouă
Asociere nouă
Fereastra principală
Toolbox
Double-click pe
formă pentru a
edita proprietăţie,
proprietăţie
Export folosind
File->Export 17
Crearea unui proiect nou & Importarea codului
Crearea unui proiect nou & Importarea codului
Java
1. Crearea unui proiect nou Java
p
2. Click dreapta pe proiect în “package
explorer”, selectare “Import…”
3 Selectarea
3. Selectarea de unde dorim încărcarea
de unde dorim încărcarea
codului (fişiere .java sau arhive .jar) şi
alegerea fişierului/elor
4 Fişierele apar în
4. Fişierele apar în
“package explorer”
Crearea unui Pachet nou & Model de Proiectare folosind
Crearea unui Pachet nou & Model de Proiectare folosind
Green
1. Click pe proiect în “package explorer”
şi adăugarea unui nou pachet
2. Click dreapte pe noul pachet,
folosirea submeniului “Green UML”’
3
3. Se deschide un panel de
Se deschide un panel de
diagramă şi în “package
explorer” apare un nou
fişier diagramă
4. Editarea clasei diagramă
duce la schimbarea corespunzătoare a codului sursă, e.g. generarea unui nou
d l hi b ăt d l i ă i
fişier .java
5. Exportarea diagramei ca imagine prin
selectarea fişierului diagramă în “package explorer”
şi selectarea File ‐> Save as…
Crearea unei Diagrame de Clase pornind de la
Crearea unei Diagrame de Clase pornind de la
Codul Java
1
1. Selectara fişierelor Java în
fişierelor Java în
“package explorer”
2. Click dreapta pe ele şi se
alege “Open in UML class diagram”
3. Clasele apar în view‐ul pentru diagrame
4. Se repetă paşii pentru adăugarea mai multor clase la diagramă
A
Aceasta funcţionează de asemenea pentru pachete şi proiecte întregi.
t f ţi ăd t h t i i t î t i
Mai multe despre Green: Help ‐> Help Contents ‐> Green Users Guide
S
Sumar parţial
i l
 Modelele reprezintă aspecte interesante ale sistemului într‐un
ode e e ep e tă aspecte te esa te a e s ste u u t u
mod mai clar şi uşor de gestionat
 Există diverse modele ce servesc unor scopuri diferite
 Modelele pentru analiză captează cerinţele sistemului şi ajută la
o mai bună înţelegere şi verificarea a acestora din partea
utilizatorului
 Modelele de proiectare rafinează modelele de analiză a.î. să
devină clar modul în care trebuie implementat sistemul
 Instrumentele de modelare ajută la crearea automată a
modelelor şi a codului
Î t bă i
Întrebări recapitulative:
it l ti
1. Numiţi 3 modele diferite folosite în SE.
2 C
2. Ce reprezintă o asociere recursivă?
i ă i i ă?
Daţi un alt exemplu decât cel amintit.
Metamodele Modele şi Instanţe de Modele

Metamodele, Modele Instanţe de Modele
Distincţie între model şi instanţa acestuia (date)
Ex: modelul economic de date (parsimonious data model ‐ PDM)
Metamodel: descrie structura unui model
1 1 1 1
Ti
Tip owner owner Tip
partner partner
Rol Rol
M d l d
Model: descrie structura datelor
i t t d t l 1
String
1..* nume
Curs participanţi 1
Student String
g
id
Asocieri “Arcalianu Alexandra”
Instanţă de model: datele nume
participanţi
id
?
Date IDP nume
“Simion Liviu Mihai”
participanţi ?
IDP – Instrumente pentru Dezvoltarea Programelor
id 23
Domain Specific Languages (DSLs)

Domain Specific Languages (DSLs)
 Modelarea nu este obligatoriu realizată grafic; există şi modele
textuale
 DSL‐urile sunt specifice unui anumit domeniu, ele furnizează un
model de descriere a entităţilor specifice respectivului domeniu
 Mai uşor de descris o problemă folosind un DSL adecvat decât
un limbaj generic precum Java
 Ex: Limbajul GraphViz pentru construcţia grafurilor
Ex: Limbajul GraphViz pentru construcţia grafurilor
graph G {
subgraph clusterA { a -- b;
subgraph clusterC {C -- D;} }
subgraph clusterB { d -- f }
d -- D
e -- clusterB
clusterC -- clusterB
} 24
Forward şi Reverse Engineering
Forward şi Reverse Engineering
Forward Engineering
 Generarea unei reprezentări de nivel scăzut Model
a sistemului pornind de la una de nivel ridicat
 De obicei: generarea unei implementări Implementare
pornind de la un model
pornind de la un model
 Exemple: de la modelul de date la codul sursă, de la DSL la codul sursă
Reverse Engineering
 Recuperarea informaţiilor de nivel înalt despre Model
un sistem pornind de la informaţia de nivel
scăzut
Implementare
 De obicei: de la implementare la model
 Exemple:
Exemple: modelul de date pornind de la codul sursă, codul sursă din
modelul de date pornind de la codul sursă codul sursă din
executabilul binar, modelul de date pornind de la o bază de date,
documentarea unui “legacy code”
R E i
Re‐Engineering şi Round‐Trip Engineering
i iR dTi E i i
Re Engineering
Re‐Engineering
Model
 Modificarea unui sistem existent aplicând
întâi procesul de reverse engineering pentru
întâi procesul de reverse engineering pentru
Implementare
aflarea de informaţii
 Folosirea
Folosirea informaţiei obţinută pentru aplicarea de modificări şi
informaţiei obţinută pentru aplicarea de modificări şi
efectuarea procesului de forward engineering
Round‐Trip Engineering
 Lucrul simultan cu două reprezentări diferite; switching între ele
 Modificările efectuate într‐o reprezentare duc la modificări
corespunzătoare în cealaltă şi vice‐versa; ambele direcţii
Instrumente Meta‐CASE
Instrumente Meta CASE
 Idea: un instrument pentru crearea de instrumente CASE
 Multe instrumente de modelare CASE folosind grafuri 2D pentru vizualizare,
b
bazate pe noduri şi muchii
d i i hii
 Variază formele, etichetele, conexiunile permise, etc.
 Folosirea similitudinilor pentru specificarea generică a unui instrument:
Folosirea similitudinilor pentru specificarea generică a unui instrument:
1. Specificarea modelului de date
2. Specificarea modului în care elementele de date sunt reprezentate în
graful 2D
graful 2D
 E.g. MetaEdit+, Pounamu, Eclipse GMF
String
g
1 name
Classname
Class
1 1
Association
Modelarea Interfeţelor cu Utilizatorii
U I
User Interfaces (UIs)
f (UI )
 Interfeţele utilizator sunt interfeţele între oameni şi calculatoare
Intrare: “Cum vorbeşte utilizatorul cu sistemul?“
ş
Ieşire: “Cum vorbeşte sistemul cu utilizatorul?“
De‐a lungul timpului intrarea şi ieşirea formează interacţiunea dintre om şi
calculator (HCI=Human‐Computer Interaction)
 UI‐ul reprezintă o parte critică a sistemului
Funcţionalitatea e nefolositoare dacă utilizatorii nu ştiu cum să o folosească
Utilizatorii nu vor folosi un sistem greu de manevrat
 Câteva aspecte ale utilizabilităţii (conform lui Jakob Nielsen, www.useit.com)
Uşurinţa de învăţare (e.g. Navigare intuitivă)
Eficienţa folosirii
Memorabilitatea
Erori puţine şi ne‐catastrofice
Satisfacţia subiectivă
Cum construim UI corecte ASAP?

Instrumente pentru construcția interfețelor utilizator
 Calitate crescută pentru interfețele rezultat
Ideile pot fi ușor prototipate și implementate
Ușor de introdus modificări
 Codul UI mai ușor de întreținut
Costuri mici pentru învățarea folosirii
Costuri mici pentru învățarea folosirii
Mai puțin cod de scris
Di
Diagrame Ecran
E
 Idea: feed‐back timpuriu din partea utilizatorilor
 Folosirea de modele pentru discuţii privind UI‐ul cu utilizatorii
 Diagramele ecran reprezintă un model simplu informal pentru UI‐uri
1.Se desenează ecrane prototip ale sistemului ce arată ca ecranele reale, cu date
reale (detaliile grafice în acest moment nu sunt importante)
2 Se desenează săgeţi de la controalele unui ecran la ecranele ce urmează atunci
2.Se desenează săgeţi de la controalele unui ecran la ecranele ce urmează atunci
când respectivul control este folosit (e.g. button click)
3.Dacă mai multe ecrane sunt conectate la un acelaşi cotrol se inserează un
dreptunghi negru, având semnificaţia de ramuri condiţionate
Exemplu de Diagramă Ecran: Instrument de Administrare

Exemplu de Diagramă Ecran: Instrument de Administrare
Categories Links
Animals Rugby
Sports Sailing
School Soccer
Add Change Delete Add Change Delete
Delete Rugby ??
Cancel Delete
Add Link Change Rugby
Name Name Rugby
URL URL www.allblacks.com
Picture Picture C:\Docs\allblack.jpg
Add Change 32
Cli k D
Click Dummies
i
 Aducerea unor diagrame ecran la viaţă:
Machetă UI / Prototip UI / “click dummies”
h ă / /“ l kd ”
Utilizatorul poate naviga între ecrane
Utilizatorul poate vedea cum sunt realizate intrările & ieşirile de
Utilizatorul poate vedea cum sunt realizate intrările & ieşirile de
către sistem
Utilizatorul poate să‐şi imagineze comportamentul sistemului real
 Foarte restrictive dar şi foarte uşor de creat
Nu au implementate funcţionalităţi
Toate datele sunt doar ipotetice
 Adecvate pentru testarea timpurie din partea utilizatorului
p p p
& feedback!!!
Ierarhia de Conţinut
Ierarhia de Conţinut
 Ierarhia în care controalele unei Graphical User Interface (GUI) sunt imbricate
 Nu toate controalele sunt vizibile; adesea folosim containere invizibile interne
Nu toate controalele sunt vizibile; adesea folosim containere invizibile interne
 E.g. pentru Java Swing:
topLevelContainer:
topLevelContainer
JFrame or JDialog or JApplet
rootPane:
JRootPane
glassPane: layeredPane:
java.awt.Component JLayeredPane
contentPane: menuBar (optional):

java.awt.Container JMenuBar
Instrumente UI
 Componente ale unui sistem UI:
Aplicatie
Instrumente de nivel înalt
Toolkit
Sistem de gestiune a ferestrelor
Sistem de operare
 Sistemul de gestiune a ferestrelor:
Pachete software ce ajută utilizatorii să monitorizeze și controleze
diverse contexte prin separarea lor fizică în părți ale ecranului
Sistemul de gestiune a ferestrelor
ld f l
Nivelul Interfeței Manager de

Prezentare Comenzi
cu Utilizatorul ferestre
Nivelul de bază
Model ieșire Model intrare Sistemul de
ferestre
 Sistemul de ferestre: rutine de bază
Afișează grafica (ieșire)
Acces la dispozitivele de intrare
Acces la dispozitivele de intrare
 Managerul de ferestre: aspectele vizibile pentru utilizator
Prezentare:
Prezentare: stilul ferestrelor
stilul ferestrelor
Comenzi: cum manipulează utilizatorul ferestrele
Exemple gestiune ferestre:
l f
 Overlapping
 Tiles
Toolkit
lk
Application
pp
Toolkit
Operating System
 Librărie de instrumente/mecanisme pentru interacțiunea cu
utilizatorul (widgets) folosite de aplicații
Includ meniuri butoane scrollbar uri ferestre de dialog etc
Includ meniuri, butoane, scrollbar‐uri, ferestre de dialog, etc.
Instrumente de nivel
Instrumente de nivel
înalt Application
Toolkit
Operating System
 Toolkit‐urile sunt greu de folosit
Instrumentele de nivel înalt automatizează procesul de dezvoltare UI
 Componente pentru proiectare UI
 Componente run‐time: end‐user
 Componente pentru evaluare și depanare
Instrumente pentru UI
 MVC:
Model arhitectural ce izolează logica de business de interfața
utilizator
Modularizare
Model: date
View: elementele UI
Controller: manipularea datelor
E
Exemplu: arhitectura unei aplicații Web
l hi i li ii W b
Visual Editor pentru
p Eclipse
p
C
Crearea unui
i Frame
F
1. Se adaugă o “Visual Class” în proiect folosind
funcţia din meniu “New
funcţia din meniu New Java
Java Class
Class”
1
2. Se alege un pachet, un nume şi stilul 2
“Swing Frame”;
“S i F ”
pentru ferestre execuabile se verifică:
3
3. Pentru plasarea liberă a controalelor:
Pentru plasarea liberă a controalelor:
click în interiorul ferestrei pentru a selecta 3
jContentPane & se dezactivează managerul de
layout prin setarea lui pe null
layout prin setarea lui pe null
4. Pentru adaptarea ferestrei la redimensionare:
selectare jjContentPane al Frame‐ului
(e.g. în panelul JavaBeans) & setarea layout
manager‐ului ca GridBagLayout 4 43
Interfaţa Utilizator a Visual Editor

Interfaţa Utilizator a Visual Editor
Paleta de
controale
GUI
Editor
Vizual GUI
Round-Trip
Engineering
Codul
C d l sursă
ă all
GUI
Proprietăţile Ierarhia
controlului de
selectat
l t t conţinut
ţi t
E
Event Handlers
H dl
 Atunci când utilizatorul efectuază o acţiune (click, mişcare mouse, apăsare
, ) p
tastă, etc) este creat un obiect de tip eveniment
 Gestionarul de evenimente:
Metodă ce este apelată atunci când se produce un anumit eveniment
 În Java:
În Java:
Gestionarul de evenimente este o metodă a unui obiect de tip “event listener”
Pentru fiecare tip de eveniment se foloseşte o metodă particulară a unui event
listener particular
Se setează corespunzător gestionarele de evenimente având metode setter
dedicate în interiorul controlului
jButton.addActionListener(
new j
java.awt.event.ActionListener()
() {
public void actionPerformed(
java.awt.event.ActionEvent e)
{
System.out.println("You
y p ( clicked me!!!");
);
}
});
Setarea de Event Handlers
Evenimentul “Close” pentru un frame:
1. Se selectează frame‐ul
2. Setare proprietatea
p p
defaultCloseOperation la valoarea DISPOSE sau EXIT în panelul de
proprietăţi
Evenimentul “Click” pentru un buton:
1. g c c pe bu o , se ec a e
Right‐click pe buton, selectare
events‐>actionPeformed
2. Se scrie codul pentru handler:
Deschiderea şi Închiderea unor Frame
Deschiderea şi Închiderea unor Frame‐uri
uri odată
odată
cu evenimentul de Button Click
Codul pentru deschiderea unui frame
pentru deschiderea unui frame nou:
Frame2 f2 = new Frame2();
f2.setVisible(true);
Codul pentru închiderea unui frame:
p
// get event source
// and dispose its JFrame
((JFrame)
((java.awt.Component)e.getSource()) // get button
.getParent() // get contentPane
.getParent() // get JLayeredPane
.getParent() // get JRootPane
g ()) // g
.getParent()) get JFrame
.dispose();
Sumar
 Există diferite nivele ale modelelor de date:
metamodele modele şi instanţe ale modelelor
metamodele, modele şi instanţe ale modelelor
 Domain Specific Languages (DSLs) sunt limbaje pentru modelarea
unor domenii particulare
 Modelele sunt importante pentru forward şi reverse engineering,
re‐engineering şi round‐trip engineering
 Instrumentele Meta‐CASE suportă crearea de instrumente
grafice de modelare
 Diagramele ecran ilustrează interfeţele utilizator ale unui sistem
 “Click dummies” pot fi folosite pentru obţinerea de feed‐back
timpuriu din partea utilizatorului
timpuriu din partea utilizatorului

pr4 PDF

Încărcat de

Informații document

Titlu original

Drepturi de autor

Formate disponibile

Partajați acest document

Partajați sau inserați document

Opțiuni de partajare

Vi se pare util acest document?

Este necorespunzător acest conținut?

Drepturi de autor:

Formate disponibile

pr4 PDF

Încărcat de

Drepturi de autor:

Formate disponibile

Platformă de e‐learning și curriculă

3 Instrumente pentru modelare

Toate modelele sunt greșite; unele

• Modele pentru interfeţe

• Modele ale codului sursă

Grafuri de apeluri, grafuri de

Conectarea claselor: Asocieri

1..* 0..* 0..* 1

Un curs este Un student Un pprofesor Un curs este

Analysis vs Design Model

Crearea Modelului de Analiză cu Dia

Metamodele Modele şi Instanţe de Modele

Domain Specific Languages (DSLs)

Cum construim UI corecte ASAP?

Instrumente pentru construcția interfețelor utilizator

Exemplu de Diagramă Ecran: Instrument de Administrare

Add Change Delete Add Change Delete

contentPane: menuBar (optional):

Instrumente de nivel înalt

Sistem de gestiune a ferestrelor

Nivelul Interfeței Manager de

Instrumente de nivel înalt

Sistem de gestiune a ferestrelor

Instrumente de nivel înalt

Sistem de gestiune a ferestrelor

Interfaţa Utilizator a Visual Editor

S-ar putea să vă placă și