1

carousel_slider: ^2.3.1

2.代码为:

import 'package:carousel_slider/carousel_controller.dart';
import 'package:carousel_slider/carousel_options.dart';
import 'package:carousel_slider/carousel_slider.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'dart:ui';final List<String> imgList = ['https://images.unsplash.com/photo-1520342868574-5fa3804e551c?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=6ff92caffcdd63681a35134a6770ed3b&auto=format&fit=crop&w=1951&q=80','https://images.unsplash.com/photo-1522205408450-add114ad53fe?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=368f45b0888aeb0b7b08e3a1084d3ede&auto=format&fit=crop&w=1950&q=80','https://images.unsplash.com/photo-1519125323398-675f0ddb6308?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=94a1e718d89ca60a6337a6008341ca50&auto=format&fit=crop&w=1950&q=80','https://images.unsplash.com/photo-1523205771623-e0faa4d2813d?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=89719a0d55dd05e2deae4120227e6efc&auto=format&fit=crop&w=1953&q=80','https://images.unsplash.com/photo-1508704019882-f9cf40e475b4?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=8c6e5e3aba713b17aa1fe71ab4f0ae5b&auto=format&fit=crop&w=1352&q=80','https://images.unsplash.com/photo-1519985176271-adb1088fa94c?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=a0c8d632e977f94e5d312d9893258f59&auto=format&fit=crop&w=1355&q=80'
];void main() => runApp(CarouselDemo());class CarouselDemo extends StatelessWidget {@overrideWidget build(BuildContext context) {return MaterialApp(initialRoute: '/',routes: {'/': (ctx) => CarouselDemoHome(),'/basic': (ctx) => BasicDemo(),'/nocenter': (ctx) => NoCenterDemo(),'/image': (ctx) => ImageSliderDemo(),'/complicated': (ctx) => ComplicatedImageDemo(),'/enlarge': (ctx) => EnlargeStrategyDemo(),'/manual': (ctx) => ManuallyControlledSlider(),'/noloop': (ctx) => NoonLoopingDemo(),'/vertical': (ctx) => VerticalSliderDemo(),'/fullscreen': (ctx) => FullscreenSliderDemo(),'/ondemand': (ctx) => OnDemandCarouselDemo(),'/indicator': (ctx) => CarouselWithIndicatorDemo(),'/prefetch': (ctx) => PrefetchImageDemo(),'/reason': (ctx) => CarouselChangeReasonDemo(),'/position': (ctx) => KeepPageviewPositionDemo(),'/multiple': (ctx) => MultipleItemDemo(),});}
}class DemoItem extends StatelessWidget {final String title;final String route;DemoItem(this.title, this.route);@overrideWidget build(BuildContext context) {return ListTile(title: Text(title),onTap: () {Navigator.pushNamed(context, route);},);}
}class CarouselDemoHome extends StatelessWidget {@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text('Carousel demo'),),body: ListView(children: <Widget>[DemoItem('Basic demo', '/basic'),DemoItem('No center mode demo', '/nocenter'),DemoItem('Image carousel slider', '/image'),DemoItem('More complicated image slider', '/complicated'),DemoItem('Enlarge strategy demo slider', '/enlarge'),DemoItem('Manually controlled slider', '/manual'),DemoItem('Noon-looping carousel slider', '/noloop'),DemoItem('Vertical carousel slider', '/vertical'),DemoItem('Fullscreen carousel slider', '/fullscreen'),DemoItem('Carousel with indicator demo', '/indicator'),DemoItem('On-demand carousel slider', '/ondemand'),DemoItem('Image carousel slider with prefetch demo', '/prefetch'),DemoItem('Carousel change reason demo', '/reason'),DemoItem('Keep pageview position demo', '/position'),DemoItem('Multiple item in one screen demo', '/multiple'),],),);}
}class BasicDemo extends StatelessWidget {@overrideWidget build(BuildContext context) {List<int> list = [1,2,3,4,5];return Scaffold(appBar: AppBar(title: Text('Basic demo')),body: Container(child: CarouselSlider(options: CarouselOptions(),items: list.map((item) => Container(child: Center(child: Text(item.toString())),color: Colors.green,)).toList(),)),);}
}class NoCenterDemo extends StatelessWidget {@overrideWidget build(BuildContext context) {List<int> list = [1,2,3,4,5];return Scaffold(appBar: AppBar(title: Text('Basic demo')),body: Container(child: CarouselSlider(options: CarouselOptions(disableCenter: true,),items: list.map((item) => Container(child: Text(item.toString()),color: Colors.green,)).toList(),)),);}
}class ImageSliderDemo extends StatelessWidget {@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text('Image slider demo')),body: Container(child: CarouselSlider(options: CarouselOptions(),items: imgList.map((item) => Container(child: Center(child: Image.network(item, fit: BoxFit.cover, width: 1000)),)).toList(),)),);}
}final List<Widget> imageSliders = imgList.map((item) => Container(child: Container(margin: EdgeInsets.all(5.0),child: ClipRRect(borderRadius: BorderRadius.all(Radius.circular(5.0)),child: Stack(children: <Widget>[Image.network(item, fit: BoxFit.cover, width: 1000.0),Positioned(bottom: 0.0,left: 0.0,right: 0.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. ${imgList.indexOf(item)} image',style: TextStyle(color: Colors.white,fontSize: 20.0,fontWeight: FontWeight.bold,),),),),],)),),
)).toList();class ComplicatedImageDemo extends StatelessWidget {@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text('Complicated image slider demo')),body: Container(child: Column(children: <Widget>[CarouselSlider(options: CarouselOptions(autoPlay: true,aspectRatio: 2.0,enlargeCenterPage: true,),items: imageSliders,),],)),);}
}class EnlargeStrategyDemo extends StatelessWidget {@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text('Complicated image slider demo')),body: Container(child: Column(children: <Widget>[CarouselSlider(options: CarouselOptions(autoPlay: true,aspectRatio: 2.0,enlargeCenterPage: true,enlargeStrategy: CenterPageEnlargeStrategy.height,),items: imageSliders,),],)),);}
}class ManuallyControlledSlider extends StatefulWidget {@overrideState<StatefulWidget> createState() {return _ManuallyControlledSliderState();}
}class _ManuallyControlledSliderState extends State<ManuallyControlledSlider> {final CarouselController _controller = CarouselController();@overridevoid initState() {super.initState();}@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text('Manually controlled slider')),body: SingleChildScrollView(child: Column(children: <Widget>[CarouselSlider(items: imageSliders,options: CarouselOptions(enlargeCenterPage: true, height: 200),carouselController: _controller,),Row(mainAxisAlignment: MainAxisAlignment.spaceBetween,children: <Widget>[Flexible(child: RaisedButton(onPressed: () => _controller.previousPage(),child: Text('←'),),),Flexible(child: RaisedButton(onPressed: () => _controller.nextPage(),child: Text('→'),),),...Iterable<int>.generate(imgList.length).map((int pageIndex) => Flexible(child: RaisedButton(onPressed: () => _controller.animateToPage(pageIndex),child: Text("$pageIndex"),),),),],)],),));}
}class NoonLoopingDemo extends StatelessWidget {@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text('Noon-looping carousel demo')),body: Container(child: CarouselSlider(options: CarouselOptions(aspectRatio: 2.0,enlargeCenterPage: true,enableInfiniteScroll: false,initialPage: 2,autoPlay: true,),items: imageSliders,)),);}
}class VerticalSliderDemo extends StatelessWidget {@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text('Vertical sliding carousel demo')),body: Container(child: CarouselSlider(options: CarouselOptions(aspectRatio: 2.0,enlargeCenterPage: true,scrollDirection: Axis.vertical,autoPlay: true,),items: imageSliders,)),);}
}class FullscreenSliderDemo extends StatelessWidget {@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text('Fullscreen sliding carousel demo')),body: Builder(builder: (context) {final double height = MediaQuery.of(context).size.height;return CarouselSlider(options: CarouselOptions(height: height,viewportFraction: 1.0,enlargeCenterPage: false,// autoPlay: false,),items: imgList.map((item) => Container(child: Center(child: Image.network(item, fit: BoxFit.cover, height: height,)),)).toList(),);},),);}
}class OnDemandCarouselDemo extends StatelessWidget {@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text('On-demand carousel demo')),body: Container(child: CarouselSlider.builder(itemCount: 100,options: CarouselOptions(aspectRatio: 2.0,enlargeCenterPage: true,autoPlay: true,),itemBuilder: (ctx, index) {return Container(child: Text(index.toString()),);},)),);}
}class CarouselWithIndicatorDemo extends StatefulWidget {@overrideState<StatefulWidget> createState() {return _CarouselWithIndicatorState();}
}class _CarouselWithIndicatorState extends State<CarouselWithIndicatorDemo> {int _current = 0;@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text('Carousel with indicator demo')),body: Column(children: [CarouselSlider(items: imageSliders,options: CarouselOptions(autoPlay: true,enlargeCenterPage: true,aspectRatio: 2.0,onPageChanged: (index, reason) {setState(() {_current = index;});}),),Row(mainAxisAlignment: MainAxisAlignment.center,children: imgList.map((url) {int index = imgList.indexOf(url);return Container(width: 8.0,height: 8.0,margin: EdgeInsets.symmetric(vertical: 10.0, horizontal: 2.0),decoration: BoxDecoration(shape: BoxShape.circle,color: _current == index? Color.fromRGBO(0, 0, 0, 0.9): Color.fromRGBO(0, 0, 0, 0.4),),);}).toList(),),]),);}
}class PrefetchImageDemo extends StatefulWidget {@overrideState<StatefulWidget> createState() {return _PrefetchImageDemoState();}
}class _PrefetchImageDemoState extends State<PrefetchImageDemo> {final List<String> images = ['https://images.unsplash.com/photo-1586882829491-b81178aa622e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2850&q=80','https://images.unsplash.com/photo-1586871608370-4adee64d1794?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2862&q=80','https://images.unsplash.com/photo-1586901533048-0e856dff2c0d?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1650&q=80','https://images.unsplash.com/photo-1586902279476-3244d8d18285?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2850&q=80','https://images.unsplash.com/photo-1586943101559-4cdcf86a6f87?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1556&q=80','https://images.unsplash.com/photo-1586951144438-26d4e072b891?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1650&q=80','https://images.unsplash.com/photo-1586953983027-d7508a64f4bb?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1650&q=80',];@overridevoid initState() {WidgetsBinding.instance.addPostFrameCallback((_) {images.forEach((imageUrl) {precacheImage(NetworkImage(imageUrl), context);});});super.initState();}@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text('Prefetch image slider demo')),body: Container(child: CarouselSlider.builder(itemCount: images.length,options: CarouselOptions(autoPlay: true,aspectRatio: 2.0,enlargeCenterPage: true,),itemBuilder: (context, index) {return Container(child: Center(child: Image.network(images[index], fit: BoxFit.cover, width: 1000)),);},)),);}
}class CarouselChangeReasonDemo extends StatefulWidget {@overrideState<StatefulWidget> createState() {return _CarouselChangeReasonDemoState();}
}class _CarouselChangeReasonDemoState extends State<CarouselChangeReasonDemo> {String reason = '';final CarouselController _controller = CarouselController();void onPageChange(int index, CarouselPageChangedReason changeReason) {setState(() {reason = changeReason.toString();});}@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text('Change reason demo')),body: SingleChildScrollView(child: Column(children: <Widget>[CarouselSlider(items: imageSliders,options: CarouselOptions(enlargeCenterPage: true,aspectRatio: 16/9,onPageChanged: onPageChange,autoPlay: true,),carouselController: _controller,),Row(mainAxisAlignment: MainAxisAlignment.spaceBetween,children: <Widget>[Flexible(child: RaisedButton(onPressed: () => _controller.previousPage(),child: Text('←'),),),Flexible(child: RaisedButton(onPressed: () => _controller.nextPage(),child: Text('→'),),),...Iterable<int>.generate(imgList.length).map((int pageIndex) => Flexible(child: RaisedButton(onPressed: () => _controller.animateToPage(pageIndex),child: Text("$pageIndex"),),),),],),Center(child: Column(children: [Text('page change reason: '),Text(reason),],),)],),));}
}class KeepPageviewPositionDemo extends StatelessWidget {@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text('Keep pageview position demo')),body: ListView.builder(itemBuilder: (ctx, index) {if (index == 3) {return Container(child: CarouselSlider(options: CarouselOptions(aspectRatio: 2.0,enlargeCenterPage: true,pageViewKey: PageStorageKey<String>('carousel_slider'),),items: imageSliders,));} else {return Container(margin: EdgeInsets.symmetric(vertical: 20),color: Colors.blue,height: 200,child: Center(child: Text('other content'),),);}}),);}
}class MultipleItemDemo extends StatelessWidget {@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text('Multiple item in one slide demo')),body: Container(child: CarouselSlider.builder(options: CarouselOptions(aspectRatio: 2.0,enlargeCenterPage: false,viewportFraction: 1,),itemCount: (imgList.length / 2).round(),itemBuilder: (context, index) {final int first = index * 2;final int second = first + 1;return Row(children: [first, second].map((idx) {return Expanded(flex: 1,child: Container(margin: EdgeInsets.symmetric(horizontal: 10),child: Image.network(imgList[idx], fit: BoxFit.cover),),);}).toList(),);},)),);}
}

