sternri54439
/
Masterarbeit


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202
							<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="description" content="API docs for the build method from the SideBarContentState class, for the Dart programming language.">
  <title>build method - SideBarContentState class - SideBarContent library - Dart API</title>
  <!-- required because all the links are pseudo-absolute -->
  <base href="../..">

  <link href="https://fonts.googleapis.com/css?family=Source+Code+Pro:500,400i,400,300|Source+Sans+Pro:400,300,700" rel="stylesheet">
  <link rel="stylesheet" href="static-assets/github.css">
  <link rel="stylesheet" href="static-assets/styles.css">
  <link rel="icon" href="static-assets/favicon.png">

</head>

<body>

<div id="overlay-under-drawer"></div>

<header id="title">
  <button id="sidenav-left-toggle" type="button">&nbsp;</button>
  <ol class="breadcrumbs gt-separated dark hidden-xs">
    <li><a href="index.html">touch_demonstrator</a></li>
    <li><a href="pages_SideBarContent/pages_SideBarContent-library.html">SideBarContent</a></li>
    <li><a href="pages_SideBarContent/SideBarContentState-class.html">SideBarContentState</a></li>
    <li class="self-crumb">build method</li>
  </ol>
  <div class="self-name">build</div>
  <form class="search navbar-right" role="search">
    <input type="text" id="search-box" autocomplete="off" disabled class="form-control typeahead" placeholder="Loading search...">
  </form>
</header>

<main>

  <div class="col-xs-6 col-sm-3 col-md-2 sidebar sidebar-offcanvas-left">
    <h5>SideBarContentState class</h5>
    <ol>
      <li class="section-title"><a href="pages_SideBarContent/SideBarContentState-class.html#constructors">Constructors</a></li>
      <li><a href="pages_SideBarContent/SideBarContentState/SideBarContentState.html">SideBarContentState</a></li>
    
      <li class="section-title inherited">
        <a href="pages_SideBarContent/SideBarContentState-class.html#instance-properties">Properties</a>
      </li>
      <li class="inherited"><a href="pages_SideBarContent/SideBarContentState/context.html">context</a></li>
      <li class="inherited"><a href="pages_SideBarContent/SideBarContentState/hashCode.html">hashCode</a></li>
      <li class="inherited"><a href="pages_SideBarContent/SideBarContentState/mounted.html">mounted</a></li>
      <li class="inherited"><a href="pages_SideBarContent/SideBarContentState/runtimeType.html">runtimeType</a></li>
      <li class="inherited"><a href="pages_SideBarContent/SideBarContentState/widget.html">widget</a></li>
    
      <li class="section-title"><a href="pages_SideBarContent/SideBarContentState-class.html#instance-methods">Methods</a></li>
      <li><a href="pages_SideBarContent/SideBarContentState/build.html">build</a></li>
      <li class="inherited"><a href="pages_SideBarContent/SideBarContentState/deactivate.html">deactivate</a></li>
      <li class="inherited"><a href="pages_SideBarContent/SideBarContentState/debugFillProperties.html">debugFillProperties</a></li>
      <li class="inherited"><a href="pages_SideBarContent/SideBarContentState/didChangeDependencies.html">didChangeDependencies</a></li>
      <li class="inherited"><a href="pages_SideBarContent/SideBarContentState/didUpdateWidget.html">didUpdateWidget</a></li>
      <li class="inherited"><a href="pages_SideBarContent/SideBarContentState/dispose.html">dispose</a></li>
      <li class="inherited"><a href="pages_SideBarContent/SideBarContentState/initState.html">initState</a></li>
      <li class="inherited"><a href="pages_SideBarContent/SideBarContentState/noSuchMethod.html">noSuchMethod</a></li>
      <li class="inherited"><a href="pages_SideBarContent/SideBarContentState/reassemble.html">reassemble</a></li>
      <li class="inherited"><a href="pages_SideBarContent/SideBarContentState/setState.html">setState</a></li>
      <li class="inherited"><a href="pages_SideBarContent/SideBarContentState/toDiagnosticsNode.html">toDiagnosticsNode</a></li>
      <li class="inherited"><a href="pages_SideBarContent/SideBarContentState/toString.html">toString</a></li>
      <li class="inherited"><a href="pages_SideBarContent/SideBarContentState/toStringShort.html">toStringShort</a></li>
    
      <li class="section-title inherited"><a href="pages_SideBarContent/SideBarContentState-class.html#operators">Operators</a></li>
      <li class="inherited"><a href="pages_SideBarContent/SideBarContentState/operator_equals.html">operator ==</a></li>
    
    
    </ol>
  </div><!--/.sidebar-offcanvas-->

  <div class="col-xs-12 col-sm-9 col-md-8 main-content">
    <h1>build method</h1>

    <section class="multi-line-signature">
      <div>
        <ol class="annotation-list">
          <li>@override</li>
        </ol>
      </div>
      <span class="returntype">Widget</span>
      <span class="name ">build</span>
(<wbr><span class="parameter" id="build-param-context"><span class="type-annotation">BuildContext</span> <span class="parameter-name">context</span></span>)
      
    </section>
    <section class="desc markdown">
      <p>Describes the part of the user interface represented by this widget.</p>
