curs 10 paradigma programarii vizuale
TRANSCRIPT
![Page 1: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/1.jpg)
Paradigma programarii vizuale
1
![Page 2: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/2.jpg)
De ce VPL?
Abordarea vizuala are aparent un grad mai scazut de abstractizare
Datorita cresterii complexitatii IT la oricenivel al econmie este necesara ca sioamenii mediu calificati
Sa poata folosi instrumente complexespecifice IT
sa poata face mici/medii ajustari care necesita si implicarea programarii intr-o anume masura
![Page 3: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/3.jpg)
b
a
22
22)( bababa
“Demonstratii fara cuvinte”
n
iin
112
2
Exemplu de schema de inductie
![Page 4: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/4.jpg)
Demonstratia diagrammatica a teoremei lui Pitagora (Circa 200 B.C.)
b
a
Gandire prin modificarea unor diagrame
![Page 5: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/5.jpg)
Diagrame in ingineria software
![Page 6: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/6.jpg)
Rafinarea analizei diagrammatice
A C
D
BA
BDC
DC
Se pot face demonstratii diagramatice si in cazul UML?
![Page 7: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/7.jpg)
AnimatiaAlgoritmilor
InterfataUtilizator
ProgramareaVizuala
LimbajeEnd user
Graficape Calculator
VizualizareStiintifica
Calcul Vizual
![Page 8: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/8.jpg)
Definitii ale Programarii vizualeMyers (1986): “Visual Programming” (VP) se
refera la orice sistem care permiteutilizatorului saspecifice/defineasca/dezvolte intr-o maniera multidimensionala (minim douadimensiuni)
Limbajele de programare in mod text suntconsiderate monodimensionale deoarececompilatorul/ interpretorul realizeazaprocesarea unui flux de informatii unic (deciuni-dimensional)
8
![Page 9: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/9.jpg)
Golin & Reis (1990)
Un limbaj vizual manipuleazainformatie vizuala sau suportainteractiune vizuala sau permiteprogramarea folosond expresii vizuale
Crimi, 1990
Un limbaj vizual modeleaza un sistem de icoane. Acesta consta intr-un aranjamentspatial de elemente grafice elementare
Definitii ale Programarii vizuale
![Page 10: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/10.jpg)
Burnett (1999): Reia definitia anteioara(similara cu alui Meyers) si spune ca VP esteprogramarea in care mai multedimensiuni sunt folosite pentru a genera semantica asociata
Dimensiunile suplimentare se refera la
folosirea de obiecte multidimensionale(token) care vor alcatui expresiile vizuale
a relatiilor spatiale sau
a dimensiunii temporale pentru a specificarelatii semantice “before-after” semantic relationships.
![Page 11: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/11.jpg)
Propun un mediu de dezvoltare diferit pentruprocesul de programare
Calculul paralel este o consecinta imediat a multormodele de calcul vizuala
Avantaje
![Page 12: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/12.jpg)
Problema germana
NU se pot pune pe un ecran activ mai mult de 50 de primitive vizuale o data ( se rezolva partial dacase utilizeaza componentele compuse)
Exista cateva situati in care programareaclasica este superiora
Documentatia
Numele folosite in diferentierea elementelor de acelasi tip
Cea mai compacta forma de expresie a uni concept este matematica deci bazata pe o formul decitextuala
dezavantaje
![Page 13: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/13.jpg)
Clasificare generica dupa caracteristici dominante
13
![Page 14: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/14.jpg)
Sisteme timpurii: 1966-1980
o Ambit
o AutoProgrammer
o Plan2D
o Tinker
o Grail
o Query by Example
o Pygmalion
o Outline
Istoric limbaje
Sisteme vizuale: 1981-1990
ML-like VL
Pict
Formal
SmallStar
Hi-Visual
PC-Titles
ThingLab
ARK
o Prograph
o GAL
o PIGS
o Show and Tell
o Tinker Toy
o C^2
o SunPICT
o NoPumpG
![Page 15: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/15.jpg)
o Cube
o Cantata
o Hence 1.4
o SchemePaint
o CODE 2.0
o Iconicode
o Viasvis
o MViews
o Forms/3
o AVS
o Mondrian
o ChemTrains
o HyperPascal
o Vampire
o VIPR
o SPE
Sisteme moderne: 1991-
Istoric
![Page 16: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/16.jpg)
Clasificarea lui Meyers in 1986
Orice nu e prog. Prin ex. Programare prin exemplu
Batch Interactiv Batch Interactiv
Non-
VP
Toate limbajele
conventionale:
Pascal, Fortran,
etc.
LISP, APL, etc.
Non-
VP
Perechi
I/O*
Tinker
VP
Grail
AMBIT/G/L
Query by Example
FORMAL
GAL
Graphical Program
Editor
PIGS
Piet
PROGRAPH
State Transition
UIMS
VP
traces* AutoProgrammer*
Pygmalion
Graphical Thinglab
SmallStar
Rehearsal World
![Page 17: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/17.jpg)
Chang/Shu clasificare spatiala
![Page 18: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/18.jpg)
Burnett, 1994 — cercetare empiricaVPL: Visual Programming LanguagesVPL-I. Environments and Tools for VPLsVPL-II. Language ClassificationsA. Paradigms
1. Concurrent languages2. Constraint-based languages3. Data-flow languages4. Form-based and spreadsheed-based
languages5. Functional languages6. Imperative languages7. Logic languages8. Multi-paradigm languages9. Object-oriented languages10. Programming-by-demonstration
languages11. Rule-based languages
B. Visual representations1. Diagrammatic languages2. Iconic languages3. Languages based on static pictorial
sequences
VPL-III. Language FeaturesA. Abstraction
1. Data abstraction2. Procedural abstraction
B. Control flowC. Data types and structuresD. DocumentationE. Event handlingF. Exception handling
VPL-IV. Language Implementation IssuesA. Computational approaches (e.g.
demand-driven, data-driven)B. EfficiencyC. ParsingD. Translators (interpreters and compilersVPL-V. Language PurposeA. General-purpose languagesB. Database languagesC. Image-processing languagesD. Scientific visualization languagesE. User-interface generation languagesVPL-VI. Theory of VPLsA. Formal definition of VPLsB. Icon theoryC. Language design issues
1. Cognitive and user-interface designissues (e.g. usability studies,graphical perception)
2. Effective use of screen real estate3. Liveness4. Scope5. Type checking and type theory6. Visual representation issues (e.g.
static representation, animation)
18
![Page 19: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/19.jpg)
Cam ar fi necesara o noua clasificare!O. Nierstrasz propune in 2008 o serie de intrebari
la care trebuie raspuns pentru a genera o nouaclasificare a VPL in accord cu ultimile evolutii ale doemeniului si anume:
1. Care sunt elementele vizuale?
> Iconite, grafuri, tabele, forme …
2. Care este domeniul de aplicare?
> Simulare, jocuri, animatie, modelare, compunereacomponentelor, algoritmi …
3. Ce paradigma(e) este (sunt) suportate?
> PBE, constrageri, dataflow, compunere de tile, componente si connectori, transformari pe graf, reprezentari n-dimensionale, …
![Page 20: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/20.jpg)
Limbaje vizuale pureProgramatorul manipuleaza numai icoane
pentru a crea programul
Programul este depanat si executat in acelasimediu
Programul este compilat direct din reprezentarea lui vizuala
Clasificari
![Page 21: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/21.jpg)
Clasificari
Sisteme text hibride si vizuale (nu suntVPL).Exista doua forme:
1. Sistemele in care programele sunt create vizual si apoitraduse intr-un limbaj text de nivel inalt
Exemplu: Rehearsal World
2. Sistemele in care se folosesc elemente grafice intr-un limbajtext.
(Erwig & Schneider, 2000).– au dezvoltat extensii la limbajele C si CPP care permit programatorilor sa amestececodul cu diagrame
![Page 22: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/22.jpg)
ClasificariSisteme de programare prin exempleSe bazeaza pe idea “invatarii” sistemului cum sa execute un task (ex. Rehearsal World, Pygmalion)
Sisteme orientate pe constrangeriUN programator modeleaza obiecte fizice intr-un mediuvizual care este supus la o serie de constrangeri in scopulmimarii comportamentelui legilor naturii
ex. ThingLab, ARK
Sisteme bazate pe formeFolosest un model de tip foaie de calcul tabelar
ex. Forms/3, NoPumpG
![Page 23: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/23.jpg)
SE refera la sistemele de animatie a algoritmilor pe care unii autori nu ii considera a avea legatura cu VPL. Acestea ofera afisarea vizuala executiei programelor
Un exemplu ar fi Balsa-II care este un sistem de sine statator specific Macintosh.
Balsa pentru calea cea mai scurta - Dijkstra
“Orfani” VPL
![Page 24: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/24.jpg)
Categorii de VPL pure
1. Diagrammatic
2. Iconic
3. Programarea bazata pe forme
24
![Page 25: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/25.jpg)
Diagrammatic Sunt sisteme bazate pe descrierea abstracta a
relatiilor intre obiecte
Exemple:
Limbaje de proiectare a bazelor de date:
diagrama entitate relatie.
Limbaje pentru programarea Data-flow
(de ex. cu retele Petri ).
Limbaje pentru controlul fluxului
Specificarea starilor si a tranzitiilor (automat).
![Page 26: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/26.jpg)
Iconic Sunt bazate pe teoria icoanelor (Chang, 1987).
O Icoana reprezinta un obiect care are o reprezentare duala:
O parte logica (intelesul – formal/abstract)
O parte fizica (imaginea asociata )
Sistemele de icoane sunt structurate ca un set de realtii intre acestea.
![Page 27: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/27.jpg)
Programarea bazata pe formeA imprumutat maniera de
reprezentare/vizualizare precum simetoda/modelul de programare din calculultabelar
In acest caz programarea este vazuta ca modificarea uni grup de celuleinterconectate de-a lungul timpului
Exemplu: Forms/3
![Page 28: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/28.jpg)
Paradigme ale programarii vizuale•Programarea Dataflow
Nodurile descriu operatii, arcele orientate reprezinta fluxurile de informatii idntre noduri
•Programarea vizuala vazata pe reguliBazele: Implicatia logica
“daca faptul A se adeverste, atunci si B se adevereste”sau reguli ale sistemelor de productie
“daca situatia A apare atunci fa actiunea B”•Programarea functionalaBazele: functii matematice (fara side-effects(gen I/O direct))
programul este de forma (lambda calcul) f1(f2(f3(... (input) ...)))
![Page 29: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/29.jpg)
Strategii de proiectare in VPL
Concreta:
Directa:
Explicita:
Feedback
![Page 30: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/30.jpg)
Programarea functionala vizualaCLARITY
![Page 31: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/31.jpg)
Visual Production SystemsFolosit pentru implementarea calcule care lucreaza direct cu picturi
BITPICT: un sistem pentru a rationa numai prin transformareadiagramelor
![Page 32: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/32.jpg)
Programarea prin exemple (PBE)• A inceput cu Pygmalion
dar continua si la oraactuala numai ca granintaintre PBE si VPL este maigreu de definit in unelecazuri
• Pygmalion a fost un sistem timpuriu care permitea programatorilorsa demostreze intercativmaniera de calcul al uneifunctii.
![Page 33: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/33.jpg)
ARK — Alternate Reality Kit
![Page 34: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/34.jpg)
Fabrik — este un dataflow bidirectional
![Page 35: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/35.jpg)
Limbaj pentru descriere arhitecturala - ADL
![Page 36: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/36.jpg)
ADL – VPL - Vista — limbaj vizual de scripting
![Page 37: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/37.jpg)
Programarea bazata pe constrangeri Pictorial Janus
Janus un limbaj de programare introdusde Kahn in 90. •Pictorial Janus este construit pesteJanus este•Complet vizual•Nu are text de loc•Este invariant topologic •Executie animata
![Page 38: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/38.jpg)
Basics Pictorial Janus
A fost gandit pentru agenti deci:• Programele sunt retele de agenti care comunica prin
canale si proceseaza datele de intrare• Mesajele se schimba prin canale• Cand un agent primeste date el isi va verifica
preconditiile si va incepe procesarea daca acesteasunt indeplinite
• Un agent poate combina sau partitiona datele sitrimite rezultatele la alti agenti
• Agentii pot lucra concurrent
![Page 39: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/39.jpg)
Sintaxa grafica a lui Pictorial Janus
abcList ([a,b,c | [])
![Page 40: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/40.jpg)
PJ Exemplu: append([],[a],X)
![Page 41: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/41.jpg)
Ecivalente Pictorial Janus
![Page 42: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/42.jpg)
ThingLab — graphical constraints
ThingLab este alt sistem implementat in Smalltalk
![Page 43: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/43.jpg)
int Factorial(int n)
{
if(n > 0) return (n*factorial(n-1));
else
return (1);
}
CUBE pur VPL
![Page 44: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/44.jpg)
Forms/3 VPL purForms/3 este un limbaj tip calcul tabelar –
dar si VPL pur.
Paradigma calculului tabelar este un subset al paradigmei programarii functionale
Programarea functionala este dificila pentrumajoritatea programatorilor
Paradigma calculului tabelar desi are nistelimitari este mult mai usor adoptata de programatori
Forms/3 este un limbaj care elimina o seriede limitari ale paradigmei de calcul tabelar
![Page 45: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/45.jpg)
DirectivitateaDirectivitatea inseamna implementarea
unui vocabular in stransa legatura cu taskuldescris de acesta
Immediate visual feedback Raspunsul vizual imediat se refera la transmiterea
pe ecran (afisarea) oricarei, modificari semanticesi este implementat prin intermediul unui evaluaricontinue.
![Page 46: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/46.jpg)
Forms/3 Example
![Page 47: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/47.jpg)
VIPR VPL pur Visual Imperative Programming
Dezvoltat la University din Colorado
![Page 48: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/48.jpg)
![Page 49: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/49.jpg)
![Page 50: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/50.jpg)
Prograph — grafuri dataflow –VPL pur
Prograph este un limbaj dataflow orientat obiectA fost produs in 1990. Acum a fost reluat ca Andescotia“Marten” pentru Mac OSX.
![Page 51: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/51.jpg)
Componente Prograph Sectiunile
Similare cu pachetele Java
Clase Atribute/metode
Suport pentru mosteniresimpla
Metode Baza pentru control
executiei
Operatii Componente executabile
de baza
Au intrari si iesiri
Root
Terminal
![Page 52: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/52.jpg)
Exemplu HelloWorld
Operatii
Carcasametodei
metoda sort pentru sortare topologica
![Page 53: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/53.jpg)
Sunt atasate unei operatii pentru a controla executiaControale
Control urmatoarea functie
![Page 54: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/54.jpg)
visual data flow language LabView VPL purUn alt limbaj tip dataflow, similar cu Prograf, dezvoltat de National Instruments.
![Page 55: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/55.jpg)
Exemplul 2 de interfata LabView
![Page 56: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/56.jpg)
Front PanelControls = InputsIndicators = Outputs
Block DiagramProgramul care este in
spatele elementelor graficedin front panel
Componentele sunt conectateimpreuna
Programele LabVIEW se numesc instrumente virtuale
![Page 57: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/57.jpg)
ControlBoolean
IndicatorDublu
Grafic forma De unda
Panel ToolbarExemplu de Front Panel al unui intrument virtual
![Page 58: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/58.jpg)
Diagrama bloc pentru un instrument virtual
Constanta Numerica
Terminal termometruApel
subVI
Bucla While
KnobTerminal
Terminal ptButon de Stop
Terminal oprireBucla
GraficTemperatura
![Page 59: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/59.jpg)
Seturile de functii si controale
Seturi de controale
Folosite pentru
a pune controalele siindicatoarele pe panoulfrontal sau
Pentru a crea daigramelebloc
Setul de Controale(Panel Window)
Setul de functii(Diagram Window)
![Page 60: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/60.jpg)
Operating Tool
Positioning/Resizing Tool
Labeling Tool (etichete)
Wiring Tool (fire)
Shortcut Menu Tool
• Este folosita pentru a opera si modifica panoulfrontal si diagramele bloc.
Scrolling Tool
Breakpoint Tool
Probe Tool
Color Copy Tool
Coloring Tool
Paleta de instrumente
Automatic Selection Tool
![Page 61: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/61.jpg)
Lansare in executie
Executie Continua
Oprire Executie
Buton de Pauza/Continuare
Setari Text
Aliniere Obiecte
Distribuie Obiecte
Reordonare
Lumineaza in timpulexecutiei
Step Into
Step Over
Step Out
Butoane suplimentare
Bara de stare
![Page 62: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/62.jpg)
TerminaleDe control
Fereastra diagrama bloc
Front Panel Window
Terminaleindicator
Crearea unui instrument virtual VI
![Page 63: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/63.jpg)
Crearea unui Block Diagram pentru VI
Dupa ce se creaza controalele si indicatoareledin Front Panel se va comuta catre Block Diagram cu combinatia <Ctrl-E>
Se vor muta obiectele din Front Panel catrelocatiile dorite folsind tool-ul de Position/Size/Select
Se vor plasa functiile pe diagrama
Se vor conecta terminalele corespunzatoarepentru a definitiva schema
![Page 64: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/64.jpg)
Detalii pentru conectarea blocurilor
Conectarea “Hot Spot” Click pentru a selecta firele
• Cand se traseaza fir pe el va fi o eticheta galbena care va spune ce ciruit/pin/terminal se conecteaza
• Cand se trece cu firul peste un terminal el va palpaipentru a ajuta conectarea daca e cel dorit
![Page 65: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/65.jpg)
• Right-clicking sau Escape in timpul conectarii vaabandona operatia
Culorile firelor vor fi automat stabilite de Labview functiede tipul elementelor conectate
Conectarea automata a firelor
LabVIEW va realiza conectarea automata a obiectelor pemasura ce obiectele sunt plasate in diagrama block.
65
Click in timp ce se traseaza conexiuneapentru a o lua in jos cu firulSpacebar va schimba orientarea firelor
![Page 66: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/66.jpg)
Programare Dataflow• Block diagram NU se executa de la stanga la
dreapta
• Nodul se executa numai cand datele suntdisponibile la toate circuitele de intrare
• Nodeul va trimite rezultatele pe toate iesirile o data ce a terminat de efectuat calculele
![Page 67: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/67.jpg)
Depanarea
• Gasirea erori
• Executie pas cu pas
• Probe – informatii depanare
Click pe buton de run cu sageata rupta va conduce la afisarea erorilor
Prin apasarea pe Execution Highlighting dataflow va fi animat folosind bule iar valorilevor fi afisate pe fire.
Right-click pe un fir va afisa toate informatiiledespre datele care trec prin acel firSau se poate selecta Probe tool din paleta si se face click pe fir
![Page 68: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/68.jpg)
68
![Page 69: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/69.jpg)
![Page 70: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/70.jpg)
![Page 71: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/71.jpg)
![Page 72: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/72.jpg)
![Page 73: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/73.jpg)
![Page 74: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/74.jpg)
LIMBAJE VIZUALE hibride
DE ULTIMA ORA
74
![Page 75: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/75.jpg)
OSX Automator
![Page 76: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/76.jpg)
Naked Objects — visual domain objects
… se pot genera atat nivelul de persistenta cat si UI pornind de la obiectele domeniu.
In loc sa se codeze manual toate cele 4 straturi
![Page 77: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/77.jpg)
Subtext
Idea de baza
DECIZIELogicaSemanita:Algebra BooleanaPrezentare: coloane partitionate
SE VA REALIZACalculSemantica: graf de functiiPrezentarea arbore de acoperire
![Page 78: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/78.jpg)
AGG — graph transformation rules
AGG este un limbaj vizual bazat pe reguli care suporta o abordare algebrica pentru tratarea grafurilor
![Page 79: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/79.jpg)
Yahoo Pipes — mashup dataflowPermite creare de aplicatii web prin compunerea de pipes si filters
![Page 80: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/80.jpg)
EToys — programare bazata pe pietre
Simulator de programe create prin compunerea de pietricele-“tiles”
![Page 81: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/81.jpg)
Automat in EToys
1. Deschide catalog de obiecteConnectors
2. Cloneaza un “Pin”
Redenumeste-l Stare State
Defineste scripturile “turnOn” si“turnOff” pentru a seta culoarea
3. Conecteaza 2 State
4. Defineste script pentru “click”
5. Creati butoane pentru Starile On si Off precum si pentru conectori
6. Pune butoanele intr-o bara butoane
![Page 82: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/82.jpg)
Analiza EToysPro
Model si GUI unificat
Compunere pietre
Instrumente multiple (holders, connectors …)
Bazat pe prototip
(incurajeazadescoperirea)
Variabileles suntintroduse prin exemple
Genereaza Smalltalk in spate
Foarte expresiv)
Contra
Greu de extins cu Smalltalk
Este limitat de evenimente
Fara matrici
Proiectele inca au modelulSqueak 3.0
Fara expresii aritmetice
Fara depanare
Menu-urile sunt uneorineclare
Scripturile nu pot intoarce o valoare
No comment
Etoys vs. Squeak
![Page 83: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/83.jpg)
Scratch
![Page 84: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/84.jpg)
1. Incarcare joc
2. Selecteaza din “Games”
3. SelecteazaAmonBoxingca jocul de jucat
4. Citesteinstructiunile
5. Joaca!
Exemplu
![Page 85: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/85.jpg)
Squeakland — Squeak pentru educatori
![Page 86: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/86.jpg)
Modificarea/transformarea Obiectelor in Squeak
Catalogobiecte
Diverse optiuni
Un morph cu “handles”
![Page 87: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/87.jpg)
In limbaj pentru crearea de aplicatii creat pentruincepatori
Trebuie sa fii conectat si la contul de gooagl’
Are doua mari module
Designer - proiectare
Blocks Editor – editare blocuri
App Inventor
![Page 88: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/88.jpg)
App Inventor: Designer
Proiectarea UI al aplicatie!
![Page 89: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/89.jpg)
App Inventor: Blocks Editor
Programarea functionalitatilor aplicatiei!
![Page 90: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/90.jpg)
An App Inventor App
![Page 91: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/91.jpg)
Blockly
A fost lansat de “Goagle” in 2012.
91
![Page 92: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/92.jpg)
SEAL
92
![Page 93: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/93.jpg)
Arhitectura sistemului
93
![Page 94: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/94.jpg)
Listener application in SEAL-Blockly
94
![Page 95: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/95.jpg)
BlocklyDuino
VPL pentru Arduino. Suporta blocuri grove
95
![Page 96: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/96.jpg)
BlocklyDuino – descriere blocuri in XML<xml xmlns="http://www.w3.org/1999/xhtml"><block type="inout_buildin_led" x="18" y="17"><title name="STAT">HIGH</title><next><block type="base_delay" inline="true"><value name="DELAY_TIME"><block type="math_number"><title name="NUM">1000</title>
</block></value><next><block type="inout_buildin_led"><title name="STAT">LOW</title><next><block type="base_delay" inline="true"><value name="DELAY_TIME"><block type="math_number"><title name="NUM">1000</title>
</block></value><next><block type="grove_motor_shield"><title name="DIRECTION">forward</title>
</block></next>
</block></next>
</block></next>
</block></next>
</block>
<block type="grove_serial_lcd_print" inline="false" x="-7" y="-13">
<title name="PIN">1</title><value name="TEXT"><block type="text"><title name="TEXT">test anul 2</title>
</block></value><value name="TEXT2"><block type="variables_get"><title name="VAR">out1</title>
</block></value><value name="DELAY_TIME"><block type="math_arithmetic" inline="true"><title name="OP">ADD</title><value name="A"><block type="variables_get"><title name="VAR">in2</title>
</block></value><value name="B"><block type="variables_get"><title name="VAR">in2</title>
</block></value>
</block></value>
</block> </xml>
96
![Page 97: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/97.jpg)
Referinte http://www.infoq.com/presentations/BPMN-2Visual-
Language Myers, “Visual programming, programming by example, and program
visualization: a taxonomy,” SIGCHI Bull., 1986. http://dx.doi.org/10.1145/22339.22349
Chang, “Visual languages: a tutorial and survey”, IEEE Software, 1987. http://dx.doi.org/10.1109/MS.1987.229792
Burnett and Baker, “A Classification System for Visual Programming Languages,” Journal of Visual Languages and Computing, 1994. ftp://ftp.cs.orst.edu/pub/burnett/VPLclassification.JVLC.Sept94.pdf
Boshernitsan and Downes, “Visual Programming Languages: A Survey”, TR UCB/CSD-04-1368, December 1997. http://nitsan.org/~maratb/pubs/csd-04-1368.pdf
Burnett, “Visual Programming,” Encyclopedia of Electrical and Electronics Engineering, 1999. ftp://ftp.cs.orst.edu/pub/burnett/whatIsVP.pdf
ARVIND & CULLER,D.E. 1986. Dataflow architectures.Ann. Rev. Comput. Sci. 1,225–253.
97
![Page 98: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/98.jpg)
Referinte David Canfield Smith, “Pygmalion: a creative programming environment,” Ph.D.
thesis, Stanford University, Stanford, CA, USA, 1975. Allen Cypher, et al. (Eds.), Watch what I do: programming by demonstration, MIT
Press, Cambridge, MA, USA, 1993. Randall B. Smith, “Experiences with the alternate reality kit: an example of the
tension between literalism and magic,” 1987. Alan Borning, Thinglab — constraint-oriented simulation laboratory, Ph.D. thesis,
Stanford University, Stanford, CA, USA, 1979. Dan Ingalls, “Fabrik: A Visual Programming Environment,” Proceedings OOPSLA
'88, ACM SIGPLAN Notices, vol. 23, November 1988, pp. 176-190. Mary Shaw and David Garlan, Software Architecture: Perspectives on an Emerging
Discipline, Prentice-Hall, 1996.
www.cs.cmu.edu/~acme/docs/language_overview.html www.mactech.com/articles/mactech/Vol.10/10.11/PrographCPXTutorial/
http://www.jopera.org/files/jopera_mashup07.pdf http://pipes.yahoo.com/pipes/ http://www.seeedstudio.com/wiki/GROVE_System Eric J. Golin, Steven P. Reiss: The Specification of Visual Language Syntax; in JVLC, Vol. 1,
No. 2, 141-157; auch in Glinert [90-A&I], 512-517
http://geoanalytics.net/GeoVis08/a23.pdf www.emergent.de/pub/smalltalk/squeak/projects/EtoysLecture.pr
98
![Page 99: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/99.jpg)
Referinte Johnston, W.M.; Hanna, J.R.P. and Millar, R.J. (2004). "Advances in dataflow
programming languages" ACM Computing Surveys 36 (1): 1–34. doi:10.1145/1013208.1013209
https://www.iam.unibe.ch/scg/svn_repos/Lectures/ProgrammingLanguages/12VisualProgramming.ppt
Ivan Edward Sutherland, Sketchpad: A man-machine graphical communication system,
Ph.D. thesis, MIT, January 1963. www.cl.cam.ac.uk/techreports/UCAM-CL-TR-574.pdf
http://www.i3s.unice.fr/~mosser/_media/research/iawtic08.pdf
http://www.apple.com/macosx/features/automator/ www.nakedobjects.org Jonathan Edwards, “No ifs, ands, or buts: uncovering the simplicity of conditionals,”
OOPSLA 2007. http://subtextual.org/ Shi-Kuo Chang, “Visual languages: a tutorial and survey,” IEEE Software, 1987 Gaelli, et al., Idioms for Composing Games with EToys, C5 2006 ftp://ftp.cs.orst.edu/pub/burnett/VPLclassification.JVLC.Sept94.pdf
www.iam.unibe.ch/~scg/Teaching/CP/PetriNets http://web.engr.oregonstate.edu/~erwig/papers/
“LabVIEW Graphical Programming: Practical Applications in Instrumentation and Control” by Johnson Gary W., Gary W. Johnson. McGraw-Hill, 1997.
Kahn and Vijay A. Saraswat in "Actors as a special case of concurrent constraint (logic) programming", in SIGPLAN Notices, October 1990 99
![Page 100: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/100.jpg)
Referinte Crimi, C., A. Guercio, G. Pacini, G. Tortora, and M. Tucci, "Automating
Visual Language Generation," IEEE Transactions on Software Engineering, vol. 16, no. 10, pp. 1122-1135, October 1990
Margaret M. Burnett and Herkimer J. Gottfried. 1998. Graphical definitions: expanding spreadsheet languages through direct manipulation and gestures. ACM Trans. Comput.-Hum. Interact. 5, 1 (March 1998), 1-33.
http://www.cs.washington.edu/homes/jpower/vpl/vpl_home.html http://www.wi.leidenuniv.nl/CS/SEIS/vislang/VLcourse.html http://www-lsi.upc.es/~rbaeza/cursos/vp/todo.html http://www.cs.berkeley.edu/~maratb/cs263/ http://www.efd.lth.se/~d87man/EXJOBB/MSC.html http://www.ecs.soton.ac.uk/~tal00r/vlangs.html http://www.researchgate.net/publication/236132854_Demo_Abstract_SEAL-
Blockly_Sensor_Network_Visual_Programming_Using_a_Web_Browser/file/9c960516422aea7b94.pdf
http://www.schiffer.at/vp/html/liter.htm Erwig, M. & Schneider, M. (2000). Query-By-Trace: Visual Predicate
Specification in Spatio¬Temporal Databases. In Arisawa, H. and Catarci, T., editors, Advances in Visual Information Management - Visual Database Systems, pages 199-218. Kluwer Academic Publishers, Boston, MA.
http://www.ickn.org/elements/hyper/cyb105.htm http://www.clarity-support.com
100
![Page 101: Curs 10 Paradigma programarii vizuale](https://reader034.vdocumente.com/reader034/viewer/2022042507/588c7af31a28abe9208b9d29/html5/thumbnails/101.jpg)
Visually Programed Sensor Bee
101