我使用以下示例代码在应用中启动并运行轮播：
https://github.com/serenader2014/flutter_carousel_slider/blob/master/example/lib/main.dart
我唯一的变化是我没有从Firestore数据库中获取图像列表，而是设置了图像列表。我的代码看起来像这样。
import 'package:carousel_slider/carousel_slider.dart';
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:inlife/widgets/iconcontent.dart';
import 'package:inlife/widgets/menu.dart';
import 'package:inlife/widgets/reusablecard.dart';
import 'package:inlife/utils/constants.dart';
import 'package:inlife/utils/globals.dart' as globals;
class HomePage extends StatefulWidget {
@override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
int _current=0;
List<Widget> _items = [];
_fetchHomeSliderImgs() {
globals.home_slider_images.clear();
final fireStore = Firestore.instance;
fireStore
.collection('home_slider')
.getDocuments().then((QuerySnapshot snapshot){
snapshot.documents.forEach((record){
String img = record.data['img'];
print(record.data.toString());
globals.home_slider_images.add(img);
});
});
}
@override
initState(){
print('Init State Called');
super.initState();
_fetchHomeSliderImgs();
_items = map<Widget>(
globals.home_slider_images,
(index,i){
return Container(
margin: EdgeInsets.all(5.0),
child: Stack(
children: <Widget>[
Image.network(i,fit: BoxFit.cover),
Positioned(bottom: 0,left: 0,right: 0,
child: Container(
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [Color.fromARGB(200, 0, 0, 0), Color.fromARGB(0, 0, 0, 0)],
begin: Alignment.bottomCenter,
end: Alignment.topCenter
),
),
padding: EdgeInsets.symmetric(vertical: 10.0,horizontal: 20.0),
child: Text('No $index image : $i',
style: TextStyle(
color: Colors.white,
fontSize: 20,
fontWeight: FontWeight.bold
)
,),
)
)
],
),
);
}
);
}
Widget buildCarousel(){
return CarouselSlider(
viewportFraction: 1.0,
height: 300,
autoPlay: true,
onPageChanged: (index){
setState(() {
_current = index;
print(_current);
});
},
items: _items
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Image(
image: AssetImage(
'assets/images/logo_white.png'
),
),
elevation: 50,
actions: <Widget>
[
IconButton(icon:Icon(FontAwesomeIcons.search),
iconSize: 20,
onPressed: (){
print("Search Button");
},
),
IconButton(
icon: Icon(FontAwesomeIcons.shoppingCart),
iconSize: 20,
onPressed: (){
print("Shopping Cart Button");
},
),
IconButton(
icon: Icon(FontAwesomeIcons.user),
iconSize: 20,
onPressed: (){
print("Profile Button");
},
)
],
),
drawer: Menu(),
body: Container(
child: Column(
children: <Widget>[
Expanded(
flex: 2,
child: Padding(
padding: const EdgeInsets.all(5.0),
child: buildCarousel()
),
),
Expanded(
flex: 3,
child: Row(
children: <Widget>[
Expanded(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Expanded(
child: ReusableCard(
colour: kActiveCardColour,
cardChild: IconContent(
icon: FontAwesomeIcons.shoppingBag,
label: 'Inlife',
),
onPress: _clickedInlife,
),
),
Expanded(
child: ReusableCard(
colour: kActiveCardColour,
cardChild: IconContent(
icon: FontAwesomeIcons.paperPlane,
label: 'Viajes Inlife',
),
onPress: _clickedTravel,
),
)
],
),
),
Expanded(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Expanded(
child: ReusableCard(
colour: kActiveCardColour,
cardChild: IconContent(
icon: FontAwesomeIcons.heartbeat,
label: 'Salud',
),
onPress: _clickedSalud,
),
),
Expanded(
child: ReusableCard(
colour: kActiveCardColour,
cardChild: IconContent(
icon: FontAwesomeIcons.camera,
label: 'Entretenimiento',
),
onPress: _clickedEntretainment,
),
),
],
),
)
],
),
)
],
),
),
);
}
_clickedInlife() {
Navigator.pushNamed(context, '/inlife');
}
_clickedTravel() {
print('Viajes');
}
_clickedSalud() {
print('Salud');
}
_clickedEntretainment() {
print('Entretenimiento');
}
}
我收到以下错误：
I/flutter (27116): Init State Called
I/flutter (27116): ══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════
I/flutter (27116): The following IntegerDivisionByZeroException was thrown building:
I/flutter (27116): IntegerDivisionByZeroException
I/flutter (27116):
I/flutter (27116): When the exception was thrown, this was the stack:
I/flutter (27116): #0 int.% (dart:core-patch/integers.dart:34:7)
I/flutter (27116): #1 _remainder (package:carousel_slider/carousel_slider.dart:287:28)
I/flutter (27116): #2 _getRealIndex (package:carousel_slider/carousel_slider.dart:281:10)
I/flutter (27116): #3 _CarouselSliderState.build.<anonymous closure> (package:carousel_slider/carousel_slider.dart:231:13)
I/flutter (27116): #4 SliverChildBuilderDelegate.build (package:flutter/src/widgets/sliver.dart:442:15)
I/flutter (27116): #5 SliverMultiBoxAdaptorElement._build.<anonymous closure> (package:flutter/src/widgets/sliver.dart:1153:67)
I/flutter (27116): #6 _HashMap.putIfAbsent (dart:collection-patch/collection_patch.dart:137:29)
I/flutter (27116): #7 SliverMultiBoxAdaptorElement._build (package:flutter/src/widgets/sliver.dart:1153:26)
I/flutter (27116): #8 SliverMultiBoxAdaptorElement.createChild.<anonymous closure> (package:flutter/src/widgets/sliver.dart:1166:55)
I/flutter (27116): #9 BuildOwner.buildScope (package:flutter/src/widgets/framework.dart:2328:19)
I/flutter (27116): #10 SliverMultiBoxAdaptorElement.createChild (package:flutter/src/widgets/sliver.dart:1159:11)
I/flutter (27116): #11 RenderSliverMultiBoxAdaptor._createOrObtainChild.<anonymous closure> (package:flutter/src/rendering/sliver_multi_box_adaptor.dart:354:23)
I/flutter (27116): #12 RenderObject.invokeLayoutCallback.<anonymous closure> (package:flutter/src/rendering/object.dart:1797:58)
I/flutter (27116): #13 PipelineOwner._enableMutationsToDirtySubtrees (package:flutter/src/rendering/object.dart:875:15)
I/flutter (27116): #14 RenderObject.invokeLayoutCallback (package:flutter/src/rendering/object.dart:1797:13)
I/flutter (27116): #15 RenderSliverMultiBoxAdaptor._createOrObtainChild (package:flutter/src/rendering/sliver_multi_box_adaptor.dart:343:5)
I/flutter (27116): #16 RenderSliverMultiBoxAdaptor.addInitialChild (package:flutter/src/rendering/sliver_multi_box_adaptor.dart:427:5)
I/flutter (27116): #17 RenderSliverFixedExtentBoxAdaptor.performLayout (package:flutter/src/rendering/sliver_fixed_extent_list.dart:196:12)
I/flutter (27116): #18 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #19 RenderViewportBase.layoutChildSequence (package:flutter/src/rendering/viewport.dart:406:13)
I/flutter (27116): #20 RenderViewport._attemptLayout (package:flutter/src/rendering/viewport.dart:1352:12)
I/flutter (27116): #21 RenderViewport.performLayout (package:flutter/src/rendering/viewport.dart:1270:20)
I/flutter (27116): #22 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #23 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #24 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #25 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #26 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #27 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #28 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #29 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #30 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #31 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #32 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #33 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #34 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #35 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #36 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #37 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #38 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #39 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #40 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #41 RenderConstrainedBox.performLayout (package:flutter/src/rendering/proxy_box.dart:259:13)
I/flutter (27116): #42 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #43 RenderPadding.performLayout (package:flutter/src/rendering/shifted_box.dart:206:11)
I/flutter (27116): #44 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #45 RenderFlex.performLayout (package:flutter/src/rendering/flex.dart:806:17)
I/flutter (27116): #46 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #47 MultiChildLayoutDelegate.layoutChild (package:flutter/src/rendering/custom_layout.dart:142:11)
I/flutter (27116): #48 _ScaffoldLayout.performLayout (package:flutter/src/material/scaffold.dart:444:7)
I/flutter (27116): #49 MultiChildLayoutDelegate._callPerformLayout (package:flutter/src/rendering/custom_layout.dart:212:7)
I/flutter (27116): #50 RenderCustomMultiChildLayoutBox.performLayout (package:flutter/src/rendering/custom_layout.dart:356:14)
I/flutter (27116): #51 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #52 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #53 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #54 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #55 _RenderCustomClip.performLayout (package:flutter/src/rendering/proxy_box.dart:1232:11)
I/flutter (27116): #56 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #57 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #58 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #59 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #60 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #61 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #62 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #63 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #64 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #65 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #66 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #67 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #68 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #69 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #70 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #71 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #72 RenderOffstage.performLayout (package:flutter/src/rendering/proxy_box.dart:3140:13)
I/flutter (27116): #73 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #74 RenderStack.performLayout (package:flutter/src/rendering/stack.dart:510:15)
I/flutter (27116): #75 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #76 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #77 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #78 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #79 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #80 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #81 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #82 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #83 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #84 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #85 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #86 RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (27116): #87 RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
I/flutter (27116): #88 RenderView.performLayout (package:flutter/src/rendering/view.dart:152:13)
I/flutter (27116): #89 RenderObject._layoutWithoutResize (package:flutter/src/rendering/object.dart:1578:7)
I/flutter (27116): #90 PipelineOwner.flushLayout (package:flutter/src/rendering/object.dart:844:18)
I/flutter (27116): #91 RendererBinding.drawFrame (package:flutter/src/rendering/binding.dart:341:19)
I/flutter (27116): #92 WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:761:13)
I/flutter (27116): #93 RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:280:5)
I/flutter (27116): #94 SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:1033:15)
I/flutter (27116): #95 SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:975:9)
I/flutter (27116): #96 SchedulerBinding.scheduleWarmUpFrame.<anonymous closure> (package:flutter/src/scheduler/binding.dart:784:7)
I/flutter (27116): #105 _Timer._runTimers (dart:isolate-patch/timer_impl.dart:382:19)
I/flutter (27116): #106 _Timer._handleMessage (dart:isolate-patch/timer_impl.dart:416:5)
I/flutter (27116): #107 _RawReceivePortImpl._handleMessage (dart:isolate-patch/isolate_patch.dart:172:12)
I/flutter (27116): (elided 8 frames from package dart:async and package dart:async-patch)
I/flutter (27116): ════════════════════════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by widgets library ═══════════════════════════════════════════════════════
The following IntegerDivisionByZeroException was thrown building:
IntegerDivisionByZeroException
When the exception was thrown, this was the stack:
#0 int.% (dart:core-patch/integers.dart:34:7)
#1 _remainder (package:carousel_slider/carousel_slider.dart:287:28)
#2 _getRealIndex (package:carousel_slider/carousel_slider.dart:281:10)
#3 _CarouselSliderState.build.<anonymous closure> (package:carousel_slider/carousel_slider.dart:231:13)
#4 SliverChildBuilderDelegate.build (package:flutter/src/widgets/sliver.dart:442:15)
答案 0 :(得分：0)
对不起，您暂时无法使用转盘滑块从Firestone获取图像
答案 1 :(得分：0)
您无法将图像存储在Firestore中。但是，您可以将图像上传到Firebase存储上，然后从Firebase存储下载图像URL。将下载的图像URL存储在Firestore上，然后在NetworkImage Widget中从Firestore检索图像URL。 youtube上有一些教程可以为您提供这种方法的帮助。