<p>The framework calls this method in a number of different situations:</p><ul><li>After calling <a href="pages_SideBarContent/SideBarContentState/initState.html">initState</a>.</li><li>After calling <a href="pages_SideBarContent/SideBarContentState/didUpdateWidget.html">didUpdateWidget</a>.</li><li>After receiving a call to <a href="pages_SideBarContent/SideBarContentState/setState.html">setState</a>.</li><li>After a dependency of this <code>State</code> object changes (e.g., an
<code>InheritedWidget</code> referenced by the previous <a href="pages_SideBarContent/SideBarContentState/build.html">build</a> changes).</li><li>After calling <a href="pages_SideBarContent/SideBarContentState/deactivate.html">deactivate</a> and then reinserting the <code>State</code> object into
the tree at another location.</li></ul>
<p>The framework replaces the subtree below this widget with the widget
returned by this method, either by updating the existing subtree or by
removing the subtree and inflating a new subtree, depending on whether the
widget returned by this method can update the root of the existing
subtree, as determined by calling <code>Widget.canUpdate</code>.</p>
<p>Typically implementations return a newly created constellation of widgets
that are configured with information from this widget's constructor, the
given <code>BuildContext</code>, and the internal state of this <code>State</code> object.</p>
<p>The given <code>BuildContext</code> contains information about the location in the
tree at which this widget is being built. For example, the context
provides the set of inherited widgets for this location in the tree. The
<code>BuildContext</code> argument is always the same as the <code>context</code> property of
this <code>State</code> object and will remain the same for the lifetime of this
object. The <code>BuildContext</code> argument is provided redundantly here so that
this method matches the signature for a <code>WidgetBuilder</code>.</p>
<h2 id="design-discussion">Design discussion</h2>
<h3 id="why-is-the-build-method-on-state-and-not-statefulwidget">Why is the <a href="pages_SideBarContent/SideBarContentState/build.html">build</a> method on <code>State</code>, and not <code>StatefulWidget</code>?</h3>
<p>Putting a <code>Widget build(BuildContext context)</code> method on <code>State</code> rather
putting a <code>Widget build(BuildContext context, State state)</code> method on
<code>StatefulWidget</code> gives developers more flexibility when subclassing
<code>StatefulWidget</code>.</p>
<p>For example, <code>AnimatedWidget</code> is a subclass of <code>StatefulWidget</code> that
introduces an abstract <code>Widget build(BuildContext context)</code> method for its
subclasses to implement. If <code>StatefulWidget</code> already had a <a href="pages_SideBarContent/SideBarContentState/build.html">build</a> method
that took a <code>State</code> argument, <code>AnimatedWidget</code> would be forced to provide
its <code>State</code> object to subclasses even though its <code>State</code> object is an
internal implementation detail of <code>AnimatedWidget</code>.</p>
<p>Conceptually, <code>StatelessWidget</code> could also be implemented as a subclass of
<code>StatefulWidget</code> in a similar manner. If the <a href="pages_SideBarContent/SideBarContentState/build.html">build</a> method were on
<code>StatefulWidget</code> rather than <code>State</code>, that would not be possible anymore.</p>
<p>Putting the <a href="pages_SideBarContent/SideBarContentState/build.html">build</a> function on <code>State</code> rather than <code>StatefulWidget</code> also
helps avoid a category of bugs related to closures implicitly capturing
<code>this</code>. If you defined a closure in a <a href="pages_SideBarContent/SideBarContentState/build.html">build</a> function on a
<code>StatefulWidget</code>, that closure would implicitly capture <code>this</code>, which is
the current widget instance, and would have the (immutable) fields of that
instance in scope:</p>
<pre class="language-dart"><code class="language-dart">class MyButton extends StatefulWidget {
  ...
  final Color color;

  @override
  Widget build(BuildContext context, MyButtonState state) {
    ... () { print("color: $color"); } ...
  }
}
</code></pre>
<p>For example, suppose the parent builds <code>MyButton</code> with <code>color</code> being blue,
the <code>$color</code> in the print function refers to blue, as expected. Now,
suppose the parent rebuilds <code>MyButton</code> with green. The closure created by
the first build still implicitly refers to the original widget and the
<code>$color</code> still prints blue even through the widget has been updated to
green.</p>
<p>In contrast, with the <a href="pages_SideBarContent/SideBarContentState/build.html">build</a> function on the <code>State</code> object, closures
created during <a href="pages_SideBarContent/SideBarContentState/build.html">build</a> implicitly capture the <code>State</code> instance instead of
the widget instance:</p>
<pre class="language-dart"><code class="language-dart">class MyButtonState extends State&lt;MyButton&gt; {
  ...
  @override
  Widget build(BuildContext context) {
    ... () { print("color: ${widget.color}"); } ...
  }
}
</code></pre>
<p>Now when the parent rebuilds <code>MyButton</code> with green, the closure created by
the first build still refers to <code>State</code> object, which is preserved across
rebuilds, but the framework has updated that <code>State</code> object's <a href="pages_SideBarContent/SideBarContentState/widget.html">widget</a>
property to refer to the new <code>MyButton</code> instance and <code>${widget.color}</code>
prints green, as expected.</p>
<p>See also:</p><ul><li>The discussion on performance considerations at <code>StatefulWidget</code>.</li></ul>
    </section>
    
    <section class="summary source-code" id="source">
      <h2><span>Implementation</span> </h2>
      <pre class="language-dart"><code class="language-dart">@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: Text(&#39;${widget.title}&#39;),
    ),
    body:  SafeArea(child: Container()));
}</code></pre>
    </section>

  </div> <!-- /.main-content -->

  <div class="col-xs-6 col-sm-6 col-md-2 sidebar sidebar-offcanvas-right">
  </div><!--/.sidebar-offcanvas-->

</main>

<footer>
  <span class="no-break">
    touch_demonstrator 1.0.0+1
  </span>

</footer>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="static-assets/typeahead.bundle.min.js"></script>
<script src="static-assets/highlight.pack.js"></script>
<script src="static-assets/URI.js"></script>
<script src="static-assets/script.js"></script>


</body>

</html>