The 1000 steps program to MDriven Chapter 2
(Created page with "This is Chapter 2. You should consider finishing Chapter 1 first. Here is a video that shows the steps below: https://youtu.be/b2N_e6YkG...")
 
No edit summary
(28 intermediate revisions by 2 users not shown)
Line 1: Line 1:
This is Chapter 2. You should consider finishing [[The 1000 steps program to MDriven|Chapter 1 first.]]
This is '''Chapter 2'''. You should consider finishing [[The 1000 steps program to MDriven Chapter 1|Chapter 1 first.]]


Here is a video that shows the steps below: https://youtu.be/b2N_e6YkG4o
=== '''Video 2: Auto-diagram, OCL, and Autoforms''' ===


'''Video 2: Mdriven Education Video Steps 41 - 75: Auto-diagram, OCL, and Autoforms'''
<html>


{| class="wikitable"
<p class="video-warn">
|Title
  To make your experience smooth, we set the main tags mentioned in the video to the right bar menu of this mini-player. Choose an interesting subtitle on the list and immediately get to the exact theme navigation item place in the video. Now you can pick any topic to be instructed on without watching the whole video.
|Content
</p>
|Time(Segment Start)
|-
|Introduction
|Introduction and copying of previous work
|[https://www.youtube.com/embed/b2N_e6YkG4o Introduction]
|-
|Deleting and Moving
|Deleting and moving associations/relations from the diagram and model,
deleting classes from the diagram
|[https://www.youtube.com/embed/b2N_e6YkG4o?start=71 Deleting and moving at 01:11]
|-
|Association to self
|Association/relation from a class to itself
|[https://www.youtube.com/embed/b2N_e6YkG4o?start=425 Association to self at 7:05]
|-
|Auto-diagram and More Deleting
|Difference between diagram and auto-diagram, deleting and reintroducing attributes from the diagram, deleting classes from the diagram and the model
|[https://www.youtube.com/embed/b2N_e6YkG4o?start=564 Auto-diagram and more deleting at 9:24]
|-
|More Association
|Adding classes and relations repetition(see earlier steps)
|[https://www.youtube.com/embed/b2N_e6YkG4o?start=776 More association at 12:56]
|-
|OCL
|OCL expressions and constraints
|[https://www.youtube.com/embed/b2N_e6YkG4o?start=1035 OCL at 17:15]
|-
|Autoforms
|Intro to Autoforms and ViewModels
|[https://www.youtube.com/embed/b2N_e6YkG4o?start=1654 Autoforms at 27:34]
|}


=== Understanding Class-diagrams, Creating Classes and Making Use of AutoForms and DefaultStringRepresentation ===
<div class="video">
41. Open the location where you saved your file and make a copy in a subfolder.
  <div class="video__wrapper">
    <iframe src="https://www.youtube.com/embed/b2N_e6YkG4o?si=HPXVXdYfA0mGUQpP" title="YouTube video player" frameborder="0" allowfullscreen></iframe>
  </div>
  <div class="video__navigation">
<span data-video="b2N_e6YkG4o" data-start="00" tabindex="0"> <strong> Steps 41 - 75 </strong> </span>
    <span class="navigation-item" data-video="b2N_e6YkG4o" data-start="00" tabindex="0"> Introduction </span>
    <span class="navigation-item" data-video="b2N_e6YkG4o" data-start="71" tabindex="0"> Deleting and moving </span>
    <span class="navigation-item" data-video="b2N_e6YkG4o" data-start="425" tabindex="0"> Association to self </span>
    <span class="navigation-item" data-video="b2N_e6YkG4o" data-start="564" tabindex="0"> Auto-diagram and more deleting </span>
    <span class="navigation-item" data-video="b2N_e6YkG4o" data-start="776" tabindex="0"> More Association </span>
    <span class="navigation-item" data-video="b2N_e6YkG4o" data-start="1035" tabindex="0"> OCL </span>
    <span class="navigation-item" data-video="b2N_e6YkG4o" data-start="1654" tabindex="0"> Autoforms </span>
  </div>
</div>


42. Create a new class (Class1) on the diagram next to Person.
</html>


43. Drag on a relation (or association) from Class1 to Person.


44. Find Class1 in Tree and double click to see the autodiagram - note the relation.
== Chapter 2: Understanding Class-diagrams, Creating Classes, and Making Use of AutoForms and DefaultStringRepresentation ==
41. Open the location where you saved your file and make a copy in a subfolder called "TasksUpTo40". This helps you keep track of your progress and easily access previous versions of the file.
* Copy both the modlr file and the Start Prototype Data XML file.
** These files contain the values that you see in the debugger for the instances of the classes in the model.
42. Create a new class (<code>Class1</code>) on the diagram next to <code>Person</code>.


45. Go back to diagram, select the relation by clicking the line - press delete (del key). Del-key only removes relation from the diagram - not from the model.  
43. Drag on a relation (or association) from <code>Class1</code> to <code>Person</code>.
* This creates a relationship between the two classes.
44. Find <code>Class1</code> in Tree and double-click to see the autodiagram.  


46. Search for the Class1 in the Tree - click up the auto diagram - observe that it is still there.  
45. Go back to the diagram, and select the relation by clicking the line. Press delete (del key). Deleting only removes the relation from the diagram, not from the model.  


47. Go back to diagram - right click Class1 - find Introduce&Remove/Re-introduce removed associations - click it - notice that the association you removed is now back on the diagram.  
46. Search for <code>Class1</code> in the Tree, click on the auto diagram, and observe that it is still there.  


48. Select the end of the association - note the blue circle - while pressing ctrl-key click and hold the association end - hold and drag the association end and let it go when you are over Car. You have now moved an association.
47. Go back to the diagram, right-click <code>Class1</code>, find ''Introduce&Remove,'' then select ''Re-introduce'' ''removed associations'' and click on it. 
* Notice that the association you removed is now back on the diagram.
48. Select the end of the association - note the blue circle. While pressing the ctrl key, click and hold the association end. Hold and drag the association end and let it go when you are over Car. You have now moved an association.  


49. Check the AutoDiagram, click the different classes, and make sure it says the same thing as the diagram. Go back and forth a few times and move the association ends of this relation.
49. Check the AutoDiagram, click the different classes, and make sure it says the same thing as the diagram. Go back and forth a few times and move the association ends of this relation.


50. Select the Class1 - press delete-key. Check tree and auto diagram - it is still in the model. The delete key only removes things from the diagram - not from the model.
50. Select the <code>Class1</code> - Press the delete key. Check the tree and auto diagram - it is still in the model. The delete key only removes things from the diagram - not from the model.


51. Find Class1 in Tree - click-drag it onto the diagram surface - note that even its associations re-appear.
51. Find <code>Class1</code> in Tree and click-drag it onto the diagram surface. Note that even its associations re-appear.


52. To delete something from a diagram and the model, you must press ctrl+delete. Select the association by clicking the line. Press ctrl+delete to delete. Check tree, and check autodiagram that it is gone.
52. To delete something from a diagram and the model, you must press ctrl+delete.  
* Select the association by clicking the line.  
* Press ctrl+delete to delete.  
* Check the tree, and check that the autodiagram is gone.
53. Sometimes, you want a relation from a class back to the same class.
* Create a relation by selecting the tool - click hold drag on <code>Class1</code> - let go of the mouse button over the open diagram space.
* Note the via point.
* Move the mouse to yet a new position in the open diagram space - click to add yet a via point.
* From here, move the mouse back over <code>Class1</code> - click again. Note a relation to self has been created.
54. Check the autodiagram - note that <code>Class1</code> now appears three times when shown. This is how an association to self is shown in an autodiagram.


53. Sometimes, you want a relation from a class back to the same class - create a relation by selecting the tool - click hold drag on Class1 - let go of the mouse button over open diagram space - note the via point - move the mouse to yet a new position in open diagram space - click to add yet a via point - from here move the mouse back over Class1 - click again. Note a relation to self has been created.
55. The autodiagram always shows the selected class and its surroundings completely. A diagram only shows the things from the model you have explicitly added to it.


54. Check the autodiagram - note that Class1 now appears three times when shown - this is how an association to self is shown in autodiagram.
56. In the diagram, in <code>Class1</code> - add two new attributes (right click - add Attribute - twice). Select attribute1 - press the delete key, and note that it disappears. Check the autodiagram - it still shows two attributes.
 
55. The autodiagram always shows the selected class and its surroundings completely - a diagram only shows the things from the model you have explicitly added to it.
 
56. In the diagram, in Class1 - add two new attributes (right click - add Attribute - twice) - select attribute1 - press delete-key, note that it disappears, check autodiagram - it still shows two attributes.


57. Go back to the diagram using the back-and-forth arrows next to the play button in the top toolbar.
57. Go back to the diagram using the back-and-forth arrows next to the play button in the top toolbar.
Line 79: Line 73:
59. Press ctrl-Y for redo - observe that attribute1 disappears again.
59. Press ctrl-Y for redo - observe that attribute1 disappears again.


60. Right-click Class1, find Features/Pick Shown features, find attribute1 and move it back to shown - close the dialog - note that attribute1 is now back in the diagram Class1 display.
60. Right-click <code>Class1</code>, find Features/Pick Shown features, find attribute1, and move it back to shown - close the dialog.
* Note that attribute1 is now back in the diagram <code>Class1</code> display.
61. Select <code>Class1</code> - press ctrl+delete. Now, <code>Class1</code> is deleted, and it deleted its attributes and associations.


61. Select Class1 - press ctrl+delete - now Class1 is deleted, and it deleted its attributes and associations.
62. Create a new class and name it <code>BrandOfCar</code>. Remember to save your model often - ctrl-S.


62. Create a new class and name it BrandOfCar. Remember to save your model often - ctrl-S.
63. Add an attribute of type string called '''Name'''.


63. Add an attribute of type string called Name.
64. Drag an association from Brand to Car. Note that the multiplicity marking on the association should say that Car can have 0..1 Brand, and Brand has 0..*(many) Cars.


64. Drag an association from Brand to Car - note that the multiplicity marking on the association should say that Car can have 0..1 Brand, and Brand has 0..*(many) Cars.
65. Open the debugger - add Brand-instances (Open Brand seeker, Add new). Name them Volvo, BMW, and Tesla - save the Debugger data.


65. Open the debugger - add Brand-instances (Open Brand seeker, Add new), Name then Volvo, BMW, and Tesla - save the Debugger data.
66. In the debugger, open Autoform of a Car.
 
* Note the new ability to assign a Brand.
66. In the debugger, open Autoform of a Car - note the new ability to assign a Brand - use it to assign a Brand - save the data.
* Use it to assign a Brand and save the data.
 
67. Go back to the diagram, (Close debugger + run dialog), select <code>Car</code>, and in property inspection, find DefaultStringRepresentation. Press the <code>...</code> to open the OCL Editor.  
67. Go back to the diagram, (Close debugger + run dialog), select Car, and in property inspection, find DefaultStringRepresentation. Press the ... to open the OCL editor. OCL is a language that allows you to navigate and pinpoint everything in the model. You can write freehand OCL - or you can use the context help of the OCL editor. All snippets of OCL code are called expressions. Expressions are like math functions, not only with numbers but also with information. The information you use in the expressions must be present in your model. This makes it easy to ensure that all expressions are valid. When you save the model, we start a validation and you will see a red dot when in error.
'''''OCL''''' ''is a language that allows you to navigate and pinpoint everything in the model. You can write freehand OCL or use the context help of the OCL editor. All snippets of OCL code are called expressions. Expressions are like math functions, not only with numbers but also with information. The information you use in the expressions must be present in your model. This makes it easy to ensure that all expressions are valid. When you save the model, we start a validation and you will see a red dot when there is an error.''
* OCL is object-oriented - and the self/this variable of OCL is called self.
* OCL is object-oriented - and the self/this variable of OCL is called self.
* Write self. RegistrationNumber+' of type '+self.BrandOfCar.Name in the expression for DefaultStringRepresentation.
* Write <code>self. RegistrationNumber+' of type '+self.BrandOfCar.Name</code> in the expression for DefaultStringRepresentation.
* Okay the OCL editor. Save. Check for red dots. Try to introduce an error by saying Name2 instead of Name - save - see the red dot warning. Fix the issue.  
* Click "okay" in the OCL editor. Save. Check for red dots. Try to introduce an error by saying '''Name2''' instead of '''Name''' - save - see the red dot warning. Fix the issue.  
68. The defaultStringReprestations of an object is used whenever we are not explicit with an attribute and we need a representation in string form of the object. The debugger Autoforms use this. Go into the debugger and see the header of Autoforms following your rule from above.
68. The defaultStringRepresentations of an object is used whenever we are not explicit with an attribute and we need a representation in the string form of the object. The debugger Autoforms use this. Go into the debugger and see the header of Autoforms following your rule from above.
 
69. OCL is short for Object Constraints Language; many simple OCL tools use OCL only for constraints. In MDriven, we use OCL for almost everything. Go to Car - find Constraint in property inspector - click ... Add a new Constraint. The OCL expression of a constraint should validate to true; otherwise, the constraint is broken. Add the constraint self.BrandOfCar->notempty - this means that we will be true if we have a Brand associated and false if we do not. Enter the description of the constraint: Cars MUST have a Brand! - say that this is of type Warning.
 
70. Go into debugger Autoforms - check what happens when an object breaks the constraint (remove a brand of a car).
 
71. In MDriven, we can design ViewModels that use OCL expressions to build information elements that can be presented to a user. There is a quick way to do the default and show everything - it is called AutoForms. Right-click the diagram surface - find Autoforms/Create-refresh-Autoforms. Note the tree is filled up with ViewModels and Actions all tagged with AutoForm.
 
72. Right-click the diagram surface - find Autoforms/Drop-Autoforms - note that the tree is cleared of actions and ViewModels tagged with AutoForm.
 
73. Add back the AutoForms. Press Play now instead of the debugger and pick Run-Model-and-Continue-modeling. Familiarize yourself with the Menu and forms. Note that this system uses the same data as in the debugger.


74. AutoForms are just the beginning - though, they may feel a bit clunky. You can reduce clunkiness by setting properties in the model. For example, select association-end BrandOfCar, in propertyinspector find AutoForms - change value from SearchAndPick to Combobox. Autoforms/Create-refresh-Autoforms. Save model. Switch back to the WECPOF window that can be kept open while changing the model. Press Model refresh. Notice this different way to assign brands.
69. OCL is short for Object Constraints Language; many simple OCL tools use OCL only for constraints. In MDriven, we use OCL for almost everything.  
* Go to <code>Car</code> - find Constraint in property inspector - click ... Add a new Constraint.  
* The OCL expression of a constraint should validate to true; otherwise, the constraint is broken.
* Add the constraint <code>self.BrandOfCar->notempty</code>.
* This means that we will be true if we have a Brand associated and false if we do not.
* Enter the description of the constraint: <code>Cars MUST have a Brand!</code> - say that this is of type Warning.
70. Go into debugger Autoforms. Check what happens when an object breaks the constraint (remove a brand of a car).  


75. Assign a null brand - do you see the broken constraint?
71. In MDriven, we can design ViewModels that use OCL expressions to build information elements that can be presented to a user. There is a quick way to do the default and show everything - it is called AutoForms.
* Right-click the diagram surface and find Autoforms/Create-refresh-Autoforms.
* Note the tree is filled up with ViewModels and Actions all tagged with AutoForm.
72. Right-click the diagram surface - find Autoforms/Drop-Autoforms.
* Note that the tree is cleared of actions and ViewModels tagged with AutoForm.
73. Add back the AutoForms. Press Play Now instead of the debugger and pick ''Run Model and continue modeling''. 
* Familiarize yourself with the Menu and forms. 
* Note that this system uses the same data as in the debugger.
74. AutoForms are just the beginning - though, they may feel a bit clunky. Reduce clunkiness by setting properties in the model.
* For example, select association-end BrandOfCar, in propertyinspector find AutoForms and change the value from SearchAndPick to Combobox.
* Go to ''Autoforms'', then ''Create/Refresh Autoforms''.
* Save the model.
* Switch back to the WECPOF window that can be kept open while changing the model.
* Press MODEL-REFRESH. Notice this different way to assign brands.
75. Assign a null brand. Do you see the broken constraint?


==== Next Chapter ====
==== Next Chapter ====
Chapter 3 [[The_1000_steps_program_to_MDriven_76_to_105]]
[[The_1000_steps_program_to_MDriven_Chapter_3]]
[[Category:1000 Steps Program]]
[[Category:1000 Steps Program]]

Revision as of 05:18, 29 April 2024

This is Chapter 2. You should consider finishing Chapter 1 first.

Video 2: Auto-diagram, OCL, and Autoforms

To make your experience smooth, we set the main tags mentioned in the video to the right bar menu of this mini-player. Choose an interesting subtitle on the list and immediately get to the exact theme navigation item place in the video. Now you can pick any topic to be instructed on without watching the whole video.

Steps 41 - 75 Introduction Deleting and moving Association to self Auto-diagram and more deleting More Association OCL Autoforms


Chapter 2: Understanding Class-diagrams, Creating Classes, and Making Use of AutoForms and DefaultStringRepresentation

41. Open the location where you saved your file and make a copy in a subfolder called "TasksUpTo40". This helps you keep track of your progress and easily access previous versions of the file.

  • Copy both the modlr file and the Start Prototype Data XML file.
    • These files contain the values that you see in the debugger for the instances of the classes in the model.

42. Create a new class (Class1) on the diagram next to Person.

43. Drag on a relation (or association) from Class1 to Person.

  • This creates a relationship between the two classes.

44. Find Class1 in Tree and double-click to see the autodiagram.

45. Go back to the diagram, and select the relation by clicking the line. Press delete (del key). Deleting only removes the relation from the diagram, not from the model.

46. Search for Class1 in the Tree, click on the auto diagram, and observe that it is still there.

47. Go back to the diagram, right-click Class1, find Introduce&Remove, then select Re-introduce removed associations and click on it.

  • Notice that the association you removed is now back on the diagram.

48. Select the end of the association - note the blue circle. While pressing the ctrl key, click and hold the association end. Hold and drag the association end and let it go when you are over Car. You have now moved an association.

49. Check the AutoDiagram, click the different classes, and make sure it says the same thing as the diagram. Go back and forth a few times and move the association ends of this relation.

50. Select the Class1 - Press the delete key. Check the tree and auto diagram - it is still in the model. The delete key only removes things from the diagram - not from the model.

51. Find Class1 in Tree and click-drag it onto the diagram surface. Note that even its associations re-appear.

52. To delete something from a diagram and the model, you must press ctrl+delete.

  • Select the association by clicking the line.
  • Press ctrl+delete to delete.
  • Check the tree, and check that the autodiagram is gone.

53. Sometimes, you want a relation from a class back to the same class.

  • Create a relation by selecting the tool - click hold drag on Class1 - let go of the mouse button over the open diagram space.
  • Note the via point.
  • Move the mouse to yet a new position in the open diagram space - click to add yet a via point.
  • From here, move the mouse back over Class1 - click again. Note a relation to self has been created.

54. Check the autodiagram - note that Class1 now appears three times when shown. This is how an association to self is shown in an autodiagram.

55. The autodiagram always shows the selected class and its surroundings completely. A diagram only shows the things from the model you have explicitly added to it.

56. In the diagram, in Class1 - add two new attributes (right click - add Attribute - twice). Select attribute1 - press the delete key, and note that it disappears. Check the autodiagram - it still shows two attributes.

57. Go back to the diagram using the back-and-forth arrows next to the play button in the top toolbar.

58. Press ctrl-Z for undo - note that attribute1 re-appears.

59. Press ctrl-Y for redo - observe that attribute1 disappears again.

60. Right-click Class1, find Features/Pick Shown features, find attribute1, and move it back to shown - close the dialog.

  • Note that attribute1 is now back in the diagram Class1 display.

61. Select Class1 - press ctrl+delete. Now, Class1 is deleted, and it deleted its attributes and associations.

62. Create a new class and name it BrandOfCar. Remember to save your model often - ctrl-S.

63. Add an attribute of type string called Name.

64. Drag an association from Brand to Car. Note that the multiplicity marking on the association should say that Car can have 0..1 Brand, and Brand has 0..*(many) Cars.

65. Open the debugger - add Brand-instances (Open Brand seeker, Add new). Name them Volvo, BMW, and Tesla - save the Debugger data.

66. In the debugger, open Autoform of a Car.

  • Note the new ability to assign a Brand.
  • Use it to assign a Brand and save the data.

67. Go back to the diagram, (Close debugger + run dialog), select Car, and in property inspection, find DefaultStringRepresentation. Press the ... to open the OCL Editor.

OCL is a language that allows you to navigate and pinpoint everything in the model. You can write freehand OCL or use the context help of the OCL editor. All snippets of OCL code are called expressions. Expressions are like math functions, not only with numbers but also with information. The information you use in the expressions must be present in your model. This makes it easy to ensure that all expressions are valid. When you save the model, we start a validation and you will see a red dot when there is an error.
  • OCL is object-oriented - and the self/this variable of OCL is called self.
  • Write self. RegistrationNumber+' of type '+self.BrandOfCar.Name in the expression for DefaultStringRepresentation.
  • Click "okay" in the OCL editor. Save. Check for red dots. Try to introduce an error by saying Name2 instead of Name - save - see the red dot warning. Fix the issue.

68. The defaultStringRepresentations of an object is used whenever we are not explicit with an attribute and we need a representation in the string form of the object. The debugger Autoforms use this. Go into the debugger and see the header of Autoforms following your rule from above.

69. OCL is short for Object Constraints Language; many simple OCL tools use OCL only for constraints. In MDriven, we use OCL for almost everything.

  • Go to Car - find Constraint in property inspector - click ... Add a new Constraint.
  • The OCL expression of a constraint should validate to true; otherwise, the constraint is broken.
  • Add the constraint self.BrandOfCar->notempty.
  • This means that we will be true if we have a Brand associated and false if we do not.
  • Enter the description of the constraint: Cars MUST have a Brand! - say that this is of type Warning.

70. Go into debugger Autoforms. Check what happens when an object breaks the constraint (remove a brand of a car).

71. In MDriven, we can design ViewModels that use OCL expressions to build information elements that can be presented to a user. There is a quick way to do the default and show everything - it is called AutoForms.

  • Right-click the diagram surface and find Autoforms/Create-refresh-Autoforms.
  • Note the tree is filled up with ViewModels and Actions all tagged with AutoForm.

72. Right-click the diagram surface - find Autoforms/Drop-Autoforms.

  • Note that the tree is cleared of actions and ViewModels tagged with AutoForm.

73. Add back the AutoForms. Press Play Now instead of the debugger and pick Run Model and continue modeling.

  • Familiarize yourself with the Menu and forms.
  • Note that this system uses the same data as in the debugger.

74. AutoForms are just the beginning - though, they may feel a bit clunky. Reduce clunkiness by setting properties in the model.

  • For example, select association-end BrandOfCar, in propertyinspector find AutoForms and change the value from SearchAndPick to Combobox.
  • Go to Autoforms, then Create/Refresh Autoforms.
  • Save the model.
  • Switch back to the WECPOF window that can be kept open while changing the model.
  • Press MODEL-REFRESH. Notice this different way to assign brands.

75. Assign a null brand. Do you see the broken constraint?

Next Chapter

The_1000_steps_program_to_MDriven_Chapter_3

This page was edited 0 days ago on 05/17/2024. What links here