如何计算点指示器的横幅/页面数量?我正在使用smooth_page_indicator pub.dev 上可用的软件包



我必须返回PageView中的页面数,以便如果横幅数量增加或减少,DotsAnimatedWidget- AnimatedSmoothIndicator中的'count'值会自动更新。有没有办法计算PageView中的页面数或子页面数?我应该换一种方式吗?所用软件包的链接:https://pub.dev/packages/smooth_page_indicator

class _BannerWidgetState extends State<BannerWidget> {
int _pages = 0; 
final _controller = PageController();
@override
Widget build(BuildContext context) {
return Stack(
children: [
Padding(
padding: const EdgeInsets.fromLTRB(10, 0, 10, 10),
child: ClipRRect(
borderRadius: BorderRadius.circular(5),
child: Container(
height: 140,
width: MediaQuery.of(context).size.width,
color: Colors.white,
child: PageView(
controller: _controller,
onPageChanged: ((val) {
setState(() {
_pages = val.toInt();
});
}),
children: const [
Center(
child: Text(
'Banner 1',
style: TextStyle(fontSize: 20),
),
),
Center(
child: Text(
'Banner 2',
style: TextStyle(fontSize: 20),
),
),
Center(
child: Text(
'Banner 3',
style: TextStyle(fontSize: 20),
),
),

],
),
),
),
),
DotsIndicatorWidget(pages: _pages),
],
);
}
}
class DotsIndicatorWidget extends StatelessWidget {
const DotsIndicatorWidget({
Key? key,
required int pages,
})  : _pages = pages,
super(key: key);
final int _pages;
@override
Widget build(BuildContext context) {
return Positioned.fill(
bottom: 18,
child: Align(
alignment: Alignment.bottomCenter,
child: Row(
//mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
children: [
AnimatedSmoothIndicator(
activeIndex: _pages,
count: 3,
effect: const WormEffect(
spacing: 4.0,
activeDotColor: Colors.green,
dotColor: Colors.grey,
dotHeight: 8.0,
dotWidth: 8.0,
radius: 3,
type: WormType.normal),
),
],
),
),
);
}
}

为PageView的子元素创建变量

List<Widget> _pages = [some Container]
int _currentIndex = 0;

并在onPageChanged()上更新

onPageChanged: ((page) {
setState(() {
_currentIndex = page.toInt();
});
}),

计算PageView中使用的页面数:_pages.length

但我认为,使用包smooth_page_indicator是最好的方法

相关内容

  • 没有找到相关文章

最新更新