[FIXED] Wie füge ich beim Flattern separate Bilder in die Schrittleiste ein?

Ausgabe

Ich möchte Schrittbilder zu jedem Schritt in der “Anotherstepper”-Leiste hinzufügen, wie geht das?

Beispiel: Beim Schritt 1-Kreis möchte ich ein Schritt 1-Bild hinzufügen. Beim 2. Schritt 2-Kreis möchte ich ein Schritt 2-Bild hinzufügen. Ich hoffe, Sie können verstehen, was ich meine.

Code

Container(
        width: 500,
        height: 500,
        child: AnotherStepper(
          stepperList: stepperData,
          stepperDirection: Axis.horizontal,
          horizontalStepperHeight: 100,
          dotWidget: Container(
            padding: const EdgeInsets.all(8),
            decoration: const BoxDecoration(
                color: Colors.green,
                borderRadius: BorderRadius.all(Radius.circular(30))),
            child: Column(
              children: <Widget>[
                Row(children: const <Widget>[
                  Image(
                    image: AssetImage('assets/step1.png'),
                    height: 20,
                    width: 20,
                  ),
                ]),
                Row(children: const <Widget>[
                  Image(
                    image: AssetImage('assets/step2.png'),
                    height: 20,
                    width: 20,
                  ),
                ]),
              ],
            ),
          ),
          activeBarColor: Colors.green,
          inActiveBarColor: Colors.grey,
          activeIndex: 2,
          barThickness: 8.5,
          gap: 30,
        ),
      ),
    );
  }
}

late double activeIndex;
  List<StepperData> stepperData = [
    StepperData(
      title: "",
      subtitle: "",
    ),
    StepperData(
      title: "",
      subtitle: "",
    ),
    StepperData(
      title: "",
      subtitle: "",
    ),
    StepperData(
      title: "",
      subtitle: "",
    ),
  ];
  @override
  void initState() {
    super.initState();
  }

Ich will so

Geben Sie hier die Bildbeschreibung ein

Aber meine Ausgabe

Geben Sie hier die Bildbeschreibung ein

Lösung

Sie verwenden https://pub.dev/packages/another_stepper

dieses another_stepperPaket, aber es unterstützt keine verschiedenen Bilder, es unterstützt nur ein Bild. Bitte verwenden Sie ein anderes Stepper-Paket.

Ich schlage vor, mit diesem zu gehen:
https://pub.dev/packages/im_stepper
im_stepper


Beantwortet von –
Aviraj Patel


Antwort geprüft von –
David Goodson (FixError Volunteer)

0 Shares:
Leave a Reply

Your email address will not be published. Required fields are marked *

You May Also Like