Generating Editors for Direct Manipulation of Diagrams

Transcription

1 Generting Eitors for Diret Mnipultion of Digrms Gerhr Viehstet n Mrk Mins Lehrstuhl für Progrmmiersprhen Universität Erlngen-Nürnerg Mrtensstr. 3, Erlngen, Germny E-mil: fviehste,minsg@informtik.uni-erlngen.e Astrt. Digrms (e.g., trees for hierrhil strutures, or grphs for finite stte mhines) re often neee s prt of vne user interfes, n re frequently speifi to user s pplition. The implementtion of eitors for igrms shoul e supporte y tool n se on forml moel. This pper gives n overview of DiGen, our genertor for igrm eitors. An eitor for ertin kin of igrm is generte from speifition, whih inlues grmmr to esrie the struture of igrms. The user of igrm eitor, however, oes not hve to e onerne with the grmmr, ut n mnipulte igrms very onveniently y iret mnipultion. 1 Introution Toy s Grphil User Interfes (GUIs) re usully not very grphil, n ssessment lso me in reent CACM issue on GUIs [1]: Wht the mrket onsiers GUI is little more thn glorifie menu system, hving no grphis. This leves the grphil representtion of the pplition omin s n exerise for the eveloper, ::: More omplex strutures in the pplition omin n often e grphilly represente in n esily omprehensile wy y some kin of igrm. It is esirle to mke igrms prt of the user interfe n let user intertively eit them. These igrms my e ertin trees for epiting hierrhil reltionships, or grphs, e.g., for finite stte mhines. Nssi-Shneiermn igrms (NSDs) re nother lssil exmple [2]. We use the term igrm lss to refer to speifi kin of igrm. An eitor tilore to some igrm lss is lle igrm eitor. A igrm eitor is neee for supporting omplex eiting opertions n lyout. Furthermore, suh n eitor n ensure tht the igrms onstrute y the user hve vli struture, n thus re meningful. E.g., we my wnt to provie winow s prt of UI in whih the user n write simple progrms y rwing n NSD. Then only well-struture NSDs re meningful for the pplition. For the implementtion of igrm eitor, tool is neee in orer to reue the effort. Most user interfe tools provie no help for igrms. Some tools, e.g., Grnet [3], support simple kins of igrms. The struture of vli igrms, however, hs to e mintine y the progrmmer using Grnet n is more or less hien in the oe. There re only very few systems for generting igrm eitor tht re se on forml moel. Just onept for igrm eitors is presente in [4], ut genertor hs

2 not een relize. In the PAGG system [5] lyout of igrms is troulesome n eiting inonvenient. The Constrint system [6] uses grmmr moel se on onfree grmmrs n onstrints for utomti lyout of igrms. A isvntge is tht on-free grmmrs o not permit iret representtion of multiimensionl reltionships, s neee for the lyout of igrms. Furthermore, the eiting pilities re very restrite. DiGen, genertor for igrm eitors, will e outline in this pper. The nturl n onvenient wy of eiting will e illustrte in the next setion. Setion 3 gives n overview of the system. The grmmr moel for speifying the struture of igrms n lyout re the topi of Setion 3.1. User intertion with igrms will e riefly resse in Setion Diret Mnipultion A igrm eitor for Nssi-Shneiermn igrms (NSDs), whih ws generte with DiGen, serves for emonstrting iret mnipultion. An NSD minly onsists of lines n loks for sttements n onitions. These igrm elements n e selete in ifferent wys, whih re stte in the speifition n thus pte to the prtiulr eitor. For our smple eitor it hs een speifie tht susequent selete sttements (whih my e omplex) re utomtilly omine into single entity lle group. In Fig. 1 group of two susequent sttements is selete, whih is inite y the hnles. Fig. 1. Eiting stte with two NSDs. A group of two susequent sttements (onsisting of simple sttement n n if ) is selete in the lower NSD. Fig. 2. Sitution fter moving the group selete in Fig. 1 to the eginning of the while. As n exmple, we now wnt to remove this group from its position n insert it into the upper NSD s the first sttements of the while. Fig. 2 shows the result. One wy to

