Flutter:PageView在更改屏幕时松开轮播 [英] Flutter : PageView loosing Carousel while changing the screen
本文介绍了Flutter:PageView在更改屏幕时松开轮播的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在使用以下代码使用PageView旋转木马
I'm using below code to Carousel using PageView
PageView.builder(
onPageChanged: (value) {
setState(() {
currentpage = value;
});
},
controller: controller,
itemCount: data.length,
itemBuilder: (context, index) {
return GestureDetector(
onTap: () {
debugPrint('Nilesh Rathod $index');
if (index == 0) {
Navigator.push(
context,
PageTransition(
type: PageTransitionType
.rightToLeft,
child: DetailPage()))
.then((value) {
debugPrint('nilu pilu');
controller.jumpToPage(0);
});
}
},
child: AnimatedBuilder(
animation: controller,
builder: (context, child) {
double value = 1.0;
if (controller.position.haveDimensions) {
value = controller.page - index;
value = (1 - (value.abs() * .5))
.clamp(0.0, 1.0);
}
return Align(
alignment: Alignment.topCenter,
child: SizedBox(
height:
Curves.easeOut.transform(value) *
300,
width:
Curves.easeOut.transform(value) *
250,
child: child,
),
);
},
child: Stack(children: <Widget>[
index == 0
? Container(
height: 300,
width: 220,
child: IconButton(
onPressed: () {
Utils.changeScreen(
context, CreateTripApp());
},
icon: Image.asset(
'assets/images/flight.png',
height: 120,
fit: BoxFit.cover,
width: 100,
),
),
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage(
'assets/images/home.png'),
fit: BoxFit.cover,
),
borderRadius: BorderRadius.all(
Radius.circular(20.0),
),
))
: Container(
height: 300,
width: 220,
decoration: BoxDecoration(
color: index % 2 == 0
? Colors.red
: Colors.green,
borderRadius:
BorderRadius.all(
Radius.circular(
20.0))),
),
Positioned(
bottom: 30,
right: 10,
left: 10,
child: index == 0
? Align(
alignment:
Alignment.bottomCenter,
child: Text(
Constants.createYourTrip,
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.white,
fontSize: 16.0,
fontFamily:
Fonts.standardBold,
),
))
: Align(
alignment:
Alignment.bottomCenter,
child: Text(
'Hello There',
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.white,
fontSize: 16.0,
fontFamily:
Fonts.standardBold,
),
)))
]),
),
);
})
其工作罚款除外
但是当导航到另一页面时,我失去了轮播效果,请检查以下屏幕截图相同
but when navigate to another page I'm loosing Carousel effect please check below screenshot for the same
如果需要更多信息,请执行让我知道。提前致谢。
If need more information please do let me know. Thanks in advance. Your efforts will be appreciated.
推荐答案
有点晚了,但是我通过在controller.position.haveDimensions时设置值来解决了这个问题。是错误的,它不是起始索引(在我的情况下为零)。
A bit late, but I solved this by setting the value when the controller.position.haveDimensions is false and it's not the starting index (in my case, zero).
if (_controller.position.haveDimensions) {
value = _controller.page - index;
value = (1 - (value.abs() * .5)).clamp(0.0, 1.0);
}
else if (index != 0)
value = 0.5;
这篇关于Flutter:PageView在更改屏幕时松开轮播的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文