>dart run split.dart
split.dart: Warning: Interpreting this as package URI, 'package:samples_index/src/split.dart'.
../../../../../flutter/packages/flutter/lib/src/semantics/semantics.dart:2121:39: Warning: Operand of null-aware operation '!' has type 'List<SemanticsNode>' which
 excludes null.
 - 'List' is from 'dart:core'.
 - 'SemanticsNode' is from 'package:flutter/src/semantics/semantics.dart' ('../../../../../flutter/packages/flutter/lib/src/semantics/semantics.dart').
    for (int position = 0; position < childrenInDefaultOrder!.length; position += 1) {
                                      ^
split.dart:6:8: Error: Not found: 'dart:ui'
import 'dart:ui';
       ^
../../../../../flutter/packages/flutter/lib/src/material/animated_icons.dart:11:8: Error: Not found: 'dart:ui'
import 'dart:ui' as ui show Paint, Path, Canvas;
       ^
../../../../../flutter/packages/flutter/lib/src/material/animated_icons.dart:12:8: Error: Not found: 'dart:ui'
import 'dart:ui' show lerpDouble;
       ^
../../../../../flutter/packages/flutter/lib/src/material/app.dart:7:8: Error: Not found: 'dart:ui'
import 'dart:ui' as ui;
       ^
../../../../../flutter/packages/flutter/lib/src/material/app_bar_theme.dart:7:8: Error: Not found: 'dart:ui'
import 'dart:ui' show lerpDouble;
       ^
../../../../../flutter/packages/flutter/lib/src/material/arc.dart:8:8: Error: Not found: 'dart:ui'
import 'dart:ui' show lerpDouble;
       ^
../../../../../flutter/packages/flutter/lib/src/material/bottom_app_bar_theme.dart:7:8: Error: Not found: 'dart:ui'
import 'dart:ui' show lerpDouble;
       ^
../../../../../flutter/packages/flutter/lib/src/material/bottom_navigation_bar_theme.dart:7:8: Error: Not found: 'dart:ui'
import 'dart:ui' show lerpDouble;
       ^
../../../../../flutter/packages/flutter/lib/src/material/bottom_sheet.dart:8:8: Error: Not found: 'dart:ui'
import 'dart:ui' show lerpDouble;
       ^
../../../../../flutter/packages/flutter/lib/src/material/bottom_sheet_theme.dart:7:8: Error: Not found: 'dart:ui'
import 'dart:ui' show lerpDouble;
       ^

carousel_slider 踩坑里面没有起来相关推荐

  1. 【golang程序包推荐分享】分享亿点点golang json操作及myJsonMarshal程序包开发的踩坑经历 :)

    目录[阅读时间:约5分钟] 一.概述 1.Json的作用 2.Go官方 encoding/json 包 3. golang json的主要操作 二.Json Marshal:将数据编码成json字符串 ...

  2. java调用clang编译的so_写Java这么久,JDK源码编译过没?编译JDK源码踩坑纪实

    好奇害死羊 很多小伙伴们做Java开发,天天写Java代码,肯定离不开Java基础环境:JDK,毕竟我们写好的Java代码也是跑在JVM虚拟机上. 一般来说,我们学Java之前,第一步就是安装JDK环 ...

  3. python导入类有红线_python踩坑系列之导入包时下划红线及报错“No module named”问题...

    python踩坑系列之导入包时下划红线及报错"No module named"问题 使用pycharm编写Python时,自己写了一个包(commontool),在同级另一个路径下 ...

  4. mysql运维工资_MySQL运维踩坑

    image ZERO 背景 本文主要是介绍在MySQL使用运维过程中所遇到的一些坑爹的地方,予自己以做记录! 前言 因操作系统重装之后,安装了mysql5.7,而由此带来了一系列的问题,现将解决这些m ...

  5. 微信跳一跳高分辅助踩坑

    旧博文,搬到 csdn 原文:http://rebootcat.com/2018/01/08/wechat_jump_hack/ 最近挺火的微信跳一跳 最近新版微信的『跳一跳』小程序着实火了一把,也把 ...

  6. 【踩坑记录】记一次MySQL主从复制延迟的坑

    最近开发中遇到的一个MySQL主从延迟的坑,记录并总结,避免再次犯同样的错误. 情景 一个活动信息需要审批,审批之后才能生效.因为之后活动要编辑,编辑后也可能触发审批,审批中展示的是编辑前的活动内容, ...

  7. 分布式深度学习最佳入门(踩坑)指南

    点击上方"视学算法",选择加"星标"或"置顶" 重磅干货,第一时间送达 作者丨Lyon@知乎(已授权) 来源丨https://zhuanla ...

  8. python array赋值_从踩坑学Python内部原理(5):执行时机的差异

    (给Python开发者加星标,提升Python技能) 英文:Satwik Kansal,翻译:暮晨 Python开发者整理自 GitHub [导读]:Python 是一个设计优美的解释型高级语言,它提 ...

  9. 小程序统一服务消息_[miniblog]小程序订阅消息踩坑记

    有阵子没有更新我的mini-blog了,这次把推送消息那块做了些改动,小程序的模板消息即将废弃,订阅消息终于来了. 关于订阅消息 订阅消息分为一次性订阅和长期订阅,长期订阅就不说啦,不是个人号可以染指 ...