3 hieve this is to press the Cut-utton, n then selet the line immeitely elow the while s onition to inite the position for insertion. Finlly, the Insert-utton hs to e presse. This eiting style is solely se on seletion n pressing uttons or hoosing menu items. It is the only wy of eiting possile in igrm eitors whih n e generte with other tools like PAGG [5] or Constrints [6]. The onept is the sme s in the Synthesizer Genertor [7] for syntx-irete eiting. It is suffiient there, ut for igrms more nturl wy of eiting is esirle. With DiGen igrm eitors offering true iret mnipultion n e speifie. E.g., the moifition from Fig. 1 to Fig. 2 n lso e me y simply pressing the mouse utton while the mouse pointer is lote over the selete group, rgging this group to its estintion, n relesing the mouse utton over the line elow the while s onition. In the sme wy ny prt of igrm n e remove n inserte t ny other spot. A igrm prt n e me new NSD of its own in similr fshion y moving it roun n relesing the mouse utton outsie ny other NSD. Of ourse, n entire NSD n lso e inserte into nother igrm. A numer of other eiting opertions y iret mnipultion hve een speifie for the NSD eitor. E.g., the then-nelse-rnh of n if n e swithe y pressing the mouse utton over the if s tringle with y insie, rgging it to the right, n relesing it over the orresponing n (or the other wy roun). Another exmple of iret mnipultion is to hnge while into n until y moving the while s onition own to the en of the while n relesing the mouse utton there. Similrly, n until n e moifie into while. DiGen genertes igrm eitor for some igrm lss (e.g., NSDs) from speifition, whih onsists of the prts shown in Fig The Genertor DiGen A mjor prt is the grmmr for the igrm lss. Setion 3.1 will esrie smple grmmr. Some prtiulr igrm shown on the sreen is internlly represente in the igrm eitor y erivtion grph, whih is the min t struture (see Fig. 3). Lyout onitions re tthe to grmmr proutions in the speifition. They onstrin the vlues of lyout ttriutes n thus etermine igrm s lyout. The terminl symols in erivtion grph re mppe on the sreen. Their imge is ompose of primitive elements (lines,, et.) n lso prt of the speifition. The remining prts of igrm eitor s speifition in Fig. 3 re neee for user intertion. 3.1 Digrm ruture n Lyout A igrm lss, i.e., the syntti struture of igrms whih will e eite, is speifie y hypergrph grmmr. A hypergrph is generliztion of grph, in whih eges re hypereges, i.e., they n e onnete to ny (fixe) numer of noes [8]. Eh (hyper)ege hs type n numer of onnetion points tht etermine how mny noes the hyperege is onnete to. We sy the ege visits these noes. The fmilir

4 Digrm Eitor Groups Derivtion grph Lyout ttriutes Grphil interfe Grphil ojets Group efinition Digrm representtion n trnsformtion Constrint stisftion moules Intertion t ll t flow Group types Speifition Event utomt Grmmr n trnsformtions Lyout onitions Imge of terminl symols trget of speifition Fig. 3. Overview of igrm eitor generte with DiGen n its speifition. irete grph n e seen s hypergrph in whih ll (hyper)eges visit extly two noes. Con-free hypergrph grmmrs re nlogously efine s on-free (string) grmmrs n hve similr properties [9]. Terminl n nonterminl hypereges re use in hypergrph grmmrs inste of lphet symols in on-free string grmmrs. In ontrst to on-free string grmmrs, however, hypergrphs n represent multiimensionl reltionships iretly. Noes in hypergrph stn for points (e.g., in the plne), hypereges re igrm elements whose position is given y the noes eing visite y the ege. This is illustrte in Fig. 4, whih epits the hypergrph orresponing to the upper NSD in Fig. 1 (in slightly simplifie mnner). The representtion in the PAGG n Constrint systems [5, 6], whih o not use hypergrphs, woul e signifintly more omplite. Eh proution in on-free hypergrph grmmr onsists on its left hn sie (lhs) of hypergrph with single nonterminl ege n the noes visite, see Fig. 5. The lhs of proution P 1 is the strting grph of the grmmr. The right hn sie (rhs) of every proution is n ritrry hypergrph of terminl n nonterminl hypereges. Applition of proution to hypergrph is similr to on-free string grmmrs, too: if the lhs is sugrph of the hypergrph, this sugrph is remove n reple y the rhs. The resulting hypergrph is si to e erive from the first hypergrph. In

