Advanced Programming Techniques for MVC

Variable Subviews (Continuation)

In the previous example, we loose the current settings of a subview that is replaced by another subview. This happens because we create a new model every time we change the content of the ContainerView. To keep the states of these model, we have to store them. To do that, we add two instance variables to VariableSubViewExmaple:

Model subclass: #VariableSubViewExample
      instanceVariableNames: 'switch1 switch2 currentAspect
                              graphicSubmodel textSubmodel'
      classVariableNames: ''
      poolDictionaries: ''
      category: 'MVCTutorial-AdvancedExamples'

The instance methods addGraphicView:, addTextView: are changed to create a new model only when a stored model is not available:

addGraphicView: subviewContainer

  (graphicSubmodel ifNil: [graphicSubmodel := GraphicalDemo2 new])
      addSubviewsFor: subviewContainer.

addTextView: subviewContainer

   (textSubmodel ifNil: [textSubmodel := TextStyleDemo new])
      addSubviewsFor: subviewContainer.

The creation of the subviews for the ContainerView is now the responsibility of the instances.

For class GraphicalDemo2, we add this instance method:

addSubviewsFor: container
   | model selectionView drawing frame |
  frame := container window.
  model := self.
  selectionView := PluggableListView
                         on: model
                         list: #getVertexList
                         selected: #getVertexSelection
                         changeSelected: #notifyVertexSelection:
                         menu: nil
                         keystroke: #keystroke:.

  selectionView
    borderWidth: 1;
    window: (frame origin extent: frame width * 3 // 20 @ frame height).
  container addSubView: selectionView.

  drawing := PluggableDrawingView new.
  drawing 
    model: model;
    borderWidth: 1;
    window: (frame origin extent: frame width * 17//20 @ frame height).
  container addSubView: drawing toRightOf: selectionView.

For class TextStyleDemo, we add this instance method:

addSubviewsFor: container
    | model textView fontList fontSizesList attributesList frame |
  frame := container window.
  model := self .
   
  textView := PluggableTextView
                     on: model
                     text: #getText accept: nil
                     readSelection: nil
                     menu: #getTextMenu:.
  textView borderWidth: 1.
  textView controller: ReadOnlyTextController new.
  textView
    window: (frame width *4 /20 @ 0 extent: frame width * 16/20 @ frame height).
  container addSubView: textView.

  fontList := PluggableListView
                   on: model
                   list: #fontFamilyList
                   selected: #currentFontFamily
                   changeSelected: #selectFontFamily:
                   menu: nil
                   keystroke: nil. 
  fontList controller: (fontList defaultController
                               terminateDuringSelect: true);
           autoDeselect: false.
  fontList borderWidth: 1.
  fontList
     window: (0 @ 0 extent: (frame width * 4/20) @ (frame height / 3)).
  container addSubView: fontList toLeftOf: textView.
   

  fontSizesList := PluggableListView
                      on: model
                      list: #fontSizesList
                      selected: #currentFontSize
                      changeSelected: #selectFontSize:
                      menu: nil
                      keystroke: nil. 
  fontSizesList autoDeselect: false.
  fontSizesList borderWidth: 1.
  fontSizesList
     window: (0 @ 0 extent: (frame width * 4 / 20) @ (frame height / 3)).
  container addSubView: fontSizesList below: fontList.

  attributesList := PluggableListViewOfMany
                      on: model
                      list: #textAttributesList
                      primarySelection: #listIndex
                      changePrimarySelection: #toggleListIndex:
                      listSelection: #listSelectionAt:
                      changeListSelection: nil
                      menu: nil
                      keystroke: nil. 
  attributesList borderWidth: 1.
  attributesList
     window: (0 @ 0 extent: (frame width * 4 / 20) @ (frame height/3)).
  container addSubView: attributesList below: fontSizesList.

The change set for this example is VariableViewDemo2.cs. This change set is complete and independent from other change sets. You do not need to file in change sets of other examples.

What we have learned:

• It is sometimes desirable to use component models that survive their visual presentation.
• A component model keeps all information that is necessary to recreate its visual representation.
• The recreation of a visual representation for a component model is best implemented by instance methods.