CODEWITHSUNDEEP
dartflutterstepper
harunB10
harunB10

Reputation: 5197

Flutter Stepper horizontal type not working

I have a problem with changing the Stepper type from vertical to horizontal.

This is my code:

body: new ListView.builder(
    itemCount: data == null ? 0 : 5,
    itemBuilder: (BuildContext context, int index) {
      return new Card(
          //child: new Text(data[index]["title"]),
          child: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Stepper(
          steps: my_steps,
          type: StepperType.horizontal,
          controlsBuilder: (BuildContext context,
              {VoidCallback onStepContinue, VoidCallback onStepCancel}) {
            return Row(
              children: <Widget>[
                Container(
                  child: null,
                ),
                Container(
                  child: null,
                ),
              ],
            );
          },
          //type: StepperType.horizontal,
        ),
      ));
    },
  ),

After I uncomment the type I get this error:

I/flutter (10148): ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════ I/flutter (10148): The following assertion was thrown during performLayout(): I/flutter (10148): RenderFlex children have non-zero flex but incoming height constraints are unbounded. I/flutter (10148): When a column is in a parent that does not provide a finite height constraint, for example if it is I/flutter (10148): in a vertical scrollable, it will try to shrink-wrap its children along the vertical axis. Setting a I/flutter (10148): flex on a child (e.g. using Expanded) indicates that the child is to expand to fill the remaining I/flutter (10148): space in the vertical direction.

Upvotes: 3

Views: 7668

Answers (2)

Miguel Ruivo
Miguel Ruivo

Reputation: 17746

Your ListView has unbounded heigh so it doesn't know how much space to use for each child, which is a Stepper. Give it some constraints, such minimum height size for each and you should be fine. 

 (...)
 ConstrainedBox(
              constraints: BoxConstraints.tightFor(height: 200.0),
              child: Stepper(
                steps: my_steps(),
                type: StepperType.horizontal,
 (...)

Upvotes: 2

saeid gh
saeid gh

Reputation: 130

You can use the SizedBox() or Container() widget and set it height

SizedBox(
      height: 200,
      child: Card(
        //child: new Text(data[index]["title"]),
          child: Padding(
            padding: const EdgeInsets.all(8.0),
            child: Stepper(
              steps: my_steps(),
              type: StepperType.horizontal,
              controlsBuilder: (BuildContext context,
                  {VoidCallback onStepContinue, VoidCallback onStepCancel}) {
                return Row(
                  children: <Widget>[
                    Container(
                      child: null,
                    ),
                    Container(
                      child: null,
                    ),
                  ],
                );
              },
              //type: StepperType.horizontal,
            ),
          )),
    )

Upvotes: 1

Related Questions