title: Theme.of(context) as const
body: <p>I have several places with repetitive codes, for <code>BoxDecoration</code></p>
  
  <pre class="lang-dart prettyprint-override"><code>decoration: BoxDecoration(
                      color: Theme.of(context).primaryColor,
                      borderRadius: BorderRadius.circular(5),
                      boxShadow: [
                        BoxShadow(
                            color: Theme.of(context).hintColor.withOpacity(0.15),
                            offset: Offset(0, 3),
                            blurRadius: 10)
                      ],
                    ),
  </code></pre>
  
  <p>So I'd like to extract the <code>BoxDecoration</code> into separated dart file and reuse it.<br>
  Something like </p>
  
  <pre class="lang-dart prettyprint-override"><code>static const boxDecoration = BoxDecoration(...);
  </code></pre>
  
  <p>then use it</p>
  
  <pre class="lang-dart prettyprint-override"><code>final container = Container(
  decoration: boxDecoration
  )
  </code></pre>
  
  <p>But I get stuck on few things:
  1. If I put it on file that only contains constants, I still need to access <code>context</code>, e.g. in <code>Theme.of(context).primaryColor</code>, which can only retrieved from <code>build(Context)</code> method
  2. Then, I create a new stateless widget</p>
  
  <pre class="lang-dart prettyprint-override"><code>import 'package:flutter/material.dart';
  
  class FlutterTemplateStyle extends StatelessWidget {
    static var boxDecoration;
  
    @override
    Widget build(BuildContext context) {
      boxDecoration = BoxDecoration(
        color: Theme.of(context).primaryColor,
        borderRadius: BorderRadius.circular(5),
        boxShadow: [
          BoxShadow(
              color: Theme.of(context).hintColor.withOpacity(0.15),
              offset: Offset(0, 3),
              blurRadius: 10)
        ],
      );
  
      return Container();
    }
  }
  
  </code></pre>
  
  <p>And try to access <code>decoration: FlutterTemplateStyle.boxDecoration</code>, which doesn't work. I suppose this is because <code>build</code> is never called.</p>
  
  <p>How can I achieve this constant styling?</p>
  
  <p>Thanks</p>