<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<!-- Documentation of MIRA - Model-based Integrated Requirements. -->
<html>
<head>
<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
<title>Introduction to Graphical Modeling Interface</title>
</head>
<body>
<div class="header">
<div class="box">
<div class="navbar">
<div class="dropdown">
<a href="../getting_started.html" style="padding:0;">
<button class="btn" id="hamburger">
<label for="hamburger" class="hamburger">
<span class="hamburgerLine"></span>
<span class="hamburgerLine"></span>
<span class="hamburgerLine"></span>
</label>
</button>
</a>
<div class="dropdown-content">
<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
<div class="dropdown-container">
<a href=".././managing_projects.html"> Create, Import, Export and Load AF3-Projects</a>
<a href=".././tipsAndTricks.html">Tips & Tricks</a>
<a href=".././af3_faq.html">FAQs</a>
</div>
<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
<div class="dropdown-container">
<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
<a href="../MIRA.glossary.html">Glossary</a>
<a href="../MIRA.requirements.html">Requirements</a>
</div>
<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
<div class="dropdown-container">
<a style="background-color:#f2f2f2;">Introduction to Graphical Modeling Interface</a>
<a href="component_architecture.html">Component Architecture Modeling</a>
<a href="data_dictionary.html">Data Dictionary: Types and Functions</a>
<a href="refactoring.html">Refactoring</a>
<a href="model_markers_view.html">On-the-fly Checks</a>
<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
<div class="dropdown-container">
<a href="code_specification.html">Code Specification</a>
<a href="state_automaton.html">State Automata</a>
<a href="hierarchical_state_automaton.html">Hierarchical State Automata</a>
<a href="mode_automaton.html"> Mode Automata</a>
</div>
<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
<div class="dropdown-container">
<a href="simulation_with_af3.html">Simulation</a>
<a href="operatorpanels.html">Operator Panels</a>
<a href="operatorpanels_advanced.html">Advanced Operator Panels</a>
<a href="cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
</div>
</div>
<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
<div class="dropdown-container">
<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
<div class="dropdown-container">
<a href="../ta/platform_architecture.html">Platform Architecture</a>
<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
<div class="dropdown-container">
<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
</div>
<a href="../ta/task_architecture.html">Task Architecture</a>
<a href="../ta/partition_architecture.html"> Partition Architecture</a>
<a href="../ta/allocations.html"> Deployments/Allocations</a>
<a href="../ta/system_schedule.html"> System Schedule</a>
</div>
<a href="../ta/code_generation.html">Code Generation</a>
</div>
<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
<div class="dropdown-container">
<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
<a href="../dse/constraints.html">Constraint Modeling</a>
<a href="../dse/objectives.html">Objective Modeling</a>
<a href="../dse/deployment_synthesis.html">Deployment Synthesis</a>
<a href="../dse/schedule_synthesis.html">Schedule Synthesis</a>
<a href="../dse/visualization.html">Solution Visualization</a>
</div>
<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
<div class="dropdown-container">
<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
<a href="../assuranceCases/maintenance.html">Change Impact Analysis</a>
</div>
<a href="../furtherResources.MainPage.html">Further Resources</a>
</div>
</div>
<div class="topnav-right">
<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'model_element_attribute.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'modelling and simulation'.
{Please specify the problem precisely here.}.">Report a Problem?</a>
</div>
</div>
</div>
</div>
<div class="box">
<button onclick="topFunction()" id="upBtn" title="Go to top">Top</button>
<h1>Introduction to Graphical Modeling Interface</h1>
<p>The graphical interface provides three different entry points for modelling:</p>
<ul>
<li><i>Editor</i> - main window (by default taking the most prominent space on
the screen) allowing to edit the most common information of a given element.
This is the window which opens when double-clicking on an element in the <i>Model
Navigator</i>.</li>
<li><i>Properties</i> - Information which does not fit in the editor or would make
the editor unreadable is generally to be found and edited in the properties view.
Properties should information about the <i>currently selected element</i>.
Therefore, to see the properties of a given element, you should first click on it
in the editor or in the model navigator.
The properties view should always be present, if not type "Properties" in the
Quick Access entry of the tool bar.</li>
<li><i>Annotations</i> - Similar to properties but also presents information of
the children of the selected element. Annotations allow to have a quick overview of
similar information along the hierarchy. For instance, instead of seeing
the name of the currently selected element only, you can also see in a convenient
table the name of <i>all the children of the selected element</i>.</li>
</ul>
<p>In the following, the different ways and the associated views will be described based on the simple <a href="component_architecture.html">component architecture</a> shown below.</p>
<img src="./pictures/ModelElementAttributesExample.png"/>
<p>The example is based, for the sake of simplicity, on a restricted version of AutoFOCUS containing only the so-called "component architecture plugin". It should therefore not come as a surprise if your
version of AutoFOCUS allows more specification, more properties or more annotations than showed in this help.</p>
<h2>Editor</h2>
<p>The main editor allows to describe models through diagrams as in this example, through text (e.g.,
for code specifications), through tables/trees (e.g., data dictionary), or through forms (e.g.,
requirements). In diagram or tree editors, the models can be edited by drag and dropping elements
from the Model Elements pane, or by right-clicking the elements in the model navigator.</p>
<img src="./pictures/ModelElementAttributesSpecifications.png" style='height: auto; width: auto'/>
<p>In the example, <i>Component1</i> contains two model elements:</p>
<ul>
<li><a href="code_specification.html">Code Specification</a></li>
<li>Component Specifications (deprecated)</li>
</ul>
<h2>Properties View</h2>
<p>The <i>Properties View</i> provides a local view on all properties of the currently
selected component. The following screenshot illustrates the properties of <i>Component1</i>.</p>
<img src="./pictures/ModelElementAttributesPropertiesView.png"/>
<p>The following properties are available (in the <i>General</i> tab) for any
model element type:</p>
<ul>
<li>Name</li>
<li>Comment</li>
<li>Strongly causal</li>
<li>Verification behavior</li>
</ul>
Note that name and comment are available for most elements in AutoFOCUS.
<p>The <i>Internal</i> is of no use for the standard user.</p>
<h2>Annotation View</h2>
<p> The <i>Annotation View</i> provides a global view on all model elements annotations within
the current project root element (e.g., within a <a href="component_architecture.html">Component Architecture</a> or a
<a href="ta/platform_architecture.html">Platform Architecture</a>).</p>
<h3>Overview</h3>
<p>In the <i>Annotation View</i>, each model element is represented as a row. The row for the model element that is currently selected in the associated model
diagram editor is highlighted with a green background.</p>
<img src="./pictures/ModelElementAttributesAnnotationView.png" width="100%"/>
<p>The view's columns represent the annotations that are associated with the respective model element. Here, the following three cases can be distinguished:</p>
<ul>
<li>White cell - the model element contains the respective annotation that is
<i>editable by the user</i>.</li>
<li>Grey cell - the model element <i>does not contain</i> the respective annotation.</li>
<li>Blue cell - the model element contains the respective annotation. However, its
value is the result of a calculation (and hence the cell is read-only).</li>
</ul>
<p>Like the <i>Properties View</i>, the <i>Annotation View</i> provides the following two annotations for any model element. </p>
<ul>
<li>Name</li>
<li>Comment</li>
</ul>
<p> In fact, the <i>Name</i> and <i>Comment</i> annotations provide an alternative way to access the corresponding properties.</p>
<h3>Annotation View Filters</h3>
<p>At the bottom, the <i>Annotation View</i> provides a number of row and column filters.</p>
<p>Here, the following <i>row filters</i> can be used to restrict the set of model elements that is shown in the view:</p>
<ul>
<li><i>Filter model element name</i>: only model elements are shown whose name matches the filter string.</li>
<li><i>Filter model element type</i>: if checked, only model elements are shown that have the same type
as the model element that is selected in the associated model diagram editor.</li>
<li><i>Filter model element hierarchy level</i>: Filters the set of model elements based on the model structure. The following options are available:
<ul>
<li><i>Show all levels</i>: Any model element beneath the currently selected project root element is shown.</li>
<li><i>Show current level</i>: Only model elements are shown that have the same hierarchy level as the currently selected model element.</li>
<li><i>Show selected sub-model</i>: The currently selected sub-model and its entire offspring is shown.</li>
</ul>
</li>
</ul>
<p>The following <i>column filters</i> can be used to restrict the set of annotations that is shown in the view:</p>
<ul>
<li><i>Filter annotations name</i>: only annotations are shown whose name matches the filter string.</li>
<li><i>Filter annotation type</i>: either all annotation types, or only annotations of the selected type are shown.</li>
</ul>
</div>
<script src="../layout/jsscript/topBtn.js"></script>
<script src="../layout/jsscript/submenuScript.js"></script>
<div class="footer">
<p>
© 2020 <a href="https://www.fortiss.org/">fortiss GmbH</a> •
<a href="https://www.fortiss.org/en/publications/software/autofocus-3#c2007">Contact</a> •
<a href="https://www.fortiss.org/en/imprint">Imprint</a>
</p>
</div>
</body>
</html>