在我的应用程序中,我决定显示 a ,因为在 the和 the中都需要ScrollBar
相同的内容,我不得不将我的更改为 a 。首先是一个(所以在索引 0 处)有一些“幻灯片”,然后是其他小部件“内容”,它们是幻灯片的解释。在每张幻灯片中都有一个按钮,用于调用幻灯片的说明。当我使用时,它按预期工作,跳转到正确的“内容”,但它并没有......它只是移动了几个像素,就是这样......我设置错误或缺少设置现在与?ScrollController
ScrollBar
ListView
ScrollablePositionedList.builder
ListView.builder
List<Widget> homePageItems
PageView
controller.jumpTo();
ScrollablePositionedList.builder
scrollController.jumpTo(index: 5);
ListView.builder
ListView.builder
ListView 项目:
List<Widget> homePageItems = [
// carousell index 0
SizedBox(
height: MediaQuery.of(context).size.height > 700 ? MediaQuery.of(context).size.height * 0.89 : MediaQuery.of(context).size.height * 0.85,//580,
width: MediaQuery.of(context).size.width,
child: Stack(
alignment: AlignmentDirectional.center,
children: [
Column(
children: [
Expanded(
child: PageView.builder(
controller: pageController,
onPageChanged: (index) {
timer.cancel();
setState(() {
if (index > _index) {
_current < slides.length -1 ? _current++ : _current = 0;
_index = index;
} else {
_current > 0 ? _current -- : _current = slides.length -1;
_index = index;
}
print('onPageChanged: index is : $index');
print('onPageChanged: _current is : $_current');
});
},
itemBuilder: (context, index){
return slides[_current];
}),
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: slides.map((url) {
int index = slides.indexOf(url);
return Container(
width: 5.0,
height: 5.0,
margin: EdgeInsets.symmetric(vertical: 5.0, horizontal: 2.0),
decoration: BoxDecoration(
shape: BoxShape.circle,
color: _current == index
? Colors.redAccent//Color.fromRGBO(0, 0, 0, 0.9)
: Colors.black54,//Color.fromRGBO(0, 0, 0, 0.4),
),
);
}).toList(),
),
],
),
Row(
children: [
IconButton(
icon: Icon(CupertinoIcons.back,color:Colors.white.withAlpha(170),size: 40,),
onPressed: (){
timer.cancel();
pageController.previousPage(duration: Duration(milliseconds: 800), curve: Curves.fastOutSlowIn);
}),
IconButton(
icon: Icon(CupertinoIcons.forward,color: Colors.white.withAlpha(150),size: 40,),
onPressed: () {
timer.cancel();
pageController.nextPage(duration: Duration(milliseconds: 800), curve: Curves.fastOutSlowIn);
}),
],
mainAxisAlignment: MainAxisAlignment.spaceBetween,
),
],
),
),
// Cloud Biking index 1
SizedBox(
height: MediaQuery.of(context).size.height > 700
? MediaQuery.of(context).size.height * 0.89
: 700,//MediaQuery.of(context).size.height * 0.90,//580,
width: MediaQuery.of(context).size.width,
child: CloudBikingContent(key: widget.key,)
),
// Stolen bicycles index 2
SizedBox(
height: MediaQuery.of(context).size.height > 700
? MediaQuery.of(context).size.height * 0.95
: 800,//MediaQuery.of(context).size.height * 0.90,//580,
width: MediaQuery.of(context).size.width,
child: StolenBicyclesContent(key: widget.key),
),
// Scheduler index 3
SizedBox(
height: MediaQuery.of(context).size.height > 700
? MediaQuery.of(context).size.height * 0.89 // Web
: 870,//MediaQuery.of(context).size.height * 0.90,//580, // Mobile
width: MediaQuery.of(context).size.width,
child: SchedulerContent(key: widget.key,),
),
// Orders index 4
SizedBox(
height: MediaQuery.of(context).size.height > 700
? MediaQuery.of(context).size.height * 0.89
: 850,//MediaQuery.of(context).size.height * 0.90,//580,
width: MediaQuery.of(context).size.width,
child: OrdersContent(key: widget.key,),
),
// Bookings index 5
SizedBox(
height: MediaQuery.of(context).size.height > 700
? MediaQuery.of(context).size.height * 0.89
: 850,//MediaQuery.of(context).size.height * 0.90,//580,
width: MediaQuery.of(context).size.width,
child: BookingsContent(key: widget.key),
),
NavigationBarBottom()
];
PageView 项目:
List<Widget> slides = [
ScreenTypeLayout(
mobile: CloudBikingSlideMobile(
bgImage: mainBgImageMobile,
onTap: (){
controller.jumpTo(1);
// scrollController.jumpTo(index: 1);
// scrollController.scrollTo(index: 1, duration: Duration(milliseconds: 300), curve: Curves.easeInOut);// .jumpTo(index: 1);
}),
desktop: CloudBikingSlideDesktop(
bgImage: mainBgImageDesktop,
onTap: (){
controller.jumpTo(1);
// scrollController.jumpTo(index: 1);
// scrollController.scrollTo(index: 1, duration: Duration(milliseconds: 300), curve: Curves.easeInOut);//.jumpTo(index: 1);
}),
),
ScreenTypeLayout(
mobile: StolenBicyclesSlideMobile(
bgImage: stolenBicyclesBgMobile,
onTap: (){
controller.jumpTo(2);
// scrollController.jumpTo(index: 2);
// scrollController.scrollTo(index: 2, duration: Duration(milliseconds: 300), curve: Curves.easeInOut);//.jumpTo(index: 2);
}),
desktop: StolenBicyclesSlideDesktop(
bgImage: stolenBicyclesBgDesktop,
onTap: (){
controller.jumpTo(2);
// scrollController.jumpTo(index: 2);
// scrollController.scrollTo(index: 2, duration: Duration(milliseconds: 300), curve: Curves.easeInOut);//.jumpTo(index: 2);
}),
),
ScreenTypeLayout(
mobile: SchedulerSlideMobile(
bgImage: schedulerBgImageMobile,
onTap: (){
controller.jumpTo(3);
// scrollController.jumpTo(index: 3);
// scrollController.scrollTo(index: 3, duration: Duration(milliseconds: 300), curve: Curves.easeInOut);//.jumpTo(index: 3);
}),
desktop: SchedulerSlideDesktop(
bgImage: schedulerBgImageDesktop,
onTap: (){
controller.jumpTo(3);
// scrollController.jumpTo(index: 3);
// scrollController.scrollTo(index: 3, duration: Duration(milliseconds: 300), curve: Curves.easeInOut);//.jumpTo(index: 3);
}),
),
ScreenTypeLayout(
mobile: OrdersSlideMobile(
bgImage: orderBgImageMobile,
onTap: (){
controller.jumpTo(4);
// scrollController.jumpTo(index: 4);
// scrollController.scrollTo(index: 4, duration: Duration(milliseconds: 300), curve: Curves.easeInOut);//.jumpTo(index: 4);
}),
desktop: OrdersSlideDesktop(
bgImage: orderBgImageDesktop,
onTap: (){
controller.jumpTo(4);
// scrollController.jumpTo(index: 4);
// scrollController.scrollTo(index: 4, duration: Duration(milliseconds: 300), curve: Curves.easeInOut);//.jumpTo(index: 4);
}),
),
ScreenTypeLayout(
mobile: BookingsSlideMobile(
bgImage: bookingBgImageMobile,
onTap: (){
controller.jumpTo(5);
// scrollController.jumpTo(index: 5);
// scrollController.scrollTo(index: 5, duration: Duration(milliseconds: 300), curve: Curves.easeInOut);//.jumpTo(index: 5);
}),
desktop: BookingsSlideDesktop(
bgImage: bookingBgImageDesktop,
onTap: (){
controller.jumpTo(5);
// scrollController.jumpTo(index: 5);
// scrollController.scrollTo(index: 5, duration: Duration(milliseconds: 300), curve: Curves.easeInOut);//.jumpTo(index: 5);
}),
),
];
列表视图:
Scaffold(
backgroundColor: Colors.transparent,
body: Container(
color: Colors.transparent,
child: Scrollbar(
controller: controller,
isAlwaysShown: true,
thickness: 10,
radius: Radius.circular(5),
// child: ScrollablePositionedList.builder(
// itemScrollController: scrollController,
// initialScrollIndex: 0,
// itemCount: homePageItems.length,
// itemBuilder: (BuildContext context, int index) => homePageItems[index],
child: ListView.builder(
controller: controller,
itemCount: homePageItems.length,
itemBuilder: (BuildContext context, int index) => homePageItems[index],
),
),
),
);