I want spacing between text and image but here row spaceBetween is not working,
and when I am using expanded then i am getting error. how to resolve this.
This is my code.
AspectRatio(
aspectRatio: 16 / 4.5,
child: ListView.separated(
physics: BouncingScrollPhysics(),
separatorBuilder: (context, index) => Divider(
indent: 12,
),
scrollDirection: Axis.horizontal,
itemCount: myPizza.length,
itemBuilder: (context, index) {
return Padding(
padding: EdgeInsets.only(
left: index == 0 ? 20 : 0,
right: index == myPizza.length - 1 ? 20 : 0),
child: ClipRRect(
borderRadius: BorderRadius.circular(8),
child:Container(
padding: EdgeInsets.only(top: 9, left: 9, right: 9, bottom: 9),
decoration: BoxDecoration(
color: MyColor.blueColor.withOpacity(0.06),
),
child: Column(crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"Crinkle Fries",
style: textStyleWith12500(MyColor.blackColor),
),
Text(
"₹ 99",
style: textStyleWith10500(MyColor.greenColor),
),
],
),
Stack(
fit: StackFit.passthrough,
children: [
Container(
height: 46,
width: 46,
decoration: BoxDecoration(
color: MyColor.whiteColor,
borderRadius: BorderRadius.circular(4),
boxShadow: [
BoxShadow(
color: MyColor.greyColor.withOpacity(0.35),
blurRadius: 3.0,
),
],
),
child: Container(
height: 46,
width: 46,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(4),
image: DecorationImage(
image: AssetImage('assets/BannerImages/card1.png'),
fit: BoxFit.fill,
)),
),
),
Positioned(
top: 5,
right: 5,
child: Image.asset(
"assets/verification_icon.png",
height: 9,
width: 8.5,
))
],
),
],
),
SizedBox(
height: 10,
),
Container(
height: 24,
width: 147,
child: ButtonWithTextStyle(
onPressed: () {},
btnColor: MyColor.primaryRedColor,
btnText: "ADD",
btnTextStyle: textStyleWith10500(MyColor.whiteColor),
radius: 4.0,
),
)
],
),
),
),
);
}),
),
2
Answers
Check my code, i have used Spacer widget between text and image
You can use Spacer widget to achieve your functionality 🙂 Nice.
just wrap your
Stack
withPadding
and assign padding of left: