fall 2005 6 831 ui design and implementation 1 fall 2005
play

Fall 2005 6.831 UI Design and Implementation 1 - PDF document

Fall 2005 6.831 UI Design and Implementation 1 Fall 2005 6.831 UI Design and Implementation 2


  1. ������������������������� ���������������� Fall 2005 6.831 UI Design and Implementation 1 Fall 2005 6.831 UI Design and Implementation 2 �������������� ���������� ������ ������������ � Undo design principles � Undo = reverses the effect of an action � History visualization � Questions � What stream of actions will be undone? � Selective undo � How is the stream divided into units? � Command objects � Which actions are undoable? � How much of the previous state is actually recovered? � How far back can you undo? Fall 2005 6.831 UI Design and Implementation 3 Fall 2005 6.831 UI Design and Implementation 4 1

  2. !����������������������"����#��������� ��"�����������������$���������������� � Low level � Actions in this window? (MS Office) � Mouse clicks, key presses, mouse moves � Actions in this text widget? (web � Nobody does it at this level � Syntactic level browser) � Commands and button presses � Just my actions, or everybody � s? � Semantic level � Changes to application data structures (e.g., the result of an (multiuser apps) entire Format dialog) � What about actions made by the � This is the normal level � Text entry is aggregated into a single action computer? � But other editing commands (like Backspace) and newlines � MS Office AutoCorrect and AutoFormat are interrupt the aggregation � What about user-defined macros? undoable, even though user didn � t do them � Undo macro actions individually, or as a unit? Fall 2005 6.831 UI Design and Implementation 5 Fall 2005 6.831 UI Design and Implementation 6 !����������������������#��� ��"�������������������$����� � User � s action stream may include many � Select text, delete it, and then undo actions ignored by Undo � Text is restored � Selection (of text or objects) � Keyboard focus (to different widgets or windows) � But is selection restored? Cursor position? � Changing viewpoint (scrolling, zooming) � Changing layout (opening palettes or sidebars, adjusting window sizes) � UI customization (adding buttons to toolbars) � So which actions does Undo actually undo? � Some applications (e.g. web browsers, IDEs) Undo/Redo for the editing stream, Back/Forward for the viewpoint stream Fall 2005 6.831 UI Design and Implementation 7 Fall 2005 6.831 UI Design and Implementation 8 2

  3. ��"�����#��%�������������� &������'������������������ � � Often a limit on history size Visibility � Make sure undone effects are visible � e.g., scrolled into view, selected, possibly animated � Used to be one action -- now usually � Aggregation � Units should be � chunks � of action stream: typed strings, dialogs, macros hundreds, or infinite � Reversibility of the Undo itself � Support Redo as well as Undo � Does action stream persist across � Undo to a state where user can immediately reissue the undone command, or a variant on it application sessions? � e.g., restore selection & cursor position � Reserve it for model changes, not view changes � If so, stream must be saved to file � For consistency with other applications, reserve Undo for changes to backend data � Does it persist across File/Save? � � Undo � is not the only way to support reversibility � Backspace undoes typing, Back undoes browsing, Recent Files undoes file closing, scrolling back undoes scrolling � Not in MS Office � Forward error recovery: using new actions to fix errors Fall 2005 6.831 UI Design and Implementation 9 Fall 2005 6.831 UI Design and Implementation 10 (������)��������������� ���������*��������� � Use Undo/Redo to browse history and � History list is a script of commands view resulting application state that generates the current model state � Not ideal, since user is making changes to � Undo & Redo edit the script model just to view the history � Undo removes last action from history list � Direct visual representation and puts it on redo list � Redo adds back one action from redo list � Undo & Redo are not put in either list History list Redo list web browser history graphical history Current state Fall 2005 6.831 UI Design and Implementation 11 Fall 2005 6.831 UI Design and Implementation 12 3

  4. *���$����-��������������������� +������,�"�-������������������ .�������$������/ � Selective undo = deleting any action from the history � New command is added to history list list, not necessarily the last � And clears the redo list (in most apps) � Selective redo = redoing any action in redo list, not necessarily the first History list Redo list � Need to visualize history to choose action to undo � Essential for multiuser applications New command � Watch out for command interdependencies � Or new command may branch history Create Distribute all rectangle #5 rectangles horizontally Redo list History list Delete text Delete text start=10,len=10 start=0,len=5 New command Fall 2005 6.831 UI Design and Implementation 13 Fall 2005 6.831 UI Design and Implementation 14 �����*������������� �"���������+����������� � History is a list of command objects UndoableEdit � with undo() and redo() methods undo() redo() � Command object must store enough data to UndoableEditListener implement undo and redo editHappened(UndoableEditEvent) � Partial checkpoint of prior state � Move circle from (0,0) to (100,100) * StateEdit CompoundEdit � Change text from Times to Arial addEdit(UndoableEdit) � Object references vs. location descriptions listeners � Insert � hello � at char position 33 vs. Insert � hello � at marker #502934 � Relative difference vs. absolute before & after Document UndoManager values model � Move circle from (90,120) to (100, 100) vs. Move circle by (10,-20) JTextComponent Fall 2005 6.831 UI Design and Implementation 15 Fall 2005 6.831 UI Design and Implementation 16 4

  5. ���������������-��������� � Global changes may need to save a lot of prior state � e.g. whole-image operations in an image editor � Redo of object creation must produce references usable by subsequent modification/deletion actions � 1: Create circle #5023 center (10,10) radius 20 � 2: Change color circle #5023 from black to white � Undo 1 & 2, then redo 1 � Redo must restore the original circle so that action 2 still refers to it � Object references on history list prevent garbage collection of deleted objects � generally handled by limited history length Fall 2005 6.831 UI Design and Implementation 17 5

Recommend


More recommend