5 y on on n Fig. 4. Hypergrph orresponing to the upper NSD in Fig. 1. Noes re shown s lk irles. Lines,, on, y, n n re terminl hypereges. Lines hve rity 2, n on rity 4, y n n rity 3. P 1 P 2 NSD P 5.x = f.x.x = i.x.y = e.y =.y f.y = g.y f.x+0.5 = g.x h.x+0.5 = i.x f y e g Con h n i P 3 P 6 P 7 retngle(,,,).x+0.25 = e.x e Con e P 4 retngle(,,,).y-.y.h.x-.x.w retngle(,,,) stns for.x =.x.x =.x.y =.y.y =.y P 8 retngle(,,,).x+0.25 = e.x Con on retngle(,,,).y-.y on.h.x-.x on.w Con Fig. 5. Con-free hypergrph grmmr for NSDs. Terminl hypereges re the sme s in Fig. 4. Nonterminls (light she) n stn for sttement sequene resp. sttement, Con for onition. retngle(,,,) is use s shortut for.x =.x,.x =.x,.y =.y,.y =.y.

6 orer to speify whih rhs noe reples whih lhs noe, orresponing noes of the lhs n the rhs re lele with the sme letters. A smple erivtion sequene is shown in Fig. 6. Con-free hypergrph proutions re suffiient for the NSD exmple. There re lso on-sensitive proutions for speifying igrm struture, ut they re not resse here. NSD P 1 P 3 P 3 P 6 Con Fig. 6. Prt of the erivtion for the hypergrph in Fig. 4 using the proutions from Fig. 5. The igrm lss given y (on-free) hypergrph grmmr is the set of erivtion grphs tht re erivle from the strting grph n onsist of terminl hypereges only. Just these erivtion grphs re mppe on the sreen suh tht the user of igrm eitor only sees vli igrms. Furthermore, the user is not wre of the grmmr proutions n els with igrms in n pplition-oriente wy, s shown in Setion 2. Hypergrph grmmrs n esrie the syntti struture of igrms, ut lyout requirements re not inlue. For on-free (string) grmmrs this prolem n e solve y ttriutegrmmrs [10], i.e., y ssigning ttriutes to grmmr symols n funtionl epenenies to proutions tht etermine the ttriute vlues. Constrints were me populr y Borning [11] for lyout in intertive environments. Constrints re onitions utomtilly mintine y the system. They permit very high level speifition of lyout. The vntge of onstrints is tht they hve multiiretionl nture, wheres in ttriute grmmrs hnges re propgte only into one iretion. Vner Znen [6] omine onstrints with on-free (string) grmmrs y ssigning ttriutes to grmmr symols, n y ing onstrints, whih hve to e equtions, to eh proutionin orerto eterminethettriutes vlues. Hypergrph grmmrs re ttriute in similr wy. However, not only eges, whih orrespon to lphet symols in on-free (string) grmmrs, rry ttriutes, ut lso noes. Sine ny numer of hypereges n e onnete to noe,

