Rétro ingénierie d interfaces utilisateur graphiques à partir de fichiers de ressources J....
-
Upload
orianne-charbonnier -
Category
Documents
-
view
104 -
download
2
Transcript of Rétro ingénierie d interfaces utilisateur graphiques à partir de fichiers de ressources J....
Rétro ingénierie d’Rétro ingénierie d’interfacesinterfaces
utilisateur graphiques utilisateur graphiques
à partir de à partir de fichiers de ressources fichiers de ressources
J. MarionJ. Marion
IntroductionIntroduction
Rétro ingénierie d’interfaces graphiques
Langage de spécification cible Langage de spécification source Implémentation de l’outil faisant la
traduction
Rétro ingénierie d’interfaces Rétro ingénierie d’interfaces utilisateur…utilisateur…
Examiner l’interface d’une application pour en extraire une spécification abstraite
Langage de description d’interface utilisateur (UIDL)
De manière automatique Faciliter la réutilisation (par exemple dans
une phase ultérieure de réingénierie)
Rétro ingénierie = traductiondans un plus haut niveau d’abstraction
UsiXML en tant que UIDL
Peut décrire un UI à différents niveaux d’abstraction
Permet un développement multidirectionnel
Les modèles qu’il spécifie sont structurés d’après les quatre couches du cadre de référence Caméléon
Le cadre de référence CAMELEON
Les modèles produits pourront être par la suite stockés de manière centralisés
Ces différents modèles sont chacun édités avec des éditeurs appropriés, mais séparés. Il est utile de les répertorier, de les mettre à jour et de les gérer dans le temps de manière efficace pour être réutilisés
Rétro ingénierie d’interfaces Rétro ingénierie d’interfaces utilisateur graphiques…utilisateur graphiques…
Modèle CUI
Indépendant de la plate-forme
Dépendant de la modalité d’interaction
graphicalRelationship
graphicalAlignment
isVertical : booleanisHorizontal : booleanisRightCentralLeft : stringisUpDown : string
videoComponent
alternateImage : uriautoplay : booleanisLoop : integerbuiltInControl : booleansubtitle : booleansubtitleContent : uri
drawingCanvas
window
windowLeftMargin : integerwindowTopMargin : integerisResizable : boolean
dialogBox
graphicalEmphasis
graphicalIndividualComponent
glueVertical : stringglueHorizontal : stringdefaultMnemonic : Stringmnemonic : StringtextFont : stringisBold : booleanisItalic : booleanisUnderline : booleanisStrikeThrough : booleanisSubScript : booleanisSuperScript : booleanisPreformatted : booleantextSize : integertextColor : String
graphicalContainer
width : integerheigth : integerbgImage : uriisAlwaysOnTop : booleanrepetition : integerisDetachable : booleanisMigrateable : boolean
0..n
1
0..n
1
0..n
0..1
0..n
0..1
menu
popUpMenu : booleantoolBarMenu : boolean
menuItem
type : stringkeyboardShortcut : stringdefaultKeyboardShortcut : string
1..n
1
1..n
11
1
1
1
tabbedItem
index : integer
tabbedDialogBox
1..n
1
1..n
1
inputText
textMargin : integerisEditable : booleanisWordWrapped : booleanforceWordWrapped : booleanmaxLength : integernumberOfColumns : integernumberOfLines : integertextVerticalAlign : stringtextHorizontalAlign : stringfilter : uridefaultFilter : stringisPassword : boolean
imageZone
hyperLinkTarget : uridefaultHyperLinkTarget : urishape : stringcoordinates : coord
imageComponent
imageHeight : integerimageWidth : integerimageHorizSpace : integerimageBorder : integerhyperLinkTarget : uridefaultHyperLinkTarget : uri
0..n0..n
toggleButton
defaultState : boolean
checkBox
defaultState : booleangroupName : string
button
radioButton
defaultState : booleangroupName : string
table
xSize : integerySize : integerzSize : integer
cell
xIndex : integeryIndex : integerzIndex : integerisHeader : booleanisFooter : boolean
0..n
1
0..n
10..1
1
0..1
1
cursor
defaultPosition : integer
slider
minValue : integermaxValue : integerstep : integerorientation : string
1..21
1..21
datePicker
hourPicker
colorPicker
filePicker
type : string
progressionBar
minValue : integermaxValue : integerorientation : stringindeterminate : boolean
graphicalAdjacencygraphicalTransition
transitionType : stringtransitionEffect : string
grahicalCointainment
source
sourceId : string
target
targetId : stringcuiRelationship
id : stringname : string
1..n1
1..n1
1..n1
1..n1
cuiModel
0..n
1
0..n
1
cio
id : stringname : stringicon : uricontent : uridefaultContent : string or uridefaultIcon : uridefaultHelp : urihelp : stringcurrentValue : string
1..n
1
1..n
1
MenuBarMenuPopUp
box
type : stringrelativeWidth : integerrelativeHeight : integerisSplitable : booleanisBalanced : boooleanisResizableHorizontal : booleanisResizableVertical : booleanrelativeMinWidth : integerrelativeMinHeight : integerisFlow : booleanisScrollable : booleangridWidth : stringgridHeight : string
toolBar
isFloat : booleanisFloatable : boolean
statusBar
comboBox
isEditable : booleanmaxlineVisible : integer
spin
orientation : string
Tree
Item
1..n
1
1..n
1
1..n
1
1..n
1
0..n
0..1
0..n
0..1
0..n0..1
0..n0..1
listBox
maxlineVisible : integerisEditable : booleanmultiple_selection : boolean
1..n
1
1..n
1
separator
type : string
graphicalCio
isVisible : booleanisEnabled : booleanstatusBarContent : uridefaultStatusBarContent : stringfgColor : stringbgColor : stringborderWidth : integerborderType : integerborderTitle : StringdefaultBorderTitle : StringborderTitleAlign : StringborderColor : StringtoolTipDefaultContent : stringtoolTipContent : uritransparencyRate : integer
outputText
defaultHyperLinkTarget : urihyperLinkTarget : urivisitedLinkColor : stringactiveLinkColor : stringtextMargin : integertextVerticalAlign : stringtextHorizontalAlign : stringscrollStyle : stringscrollDirection : stringscrollHeigth : integerscrollWidth : integerscrollHorizontalSpace : integerscrollVerticalSpace : integerscrollAmount : integerscrollDelay : integernumberOfColumns : integernumberOfLines : integer
Métamodèle
GrafiXML: un éditeur CUI écrit en Java
Permet de dessiner un UI et de générer le code correspondant en Java, XHTML ou XUL
Petite demonstration
… … à partir de fichier de à partir de fichier de ressources.ressources.
Interfaces utilisateur Windows Fichier de script de ressources (.rc) Fichier texte pouvant être extrait d’un
exécutable grâce à certains décompilateurs Ressource individuelle existant en tant que
fichier autonome appelé à partir d'un fichier .rc Il est également possible de trouver des
ressources dans des fichiers .dll Petite démonstration et format du ces fichiers
ImplémentationImplémentation
Plug-in dans GrafiXML
Analyse des correspondances entre métamodèles
PUSHBUTTON
Default : BooleanContent : {text,bitmap,icon}
CHECKBOX
Auto : Boolean3state : BooleanRightButton : BooleanPushLike : Boolean
RADIOBUTTON
Auto : BooleanRightButton : BooleanPushLike : Boolean
CUSTOMBUTTON
STATIC
Type : {text,frame,image,enhencedMetafile,ownerdraw}Sunken : BooleanNotify : BooleanTextStyle : {left,right,center,simple,leftNoWordWrap,undefined}NoPrefix : BooleanEndEllipsis : BooleanPathEllipsis : BooleanWordEllipsis : BooleanFrame : {black,gray,white,undefined}Rectangle : {black,gray,white,undefined}Etched : {frame,horizontal,vertical,undefined}Icon : BooleanBitmap : BooleanCenterImage : BooleanRealSizeImage : BooleanRightAdjust : Boolean
COMBOBOX
Type : {simple,dropDown,dropDownList}CaseSensitive : BooleanNoEditImage : BooleanNoSizeLimit : BooleanPathwordBreakProc : Boolean
SCROLLBAR
Type : {horizontal,vertical,sizeBox,sizeGrip}Alignment : {left,right,top,bottom,bottomRight,topLef,none}
EDIT
Alignment : {left,right,center}Multiline : BooleanAutoHorizontalScroll : BooleanAutoVerticalScroll : BooleanPasswordField : BooleanLowerCase : BooleanUpperCase : BooleanNoHideSelection : BooleanReadOnly : BooleanNumber : BooleanWantReturn : BooleanOEMConvert : Boolean
CUSTOMCONTROL
ClassName : String .
PUSHBOX
WINDOW
Text : StringGeneralStyle : {popup, overlapped, child}Border : BooleanCaption : BooleanClipChildren : BooleanClipSimblings : BooleanDisabled : BooleanDialogFrame : BooleanGroup : BooleanTabStop : BooleanHorizontalScrollBar : BooleanMaximizeBox : BooleanMaximized : BooleanMinimizeBox : BooleanMinimized : BooleanSystemMenu : BooleanThickFrame : BooleanVerticalScrollBar : BooleanVisible : BooleanClientEdge : BooleanDialogModalFrame : BooleanStaticEdge : BooleanWindowEdge : BooleanAcceptFiles : BooleanAppWindow : BooleanControlParent : BooleanExContextHelp : BooleanLayered : BooleanLayoutRTL : BooleanLeft : BooleanLeftScrollBar : BooleanLTRReading : BooleanMDIChild : BooleanNoActive : BooleanNoInheritLayout : BooleanNoParentNotify : BooleanRight : BooleanRightScrollBar : BooleanRTLReading : BooleanToolWindow : BooleanTopMost : BooleanTransparent : Boolean
RICHEDIT
DisableNoScroll : BooleanNoCallOleInitialize : BooleanNoIME : BooleanSelfIME : BooleanSunken : BooleanVertical : Boolean
TREEVIEW
CheckBoxes : BooleanDisableDragDrop : BooleanEditLabels : BooleanFullRowSelect : BooleanHasButtons : BooleanHasLines : BooleanInfoType : BooleanLinesAtRoot : BooleanNoHorizontalScroll : BooleanNonevenHeight : BooleanNoScroll : BooleanNoToolTips : BooleanRightToLeftReading : BooleanShowSelectionAlways : BooleanSingleExpand : BooleanTrackSelect : Boolean
TRACKBAR
AutoTicks : BooleanDowIsLeft : BooleanEnableSelectionRange : BooleanFixedLenght : BooleanNoThumb : BooleanNoTicks : BooleanOrientation : {horizontal,vertical}Reversed : BooleanTickMarks : {bottom,top,left,right,both}ToolTips : Boolean
PROGRESSBAR
Type : {normal,marquee,smooth}Vertical : Boolean
MONTHCALENDAR
DayState : BooleanMultiselection : BooleanNoToday : BooleanNoTodayCircle : BooleanWeekNumbers : Boolean
STATUTBAR
SizeGrip : BooleanToolTips : BooleanTop : Boolean
LISTVIEW
View : {icon,smallIcon,list,report}Alignment : {left,top}EditLabels : BooleanOwnerData : BooleanShareImageLists : BooleanShowSelectionAlways : BooleanSingleSelect : BooleanSortAscending : BooleanSortDescending : BooleanCheckBoxes : BooleanOneClickActivate : BooleanTrackSelect : BooleanTwoClickActivate : BooleanAutoArrange : BooleanNoLabelWrap : BooleanNoScroll : BooleanNoColumnHeader : BooleanNoSortHeader : BooleanOwnerDrawFixed : BooleanFullRowSelect : BooleanGridLines : BooleanHeaderDragDrop : BooleanSubItemImages : Boolean
ANIMATION
AutoPlay : BooleanCenter : BooleanTransparent : Boolean
DATETIMEPICKER
AppCanParse : BooleanFormat : {longDate,shortDate,shortDateCentury,time}RightAlign : BooleanShowNone : BooleanUpDown : Boolean
TAB
Type : {tabs,buttons}Bottom : BooleanFixedWidth : BooleanFlatButtons : BooleanFocusNever : BooleanFocusOnButtonDown : BooleanForceLeft : {none,icon,label}HotTrack : BooleanMultiline : BooleanMultiselection : BooleanOwnerDrawFixed : BooleanRaggedRight : BooleanRight : BooleanRightJustify : BooleanScrollOpposite : BooleanToolTips : BooleanVertical : Boolean
HEADER
Buttons : BooleanDragDrop : BooleanFilterBar : BooleanFlat : BooleanFullDrag : BooleanHidden : BooleanHorizontal : BooleanHotTrack : Boolean
TOOLBAR
ALTDrag : BooleanCustomErase : BooleanFlat : BooleanTransparent : BooleanList : BooleanRegisterDrop : BooleanToolTips : BooleanWrapAble : BooleanNoResize : BooleanNoParentAlign : BooleanBottom : BooleanNoDivider : BooleanAdjustable : Boolean
REBAR
AutoSize : BooleanBandBorders : BooleanDoubleClickToggle : BooleanFixedOrder : BooleanNoDivider : BooleanRegisterDrop : BooleanVarHeight : BooleanVerticalGripper : BooleanVertical : Boolean
PAGER
AutoScroll : BooleanDragAndDrop : BooleanDirection : {horizontal,vertical}
LISTBOX
Sorted : BooleanMultipleSelection : BooleanDisableNoScroll : BooleanExtendedSelection : BooleanMulticolumn : BooleanNoSelection : BooleanNotify : BooleanOwnerDrawFixed : BooleanOwnerDrawVariable : BooleanHasStrings : BooleanNoIntegralHeight : BooleanUseTabstops : BooleanWantKeyBoardInput : BooleanNoData : BooleanNoRedraw : Boolean
BUTTON
VerticalAlignment : {top,center,bottom}HorizontalAlignment : {left,center,right}Flat : BooleanMultiline : BooleanNotify : Boolean
GROUPBOX
UPDOWN
Alignment : {left,right,none}ArrowKeys : BooleanAutoBuddy : BooleanHorizontal : BooleanHotTrack : BooleanNoThousands : BooleanSetBuddyInt : BooleanWrap : Boolean
CONTROL
CtrlID : IntegerX : IntegerY : IntegerWidth : IntegerHight : IntegerHelpID : IntegerPosition : Integer0..*
0..1
0..*
0..1
Regroup
+is the buddy window of
Glue To
DIALOG
DlgIDExtended : BooleanX : IntegerY : IntegerWidth : IntegerHight : IntegerHelpID : Integer3DLook : BooleanAbsoluteAlignment : BooleanCenter : BooleanCenterMouse : BooleanContextHelp : BooleanDialogIsControl : BooleanFixedSys : BooleanLocalEdit : BooleanModalFrame : BooleanNoFailCreate : BooleanNoIdleMessage : BooleanSetForeGround : BooleanLanguage : StringSubLanguage : StringSetFont : BooleanFontName : StringFontSize : IntegerItalic : BooleanWeight : IntegerShellFont : Boolean
0..*
1
0..*
1
graphicalRelationship
graphicalAlignment
isVertical : booleanisHorizontal : booleanisRightCentralLeft : stringisUpDown : string
videoComponent
alternateImage : uriautoplay : booleanisLoop : integerbuiltInControl : booleansubtitle : booleansubtitleContent : uri
drawingCanvas
window
windowLeftMargin : integerwindowTopMargin : integerisResizable : boolean
dialogBox
graphicalEmphasis
graphicalIndividualComponent
glueVertical : stringglueHorizontal : stringdefaultMnemonic : Stringmnemonic : StringtextFont : stringisBold : booleanisItalic : booleanisUnderline : booleanisStrikeThrough : booleanisSubScript : booleanisSuperScript : booleanisPreformatted : booleantextSize : integertextColor : String
graphicalContainer
width : integerheigth : integerbgImage : uriisAlwaysOnTop : booleanrepetition : integerisDetachable : booleanisMigrateable : boolean
menu
popUpMenu : booleantoolBarMenu : boolean
menuItem
type : stringkeyboardShortcut : stringdefaultKeyboardShortcut : string
tabbedItem
index : integer
tabbedDialogBox
inputText
textMargin : integerisEditable : booleanisWordWrapped : booleanforceWordWrapped : booleanmaxLength : integernumberOfColumns : integernumberOfLines : integertextVerticalAlign : stringtextHorizontalAlign : stringfilter : uridefaultFilter : stringisPassword : boolean
imageZone
hyperLinkTarget : uridefaultHyperLinkTarget : urishape : stringcoordinates : coord
imageComponent
imageHeight : integerimageWidth : integerimageHorizSpace : integerimageBorder : integerhyperLinkTarget : uridefaultHyperLinkTarget : uri
toggleButton
defaultState : boolean
checkBox
defaultState : booleangroupName : string
button
radioButton
defaultState : booleangroupName : string
table
xSize : integerySize : integerzSize : integer
cell
xIndex : integeryIndex : integerzIndex : integerisHeader : booleanisFooter : boolean
cursor
defaultPosition : integer
slider
minValue : integermaxValue : integerstep : integerorientation : string
datePicker
hourPickercolorPicker
filePicker
type : string
progressionBar
minValue : integermaxValue : integerorientation : stringindeterminate : boolean
graphicalAdjacencygraphicalTransition
transitionType : stringtransitionEffect : string
grahicalCointainment
source
sourceId : string
target
targetId : string
cuiRelationship
id : stringname : string
cuiModel
cio
id : stringname : stringicon : uricontent : uridefaultContent : string or uridefaultIcon : uridefaultHelp : urihelp : stringcurrentValue : string
MenuBarMenuPopUp
box
type : stringrelativeWidth : integerrelativeHeight : integerisSplitable : booleanisBalanced : boooleanisResizableHorizontal : booleanisResizableVertical : booleanrelativeMinWidth : integerrelativeMinHeight : integerisFlow : booleanisScrollable : booleangridWidth : stringgridHeight : string
toolBar
isFloat : booleanisFloatable : boolean
statusBar
comboBox
isEditable : booleanmaxlineVisible : integer
spin
orientation : string
Tree
Item
listBox
maxlineVisible : integerisEditable : booleanmultiple_selection : boolean
separator
type : string
graphicalCio
isVisible : booleanisEnabled : booleanstatusBarContent : uridefaultStatusBarContent : stringfgColor : stringbgColor : stringborderWidth : integerborderType : integerborderTitle : StringdefaultBorderTitle : StringborderTitleAlign : StringborderColor : StringtoolTipDefaultContent : stringtoolTipContent : uritransparencyRate : integer
outputText
defaultHyperLinkTarget : urihyperLinkTarget : urivisitedLinkColor : stringactiveLinkColor : stringtextMargin : integertextVerticalAlign : stringtextHorizontalAlign : stringscrollStyle : stringscrollDirection : stringscrollHeigth : integerscrollWidth : integerscrollHorizontalSpace : integerscrollVerticalSpace : integerscrollAmount : integerscrollDelay : integernumberOfColumns : integernumberOfLines : integer
0..n
1
0..n
1
0..n0..n
0..10..1
1
11..n1..n
1
1..n
1
1..n
1..n
1
0..n0..n
11
0..n0..n
1
0..n
1
0..n 1..2
1
1..2
1
1..n
1..n
11..n
1
11..n
1
0..n
1
0..n
11
1..n1..n
1
11
0..1
1..n1..n
1
1..n1..n
1
0..n0..n
0..10..1
0..n0..n
0..1
1..n
1
1..n
1
ConclusionConclusion