Reputation: 613
I built a stepper bar using another stepperbar dependency(" another_stepper: ^1.0.4
"). It's working nicely.
like this...
But I want to add separate images to these steps. When I tried that was not displayed. It displays "unable to load".I can't understand the reason for that. I added image in correctly in the "pubspec.yaml"file
my code
@override
State<BarScreen> createState() => _BarScreenState();
}
class _BarScreenState extends State<BarScreen> {
List<StepperData> stepperData = [
StepperData(
title: "Order Placed",
subtitle: "",
),
StepperData(
title: "Preparing",
subtitle: "",
),
StepperData(
title: "On the way",
subtitle: "",
),
StepperData(
title: "Delivered",
subtitle: "",
),
];
@override
void initState() {
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
child: Padding(
padding: const EdgeInsets.only(left: 20),
child: AnotherStepper(
stepperList: stepperData,
stepperDirection: Axis.vertical,
horizontalStepperHeight: 70,
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('assests/logo.png'),
height: 10,
width: 10,
),
]),
Row(children: const <Widget>[
Image(
image: AssetImage('assests/logo.png'),
height: 10,
width: 1,
),
]),
],
)),
activeBarColor: Colors.green,
inActiveBarColor: Colors.grey,
activeIndex: 2,
barThickness: 8,
),
),
),
);
}
}
How to add separate images?
Upvotes: 0
Views: 157
Reputation: 1242
Maybe your folder name is incorrect.
change image: AssetImage('assests/logo.png'),
to image: AssetImage('assets/logo.png'),
Upvotes: 1