7 noe ttriutes re ommon ttriutes for ll hypereges visiting this noe. The vntge is tht with using hypergrphs only few onstrints re neee ompre to [6]. Furthermore, onstrints n e liner inequlities in DiGen. Equtions etermine reltions etween ttriute vlues in efinite wy, wheres inequlity onstrints permit whole rnge of vlues s solutions. This is onvenient wy to omine utomti lyout of igrms provie y the system with user-efine moifitions. More etils on lyout n the inrementl lgorithm for onstrint stisftion uilt into our genertor n e foun in [12]. The onstrints for lyout of NSDs re shown in Fig. 5. Every noe hs ttriutes x n y for the noe s position. They re referre to y n:x n n:y for noe lele n.the only ege ttriutes neee re.h,.w, on.h, non.w for the miniml height n with of loks n onitions. The vlues of the ege ttriutes re etermine y the size of the tully ontine in the terminl symol. There re no onstrints neee for proutions P 1, P 2,nP 3. Just those in Fig. 5 re suffiient for lyout ue to noe ttriutes, whih re shre mong ll visiting hypereges. 3.2 User Intertion The min feture onerning user intertion is tht igrm n e moifie very onveniently in iret mnipultion style y just moving igrm elements roun on the sreen. This is not the se for other systems like PAGG or Constrints [5, 6], in whih eiting opertions hve to e hosen from menu. In igrm eitor generte with DiGen the intertion moule (see Fig. 3) is responsile for the retion on user s tions with mouse n keyor. They n, e.g., use seletion of igrm elements, lyout hnges, or trnsformtions of the igrm s struture. A trnsformtion is trnsition from set of igrms to nother set of igrms. The struture of one or more igrms n e hnge, ut the user of igrm eitor only sees vli igrms, i.e., igrms elonging to the speifie igrm lss. In ontrst to [6], trnsformtions in DiGen n e omplex n onsist of severl primitive steps. This enles more powerful trnsformtions n reusge of primitives. E.g., mny trnsformtions in the NSD eitor re se on primitives for eleting or inserting sequene of (ompoun) sttements. In igrm eitors generte with DiGen trnsformtions n lso e use to speify exeution of igrm, s in our smple eitor for finite stte mhines. A user first onstruts finite stte mhine with its sttes n trnsitions. Some sttes n e mrke s finl sttes, one s the initil stte. Fig. 7 shows the sitution fter onstruting finite stte mhine n pressing utton rt. The user ws ske to provie n input string for the finite stte mhine, n the urrent stte ws set to the initil stte. If there is suitle trnsition for the urrently first hrter in the input string, eh press on utton ep uses trnsition n removes the first hrter from the input. Pressing ep one yiels Fig Conlusions Diret mnipultion of igrms hs to e more thn seleting items n hoosing opertions from menu. DiGen genertes igrm eitors with iret mnipultion op-

8 Fig. 7. Simple finite stte mhine fter pressing utton rt. The finlstte is mrke y oule orer line, the initil stte y thik orer line. The urrent stte is set to the initil stte, whih is inite y the fille irle. Fig. 8. Sitution rising from Fig. 7 fter pressing utton ep one. ertions from speifition. A igrm lss is speifie y forml moel se on hypergrph grmmrs. This kin of grmmr is useful for esriing multiimensionl reltionships etween igrm elements. Furthermore, lyout of igrms is efine on high level y onstrints. Complex eiting opertions n exeution of igrm n e speifie in DiGen. Nevertheless, igrm eite y the user lwys is in onsistent stte, whih is hypergrph in the forml moel. This hypergrph n e use y other prts of the pplition. A prototype of DiGen hs een implemente. Future work will e to generte more smple eitors n link them to pplitions. Referenes 1. A. Morse n G. Reynols, Overoming urrent growth limits in UI evelopment, Communitions of the ACM, vol. 36, pp , Apr I. Nssi n B. Shneiermn, Flowhrt tehniques for struture progrmming, ACM SIGPLAN Noties, vol. 8, pp , Aug B.A. Myers, D.A. Giuse, R.B. Dnnenerg, et l., Grnet - Comprehensive support for grphil, highly intertive user interfes, Computer, vol.23, pp , Nov F. Arefi, C.E. Hughes, n D.A. Workmn, Automtilly generting visul syntx-irete eitors, Communitions of the ACM, vol. 33, pp , Mr H. Göttler, Grph grmmrs, new prigm for implementing visul lnguges, in N. Dershowitz, eitor, Rewriting Tehniques n Applitions, vol. 355 of Leture Notes in Computer Siene, pp Springer, 1989.

9 6. B.T. Vner Znen, Constrint grmmrs - new moel for speifying grphil pplitions, in K. Bie n C. Lewis, eitors, Pro. CHI 89, vol. 20 of SIGCHI Bulletin, pp , Mr T.W. Reps n T. Teitelum, The Synthesizer Genertor, Springer, New York, C. Berge, Hypergrphs, North-Holln, Amsterm, F. Drewes n H.-J. Kreowski, A note on hyperege replement, in H. Ehrig, H.-J. Kreowski, n G. Rozenerg, eitors, Leture Notes in Computer Siene, vol. 532, pp Springer, D.E. Knuth, Semntis of on-free lnguges, Mthemtil Systems Theory, vol. 2, pp , A. Borning, The progrmming lnguge spets of ThingL, onstrintoriente simultion lortory, ACM Trnstions on Progrmming Lnguges n Systems, vol. 3, pp , Ot M. Mins n G. Viehstet, Speifition of igrm eitors proviing lyout justment with miniml hnge, in Pro IEEE Symposium on Visul Lnguges, pp IEEE Computer Soiety Press, 1993.