i have a design which is been converted to svg for me to display it in my flutter.. here is the design.
but if i render it to my flutter project with this plugin is not displaying well. here is the result.
here is my code
CarouselController buttonCarouselController = CarouselController();
int pageIndex = 0; final List imgList = [ 'assets/1b.svg', 'assets/2b.svg', 'assets/3b.svg', 'assets/4b.svg', 'assets/5b.svg', 'assets/6b.svg', 'assets/background.svg', ];
return Scaffold(
body: CarouselSlider(
items: imgList.map((i) {
return Stack(
children: [
Container(
height: double.infinity,
width: double.infinity,
child: SvgPicture.asset(
i,
fit: BoxFit.fill,
allowDrawingOutsideViewBox: true,
),
),
Padding(
padding: EdgeInsets.all(30.0),
child: Align(
alignment: Alignment.bottomRight,
child: Container(
child: GestureDetector(
onTap: () async {
await addPreference('onboard', true);
Navigator.pushNamed(context, '/userOption');
},
child: Text(
'Skip',
style: TextStyle(
color: pageIndex == 3 ? Colors.white : Colors.white,
fontSize: 20,
),
),
),
),
),
)
],
);
}).toList(),
carouselController: buttonCarouselController,
options: CarouselOptions(
autoPlay: true,
onPageChanged: (i, r) {
setState(() {
pageIndex = i;
});
switch (pageIndex) {
case 6:
{
addPreference('onboard', true);
Navigator.pushNamed(context, '/userOption');
}
break;
}
},
viewportFraction: 1.0,
aspectRatio: 2.0,
initialPage: 0,
autoPlayInterval: Duration(seconds: 4),
enlargeCenterPage: false,
height: double.infinity,
),
),
);
}
}
If you run svgcleaner on this SVG it will work. Or if you manually reorder the defs to the top.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With