title: Customize Stepper in Flutter
body: <p>I want to customize the Steppers in flutter. </p>
  
  <ol>
  <li><p>How can I place the <strong>Step title</strong> to the left of each step bar?</p></li>
  <li><p>How can I change the line bar to the <strong>dotted bar</strong> of the <strong>stepper</strong>?</p></li>
  <li><p>And how can I customize the <strong>state</strong> of the <strong>step</strong> other than the 5 <strong>StepState</strong> provided like a round bubble?</p></li>
  </ol>
  
  <p>Here is my code.</p>
  
  <pre><code>Container(
    child: Stepper(
      currentStep: 0,
      controlsBuilder: (BuildContext context, {
        VoidCallback onStepContinue,
        VoidCallback onStepCancel
      }) =&gt; Container(),
      steps: [
        Step(
          content: Container(
            child: Card(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.stretch,
                children: &lt;Widget&gt;[
                  Text('9:00Am - 10:00AM'),
                  Text(
                    'Everest Tour',
                    style: TextStyle(fontWeight: FontWeight.bold),
                  ),
                ],
              ),
            ),
          ),
          title: Text('9:00 AM'),
        ),
        Step(
          content: Text('2nd Data'),
          title: Text('10:00 AM'),
          state: StepState.editing,
          isActive: true,
          subtitle: Text('subtitle')
        )
      ],
    ),
  )
  </code></pre>