最新文章

  1. 十一Python之路,Day6 - 面向对象学习
  2. 10大申请攻略+套磁技巧助你完胜美研申请
  3. 浅谈JavaScript中的事件
  4. 【Linux系统编程】IO多路复用之epoll
  5. scp命令默认传输速度多大_每天一个linux命令(60):scp命令
  6. python获取对象的大小_Python实现计算对象的内存大小示例
  7. mybatis注解开发_Spring Boot 中集成 MyBatis
  8. 使用Calender类获取系统时间和时间和运算
  9. NO.128 开发团队篇:参加项目计划会议,分解任务,领取任务,每天更新任务。...
  10. 读书笔记 摘自:《硅谷钢铁侠:埃隆·马斯克的冒险人生》的笔记(作者: 【美】阿什利·万斯)
  11. MASM入门(二)MASM基本语法
  12. 安卓手机阅读器_电子阅读器怎么选择全价位攻略(少走坑)
  13. 计算机桌面文件删除不掉是怎么了,如何解决电脑桌面文件无法删除问题
  14. 红旗 Linux 5.0 正式版下载地址
  15. 内网穿透服务器搭建教程,NPS使用教程
  16. 解决——zip压缩包解压后的文件全是乱码问题
  17. 零中频接收机频率转换图_低成本ADS-B接收机去混合技术
  18. H5音频处理——踩坑之旅
  19. java 静态方法枷锁_Java synchronized静态方法使用synchronized加锁
  20. WebRTC错误[1]Failed to set remote answer sdp: Called in wrong state: stable

热门文章

  1. 学习高中竞赛究竟要花多少钱?北大保送生给你算了一笔账
  2. 旋转or跳跃?基于互联网视频的人体运动捕捉
  3. 《时代周刊》评出2011年度全球50个最佳网站
  4. 数据库集群分类和介绍
  5. SqlSession解析
  6. 如何在BOSS直聘上增加你的面试几率
  7. 用漫画的形式学习Python,Python好书推荐——《看漫画学Python》
  8. 你知道你的电脑 1 秒钟能做多少事情吗?
  9. 当你的移动硬盘读写速度慢到令人抓狂的时候
  10. 轻量级的开源代理服务器Tinyproxy安装与配置